Modified by www.SourceFiles.app
This commit is contained in:
@@ -1,78 +0,0 @@
|
||||
import { createFileRoute, Link, Outlet, useNavigate, useRouterState } from "@tanstack/react-router";
|
||||
import { useAuth, highestRole } from "@/hooks/use-auth";
|
||||
import { supabase } from "@/integrations/supabase/client";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import {
|
||||
GraduationCap, LayoutDashboard, Users, ClipboardCheck, Receipt,
|
||||
MessageSquare, FileText, CalendarDays, Settings, LogOut, Loader2, BookOpen, ClipboardList, Printer, Mail
|
||||
} from "lucide-react";
|
||||
import { useEffect } from "react";
|
||||
|
||||
export const Route = createFileRoute("/_authenticated")({
|
||||
ssr: false,
|
||||
component: ProtectedLayout,
|
||||
});
|
||||
|
||||
function ProtectedLayout() {
|
||||
const { user, roles, loading } = useAuth();
|
||||
const navigate = useNavigate();
|
||||
const path = useRouterState({ select: (s) => s.location.pathname });
|
||||
|
||||
useEffect(() => {
|
||||
if (!loading && !user) navigate({ to: "/auth" });
|
||||
}, [loading, user, navigate]);
|
||||
|
||||
if (loading || !user) {
|
||||
return <div className="min-h-screen flex items-center justify-center"><Loader2 className="h-6 w-6 animate-spin text-muted-foreground" /></div>;
|
||||
}
|
||||
|
||||
const role = highestRole(roles);
|
||||
const isAdmin = roles.includes("admin");
|
||||
|
||||
const nav = [
|
||||
{ to: "/dashboard", label: "Dashboard", icon: LayoutDashboard, show: true },
|
||||
{ to: "/students", label: "Students", icon: Users, show: true },
|
||||
{ to: "/classes", label: "Classes", icon: BookOpen, show: isAdmin || roles.includes("teacher") },
|
||||
{ to: "/attendance", label: "Attendance", icon: ClipboardCheck, show: isAdmin || roles.includes("teacher") },
|
||||
{ to: "/plans", label: "504 / IEP", icon: ClipboardList, show: isAdmin || roles.includes("teacher") },
|
||||
{ to: "/reports", label: "Reports", icon: Printer, show: isAdmin || roles.includes("teacher") },
|
||||
{ to: "/ledger", label: "Tuition", icon: Receipt, show: true },
|
||||
{ to: "/messages", label: "Messages", icon: MessageSquare, show: true },
|
||||
{ to: "/mail", label: "Mail", icon: Mail, show: isAdmin || roles.includes("teacher") },
|
||||
{ to: "/forms", label: "Forms", icon: FileText, show: true },
|
||||
{ to: "/calendar", label: "Calendar", icon: CalendarDays, show: true },
|
||||
{ to: "/admin", label: "Admin", icon: Settings, show: isAdmin },
|
||||
];
|
||||
|
||||
const signOut = async () => {
|
||||
await supabase.auth.signOut();
|
||||
navigate({ to: "/auth" });
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-muted/20 flex">
|
||||
<aside className="w-60 bg-card border-r flex flex-col no-print">
|
||||
<div className="h-16 border-b flex items-center px-4">
|
||||
<img src="/bayside-logo.png" alt="Bayside Academy" className="h-9 w-auto" />
|
||||
</div>
|
||||
<nav className="p-3 flex-1 space-y-1">
|
||||
{nav.filter((n) => n.show).map((n) => {
|
||||
const active = path.startsWith(n.to);
|
||||
return (
|
||||
<Link key={n.to} to={n.to} className={`flex items-center gap-2 px-3 py-2 rounded-md text-sm ${active ? "bg-primary text-primary-foreground" : "hover:bg-muted"}`}>
|
||||
<n.icon className="h-4 w-4" /> {n.label}
|
||||
</Link>
|
||||
);
|
||||
})}
|
||||
</nav>
|
||||
<div className="p-3 border-t">
|
||||
<div className="text-xs text-muted-foreground mb-2 px-1 truncate">{user.email}<br/><span className="capitalize">{role ?? "no role"}</span></div>
|
||||
<Button variant="ghost" size="sm" className="w-full justify-start" onClick={signOut}>
|
||||
<LogOut className="h-4 w-4 mr-2" /> Sign out
|
||||
</Button>
|
||||
</div>
|
||||
</aside>
|
||||
<main className="flex-1 overflow-auto"><Outlet /></main>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user