e60b70de52
Implemented comprehensive JWT-based authentication with token refresh mechanism, user state management, and protected routes. Changes: - Upgraded API client from fetch to Axios with automatic token refresh interceptors - Created API configuration with centralized endpoint definitions - Implemented Zustand auth store for user state management with persistence - Created React Query hooks for login, register, logout, and current user - Built login and registration pages with form validation (Zod + React Hook Form) - Implemented AuthGuard component for route protection - Enhanced Header with user dropdown menu and logout functionality - Updated Sidebar with user information display at bottom - Added Team navigation item to sidebar - Configured environment variables for API base URL Technical Details: - JWT token storage in localStorage with secure key names - Automatic token refresh on 401 responses - Request queueing during token refresh to prevent race conditions - TypeScript strict typing throughout - ESLint compliant code (fixed type safety issues) - Proper error handling with user-friendly messages 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
33 lines
799 B
TypeScript
33 lines
799 B
TypeScript
'use client';
|
|
|
|
import { Header } from '@/components/layout/Header';
|
|
import { Sidebar } from '@/components/layout/Sidebar';
|
|
import { useUIStore } from '@/stores/ui-store';
|
|
import { AuthGuard } from '@/components/providers/AuthGuard';
|
|
|
|
export default function DashboardLayout({
|
|
children,
|
|
}: {
|
|
children: React.ReactNode;
|
|
}) {
|
|
const sidebarOpen = useUIStore((state) => state.sidebarOpen);
|
|
|
|
return (
|
|
<AuthGuard>
|
|
<div className="min-h-screen">
|
|
<Header />
|
|
<div className="flex">
|
|
<Sidebar />
|
|
<main
|
|
className={`flex-1 transition-all duration-200 ${
|
|
sidebarOpen ? 'ml-64' : 'ml-0'
|
|
}`}
|
|
>
|
|
<div className="p-6">{children}</div>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</AuthGuard>
|
|
);
|
|
}
|