All files / src/app/teacher-page TeacherMainPage.jsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
/**
 * Modified by Allan Ninal — 2026-08-12
 *
 * Dropped a no-op <ThemePresets showTheme={false} /> mount. `showTheme` gates the
 * component's entire return and it has no effects, so the element rendered and did
 * nothing — the theme fetch it once existed for is already dispatched here directly.
 */
 
import React, { Suspense, useEffect } from "react";
import { Outlet } from "react-router-dom";
import { useDispatch, useSelector } from "react-redux";
import { Box } from "@mui/material";
 
import { ThemeToggleProvider } from "@/theme/ThemeContext";
import SimpleLoading from "@/utils/components/SimpleLoading";
import IdleChecker from "@/utils/components/idle-checker/IdleChecker";
import Copyright from "@/utils/components/copyright/Copyright";
import GlobalMaintenanceBanner from "@/utils/components/feature-access/GlobalMaintenanceBanner";
import { UpgradeDialogProvider } from "@/utils/components/feature-access/UpgradeDialogProvider";
 
import { _teacherGetData } from "@/store/slices/teacher/TeacherData";
import { fetchTeacherDistrictFeatures, fetchTeacherOrganization } from "@/store/slices/teacher/TeacherFeatureFlags";
import { _fetchTeacherTheme } from "@/store/slices/teacher/TeacherThemes";
 
import AppLayout from "./layout/AppLayout";
 
export default function TeacherMainPage() {
    const { isLoading } = useSelector((state) => state.TeacherData);
    const { isLoading: featuresLoading } = useSelector((state) => state.TeacherFeatureFlags);
    const { isLoading: themeLoading } = useSelector((state) => state.TeacherThemes);
    const dispatch = useDispatch();
 
    useEffect(() => {
        dispatch(_teacherGetData());
        dispatch(fetchTeacherDistrictFeatures());
        dispatch(fetchTeacherOrganization());
        dispatch(_fetchTeacherTheme());
    }, [dispatch]);
 
    const loading = isLoading || featuresLoading || themeLoading;
 
    return (
        <ThemeToggleProvider>
            {loading ? (
                <>
                    <SimpleLoading showLoading />
                </>
            ) : (
                <UpgradeDialogProvider userType="teacher">
                    <AppLayout>
                        <Box sx={{ minHeight: "100vh" }}>
                            <GlobalMaintenanceBanner userType="teacher" />
                            <Suspense fallback={<SimpleLoading showLoading />}>
                                <Outlet />
                            </Suspense>
                        </Box>
                    </AppLayout>
                    <Copyright />
                    <IdleChecker idleTime={60 * 5} />
                </UpgradeDialogProvider>
            )}
        </ThemeToggleProvider>
    );
}