shafin808s/edbridge-scholars
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(nav): add tab-based practice test navigation

Browse Source
This commit is contained in:
shafin-r
2026-01-11 20:07:00 +06:00
parent 5f95b92e4b
commit c4c300da98
4 changed files with 406 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
src/pages/student/Home.tsx
View File

@ -1,5 +1,11 @@
import { useNavigate } from "react-router-dom";
import {
Tabs,
TabsTrigger,
TabsList,
TabsContent,
} from "../../components/ui/tabs";
import { useAuthStore } from "../../stores/authStore";
import { Search } from "lucide-react";
export const Home = () => {
const user = useAuthStore((state) => state.user);
@ -8,21 +14,65 @@ export const Home = () => {
return (
<div className="min-h-screen bg-gray-50">
<main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
<div className="bg-white rounded-lg shadow p-6">
<h2 className="text-2xl font-bold text-gray-800 mb-4">Dashboard</h2>
<div className="space-y-2 text-gray-600">
<p>Email: {user?.email}</p>
<p>Role: {user?.role}</p>
<p>Status: {user?.status}</p>
<p>
Member since:{" "}
{user?.joined_at
? new Date(user.joined_at).toLocaleDateString()
: "N/A"}
</p>
<main className="flex flex-col items-center justify-center gap-12 max-w-full mx-auto px-4 sm:px-6 lg:px-8 py-8">
<h1 className="text-4xl font-satoshi-bold tracking-tight text-gray-800">
Welcome, {user?.name || "Student"}
</h1>
<div className="relative w-full">
<input
type="text"
placeholder="Search..."
className="font-satoshi w-full pl-10 pr-4 py-3 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
/>
<div className="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">
<Search size={22} color="gray" />
</div>
</div>
<div>
<Tabs defaultValue="all" className="w-full">
<TabsList className="bg-transparent border-b rounded-none p-0">
<TabsTrigger
value="all"
className="font-satoshi-regular tracking-wide text-md rounded-none border-b-2 data-[state=active]:font-satoshi-medium data-[state=active]:border-b-indigo-800 data-[state=active]:text-indigo-800"
>
All status
</TabsTrigger>
<TabsTrigger
value="not-started"
className="font-satoshi-regular tracking-wide text-md rounded-none border-b-2 data-[state=active]:border-b-indigo-800 data-[state=active]:text-indigo-800"
>
Not Started
</TabsTrigger>
<TabsTrigger
value="in-progress"
className="font-satoshi-regular tracking-wide text-md rounded-none border-b-2 data-[state=active]:border-b-indigo-800 data-[state=active]:text-indigo-800"
>
In Progress
</TabsTrigger>
<TabsTrigger
value="completed"
className="font-satoshi-regular tracking-wide text-md rounded-none border-b-2 data-[state=active]:border-b-indigo-800 data-[state=active]:text-indigo-800"
>
Completed
</TabsTrigger>
</TabsList>
<TabsContent value="all">
<h1>All Status</h1>
</TabsContent>
<TabsContent value="not-started">
<h1>Not Started</h1>
</TabsContent>
<TabsContent value="in-progress">
<h1>In Progress</h1>
</TabsContent>
<TabsContent value="completed">
<h1>Completed</h1>
</TabsContent>
</Tabs>
</div>
</main>
</div>
);