initial

2026-08-11 21:09:32 +07:00
parent e63c8f61aa
commit 94c0c47fd0
44 changed files with 5215 additions and 71 deletions
@@ -0,0 +1,46 @@
+import { Link, Outlet } from 'react-router-dom';
+
+import env from '@/shared/config/env';
+import { useLogout } from '@/features/auth/hooks/useLogout';
+import { useAuthStore } from '@/features/auth/store/authStore';
+
+export function AppLayout() {
+  const user = useAuthStore((s) => s.user);
+  const logout = useLogout();
+
+  return (
+    <div className="min-h-screen bg-gray-50">
+      <header className="border-b border-gray-200 bg-white">
+        <div className="mx-auto flex h-14 max-w-5xl items-center justify-between px-4">
+          <div className="flex items-center gap-6">
+            <Link to="/" className="text-lg font-semibold text-gray-900">
+              {env.VITE_APP_NAME}
+            </Link>
+            <nav className="flex items-center gap-4 text-sm text-gray-600">
+              <Link to="/" className="hover:text-gray-900">
+                Home
+              </Link>
+              <Link to="/learn" className="hover:text-gray-900">
+                Learn
+              </Link>
+            </nav>
+          </div>
+          <div className="flex items-center gap-4">
+            {user && <span className="text-sm text-gray-500">{user.email}</span>}
+            <button
+              type="button"
+              onClick={() => logout.mutate()}
+              disabled={logout.isPending}
+              className="rounded-md border border-gray-300 px-3 py-1.5 text-sm font-medium text-gray-700 hover:bg-gray-100 disabled:opacity-50"
+            >
+              {logout.isPending ? 'Signing out…' : 'Sign out'}
+            </button>
+          </div>
+        </div>
+      </header>
+      <main className="mx-auto max-w-5xl px-4 py-8">
+        <Outlet />
+      </main>
+    </div>
+  );
+}