0c26dd85ef
- Convert CacheTTL enum to const object to fix duplicate value errors - Fix import ordering in test files (eslint-disable for vi.mock pattern) - Fix unused variable warnings (prefix with underscore) - Auto-fix import ordering in subscription page, dashboard layout - 0 lint errors remaining Co-Authored-By: Paperclip <noreply@paperclip.ing>
86 lines
3.7 KiB
TypeScript
86 lines
3.7 KiB
TypeScript
'use client';
|
||
|
||
import Link from 'next/link';
|
||
import { usePathname } from 'next/navigation';
|
||
import { useTheme } from '@/components/providers/theme-provider';
|
||
import { Button } from '@/components/ui/button';
|
||
import { useAuthStore } from '@/lib/auth-store';
|
||
import { cn } from '@/lib/utils';
|
||
|
||
const navItems = [
|
||
{ href: '/dashboard', label: 'Bảng điều khiển', icon: '🏠' },
|
||
{ href: '/listings', label: 'Tin đăng', icon: '📋' },
|
||
{ href: '/listings/new', label: 'Đăng tin', icon: '➕' },
|
||
{ href: '/analytics', label: 'Phân tích', icon: '📊' },
|
||
{ href: '/dashboard/profile', label: 'Hồ sơ', icon: '👤' },
|
||
{ href: '/dashboard/subscription', label: 'Gói dịch vụ', icon: '💎' },
|
||
{ href: '/dashboard/payments', label: 'Thanh toán', icon: '💳' },
|
||
];
|
||
|
||
export default function DashboardLayout({ children }: { children: React.ReactNode }) {
|
||
const pathname = usePathname();
|
||
const { user, logout } = useAuthStore();
|
||
const { theme, toggleTheme } = useTheme();
|
||
|
||
return (
|
||
<div className="min-h-screen bg-background">
|
||
<header className="sticky top-0 z-50 border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
|
||
<div className="mx-auto flex h-14 max-w-7xl items-center px-4">
|
||
<Link href="/" className="mr-6 flex items-center space-x-2">
|
||
<span className="text-lg font-bold text-primary">GoodGo</span>
|
||
</Link>
|
||
|
||
<nav aria-label="Bảng điều khiển" className="flex items-center space-x-1">
|
||
{navItems.map((item) => (
|
||
<Link
|
||
key={item.href}
|
||
href={item.href}
|
||
aria-label={item.label}
|
||
className={cn(
|
||
'rounded-md px-2 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground sm:px-3',
|
||
pathname === item.href || (item.href !== '/dashboard' && pathname.startsWith(item.href))
|
||
? 'bg-accent text-accent-foreground'
|
||
: 'text-muted-foreground',
|
||
)}
|
||
>
|
||
<span className="sm:mr-1.5">{item.icon}</span>
|
||
<span className="hidden sm:inline">{item.label}</span>
|
||
</Link>
|
||
))}
|
||
</nav>
|
||
|
||
<div className="ml-auto flex items-center space-x-3">
|
||
{user && (
|
||
<span className="hidden text-sm text-muted-foreground sm:inline">
|
||
{user.fullName}
|
||
</span>
|
||
)}
|
||
<Button
|
||
variant="ghost"
|
||
size="sm"
|
||
onClick={toggleTheme}
|
||
aria-label={theme === 'light' ? 'Chuyển sang chế độ tối' : 'Chuyển sang chế độ sáng'}
|
||
className="h-9 w-9 p-0"
|
||
>
|
||
{theme === 'light' ? (
|
||
<svg className="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z" />
|
||
</svg>
|
||
) : (
|
||
<svg className="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z" />
|
||
</svg>
|
||
)}
|
||
</Button>
|
||
<Button variant="ghost" size="sm" onClick={() => logout()}>
|
||
Đăng xuất
|
||
</Button>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<main id="main-content" className="mx-auto max-w-7xl px-4 py-6">{children}</main>
|
||
</div>
|
||
);
|
||
}
|