Files
NextEdu/src/modules/settings/components/teacher-settings-view.tsx

116 lines
4.6 KiB
TypeScript

"use client"
import Link from "next/link"
import { User, Palette, Lock, LayoutDashboard, PenTool, CalendarDays, Library, FileQuestion } from "lucide-react"
import { signOut } from "next-auth/react"
import { ThemePreferencesCard } from "@/modules/settings/components/theme-preferences-card"
import { ProfileSettingsForm } from "@/modules/settings/components/profile-settings-form"
import { Button } from "@/shared/components/ui/button"
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/shared/components/ui/card"
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/shared/components/ui/tabs"
import { UserProfile } from "@/modules/users/data-access"
export function TeacherSettingsView({ user }: { user: UserProfile }) {
return (
<div className="flex h-full flex-col gap-8 p-8">
<div className="flex flex-col justify-between gap-4 md:flex-row md:items-center">
<div className="space-y-1">
<h1 className="text-3xl font-bold tracking-tight">Settings</h1>
<div className="text-sm text-muted-foreground">Manage your preferences and teaching workspace.</div>
</div>
<div className="flex items-center gap-2">
<Button asChild variant="outline">
<Link href="/teacher/dashboard">Back to dashboard</Link>
</Button>
</div>
</div>
<Tabs defaultValue="general" className="w-full">
<TabsList className="w-full justify-start">
<TabsTrigger value="general" className="gap-2">
<User className="h-4 w-4" />
General
</TabsTrigger>
<TabsTrigger value="appearance" className="gap-2">
<Palette className="h-4 w-4" />
Appearance
</TabsTrigger>
<TabsTrigger value="security" className="gap-2">
<Lock className="h-4 w-4" />
Security
</TabsTrigger>
</TabsList>
<TabsContent value="general" className="mt-6 space-y-6">
<ProfileSettingsForm user={user} />
<Card>
<CardHeader>
<CardTitle>Quick links</CardTitle>
<CardDescription>Jump to common teacher areas.</CardDescription>
</CardHeader>
<CardContent className="flex flex-wrap gap-2">
<Button asChild variant="outline">
<Link href="/profile">Profile</Link>
</Button>
<Button asChild variant="outline" className="gap-2">
<Link href="/teacher/dashboard">
<LayoutDashboard className="h-4 w-4" />
Dashboard
</Link>
</Button>
<Button asChild variant="outline" className="gap-2">
<Link href="/teacher/textbooks">
<Library className="h-4 w-4" />
Textbooks
</Link>
</Button>
<Button asChild variant="outline" className="gap-2">
<Link href="/teacher/exams/all">
<FileQuestion className="h-4 w-4" />
Exams
</Link>
</Button>
<Button asChild variant="outline" className="gap-2">
<Link href="/teacher/homework/assignments">
<PenTool className="h-4 w-4" />
Homework
</Link>
</Button>
<Button asChild variant="outline" className="gap-2">
<Link href="/teacher/classes/schedule">
<CalendarDays className="h-4 w-4" />
Schedule
</Link>
</Button>
</CardContent>
</Card>
</TabsContent>
<TabsContent value="appearance" className="mt-6 space-y-6">
<ThemePreferencesCard />
</TabsContent>
<TabsContent value="security" className="mt-6 space-y-6">
<Card>
<CardHeader>
<CardTitle>Session</CardTitle>
<CardDescription>Account access and session controls.</CardDescription>
</CardHeader>
<CardContent className="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
<div className="space-y-1">
<div className="text-sm font-medium">Sign out</div>
<div className="text-sm text-muted-foreground">Return to the login screen.</div>
</div>
<Button variant="outline" onClick={() => signOut({ callbackUrl: "/login" })}>
Log out
</Button>
</CardContent>
</Card>
</TabsContent>
</Tabs>
</div>
)
}