diff --git a/src/components/Dashboard/DashboardPage.tsx b/src/components/Dashboard/DashboardPage.tsx index 44eca404b..3483cef76 100644 --- a/src/components/Dashboard/DashboardPage.tsx +++ b/src/components/Dashboard/DashboardPage.tsx @@ -23,6 +23,29 @@ export function DashboardPage(props: DashboardPageProps) { const toast = useToast(); const teamList = useStore($teamList); + const [isLoading, setIsLoading] = useState(true); + const [selectedTeamId, setSelectedTeamId] = useState(); + + async function getAllTeams() { + if (teamList.length > 0) { + return; + } + + const { response, error } = await httpGet( + `${import.meta.env.PUBLIC_API_URL}/v1-get-user-teams`, + ); + if (error || !response) { + toast.error(error?.message || 'Something went wrong'); + return; + } + + $teamList.set(response); + } + + useEffect(() => { + getAllTeams().finally(() => setIsLoading(false)); + }, []); + const userAvatar = currentUser?.avatar ? `${import.meta.env.PUBLIC_AVATAR_BASE_URL}/${currentUser.avatar}` : '/images/default-avatar.png'; @@ -30,12 +53,71 @@ export function DashboardPage(props: DashboardPageProps) { return (
- +
+ setSelectedTeamId(undefined)} + avatar={userAvatar} + /> + {isLoading && ( + <> + + + + + )} + + {!isLoading && ( + <> + {teamList.map((team) => { + const { avatar } = team; + const avatarUrl = avatar + ? `${import.meta.env.PUBLIC_AVATAR_BASE_URL}/${avatar}` + : '/images/default-avatar.png'; + return ( + { + setSelectedTeamId(team._id); + }, + })} + avatar={avatarUrl} + /> + ); + })} + + + )} +
+ + {!selectedTeamId && ( + + )} + {selectedTeamId && }
); } + +function DashboardTabSkeleton() { + return ( +
+ ); +} diff --git a/src/components/Dashboard/TeamDashboard.tsx b/src/components/Dashboard/TeamDashboard.tsx index c006703db..f8aab7c4e 100644 --- a/src/components/Dashboard/TeamDashboard.tsx +++ b/src/components/Dashboard/TeamDashboard.tsx @@ -49,6 +49,8 @@ export function TeamDashboard(props: TeamDashboardProps) { return; } + setIsLoading(true); + setTeamMembers([]); getTeamProgress().finally(() => setIsLoading(false)); }, [teamId]); diff --git a/src/components/TeamActivity/TeamActivityPage.tsx b/src/components/TeamActivity/TeamActivityPage.tsx index de97a7b6d..5fe64182d 100644 --- a/src/components/TeamActivity/TeamActivityPage.tsx +++ b/src/components/TeamActivity/TeamActivityPage.tsx @@ -97,6 +97,18 @@ export function TeamActivityPage(props: TeamActivityPageProps) { return; } + setIsLoading(true); + setTeamActivities({ + data: { + users: [], + activities: [], + }, + totalCount: 0, + totalPages: 0, + currPage: 1, + perPage: 21, + }); + setCurrPage(1); getTeamProgress().then(() => { pageProgressMessage.set(''); setIsLoading(false);