\n);\n\n// Protected route component\nconst ProtectedRoute = ({ \n children, \n requiredRole \n}: { \n children: React.ReactNode, \n requiredRole?: \"student\" | \"admin\" \n}) => {\n const { user, isAuthenticated } = useAuth();\n \n if (!isAuthenticated) {\n return ;\n }\n \n if (requiredRole && user?.role !== requiredRole) {\n return ;\n }\n \n return <>{children};\n};\n\nconst App: React.FC = () => {\n const { isInitialized } = useDatabase();\n const { isAuthenticated, user } = useAuth();\n const [isOnline, setIsOnline] = useState(navigator.onLine);\n \n // Monitor online/offline status\n useEffect(() => {\n const handleOnline = () => setIsOnline(true);\n const handleOffline = () => setIsOnline(false);\n \n window.addEventListener(\"online\", handleOnline);\n window.addEventListener(\"offline\", handleOffline);\n \n return () => {\n window.removeEventListener(\"online\", handleOnline);\n window.removeEventListener(\"offline\", handleOffline);\n };\n }, []);\n \n // Show loading state while database is initializing\n if (!isInitialized) {\n return (\n

Initializing Application

Setting up local database...

\n );\n }\n \n // Determine the default route based on authentication and user role\n const getDefaultRoute = () => {\n if (!isAuthenticated) return \"/login\";\n return user?.role === \"admin\" ? \"/admin/dashboard\" : \"/student/dashboard\";\n };\n \n return (\n

\n {/* Offline indicator */}\n {!isOnline && (\n

\n You are currently offline. All changes will be saved locally.\n

\n )}\n \n }>\n \n {/* Default redirect */}\n } />\n \n {/* Auth routes */}\n } />\n } />\n \n {/* Student routes */}\n \n \n \n } />\n \n \n \n } />\n \n \n \n } />\n \n \n \n } />\n \n \n \n } />\n \n {/* Admin routes */}\n \n \n \n } />\n \n \n \n } />\n \n \n \n } />\n \n \n \n } />\n \n \n \n } />\n \n {/* 404 route */}\n } />\n \n \n

\n );\n};\n\nexport default App;","deleted","label",[167,168,149],"frontend","components","permalink","https://www.val.town/x/chrisboss/offlineexamapp/code/frontend/components/App.tsx","extension","actionData","errors"]