Sidebar

app/api/user/validate/route.ts

@@ -30,7 +30,7 @@ export async function POST(request: NextRequest) {
             return NextResponse.json({ error: "User not found" }, { status: 404 });
         }
 
-        return NextResponse.json({ message: "Valid" }, { status: 200 });
+        return NextResponse.json({ message: "Valid", username: user.username, name: user.name }, { status: 200 });
 
     } catch (error: any) {
         return NextResponse.json({ error: "Internal Server Error" }, { status: 500 });

app/dashboard/DashboardPage.tsx

@@ -1,9 +1,20 @@
+"use client";
 
+import Sidebar from "@/components/Sidebar";
 
-export default function DashboardPage() {
+interface DashboardPageProps {
+    username: string;
+    name: string;
+}
+
+export default function DashboardPage({ username, name }: DashboardPageProps) {
     return (
         <div>
-            <h1>Dashboard</h1>
+            <Sidebar username={username} fullName={name}>
+                <main>
+                    <h1>Dashboard</h1>
+                </main>
+            </Sidebar>
         </div>
     );
 }

app/dashboard/page.tsx

@@ -11,6 +11,8 @@ import Cookies from "js-cookie";
 export default function Dashboard() {
   const router = useRouter();
   const [loading, setLoading] = useState(true);
+  const [username, setUsername] = useState("");
+  const [name, setName] = useState("");
 
   useEffect(() => {
     const init = async () => {
@@ -23,6 +25,8 @@ export default function Dashboard() {
         Cookies.remove("token");
         router.push("/");
       } else {
+        setUsername(response.data.username);
+        setName(response.data.name);
         setLoading(false);
       }
     };
@@ -32,6 +36,6 @@ export default function Dashboard() {
   if (loading) {
     return <Loading />;
   } else {
-    return <DashboardPage />;
+    return <DashboardPage username={username} name={name} />;
   }
 }