diff --git a/src/pages/groups/GroupsPage.tsx b/src/pages/groups/GroupsPage.tsx index 924cde5..559a4cd 100644 --- a/src/pages/groups/GroupsPage.tsx +++ b/src/pages/groups/GroupsPage.tsx @@ -30,6 +30,7 @@ export function GroupsPage({ session, selectedCourseId }: { session: AuthSession const [summary, setSummary] = useState(emptySummary); const [unassignedStudents, setUnassignedStudents] = useState([]); const [platformOptions, setPlatformOptions] = useState([]); + const [loading, setLoading] = useState(true); const [error, setError] = useState(null); const [query, setQuery] = useState(''); const [page, setPage] = useState(1); @@ -71,6 +72,7 @@ export function GroupsPage({ session, selectedCourseId }: { session: AuthSession useEffect(() => { let cancelled = false; + setLoading(true); listInstructorGroups(session.accessToken, selectedCourseId || null) .then((payload) => { if (cancelled) return; @@ -81,6 +83,9 @@ export function GroupsPage({ session, selectedCourseId }: { session: AuthSession setGroups([]); setSummary(emptySummary); setError(reason.message); + }) + .finally(() => { + if (!cancelled) setLoading(false); }); return () => { @@ -260,7 +265,12 @@ export function GroupsPage({ session, selectedCourseId }: { session: AuthSession
- {error ? ( + {loading ? ( +
+
+ ) : error ? (

{error}

diff --git a/src/pages/platforms/PlatformsPage.tsx b/src/pages/platforms/PlatformsPage.tsx index b10bc9b..8259ede 100644 --- a/src/pages/platforms/PlatformsPage.tsx +++ b/src/pages/platforms/PlatformsPage.tsx @@ -56,6 +56,7 @@ export function PlatformsPage({ session }: { session: AuthSession }) { const [masterPlatforms, setMasterPlatforms] = useState([]); const [agents, setAgents] = useState([]); const [summary, setSummary] = useState(emptySummary); + const [loading, setLoading] = useState(true); const [query, setQuery] = useState(''); const [error, setError] = useState(null); const [page, setPage] = useState(1); @@ -137,6 +138,7 @@ export function PlatformsPage({ session }: { session: AuthSession }) { useEffect(() => { let cancelled = false; + setLoading(true); listInstructorPlatforms(session.accessToken) .then((payload) => { if (!cancelled) applyPayload(payload); @@ -147,6 +149,9 @@ export function PlatformsPage({ session }: { session: AuthSession }) { setMasterPlatforms([]); setSummary(emptySummary); setError(reason.message); + }) + .finally(() => { + if (!cancelled) setLoading(false); }); return () => { @@ -426,7 +431,12 @@ export function PlatformsPage({ session }: { session: AuthSession }) {
- {error ? ( + {loading ? ( +
+
+ ) : error ? (

{error}