Files
jaengseung-made/app/components/DashboardShell.tsx

52 lines
1.8 KiB
TypeScript

'use client';
import { useState } from 'react';
import { usePathname } from 'next/navigation';
import Sidebar from './Sidebar';
const AUTH_PATHS = ['/login', '/signup'];
export default function DashboardShell({ children }: { children: React.ReactNode }) {
const [sidebarOpen, setSidebarOpen] = useState(false);
const pathname = usePathname();
const isAuthPage = AUTH_PATHS.some((p) => pathname.startsWith(p));
if (isAuthPage) {
return <>{children}</>;
}
return (
<div className="dashboard-layout">
<Sidebar isOpen={sidebarOpen} onClose={() => setSidebarOpen(false)} />
<div className="flex-1 flex flex-col overflow-hidden min-w-0">
{/* Mobile top bar */}
<header className="lg:hidden flex items-center justify-between px-4 py-3 bg-[#04102b] border-b border-[#1a3a7a]/50 flex-shrink-0">
<button
onClick={() => setSidebarOpen(true)}
className="p-2 rounded-lg text-slate-400 hover:text-white hover:bg-slate-800 transition"
aria-label="메뉴 열기"
>
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 6h16M4 12h16M4 18h16" />
</svg>
</button>
<div className="flex items-center gap-2">
<div className="w-7 h-7 rounded-lg bg-gradient-to-br from-blue-500 to-violet-600 flex items-center justify-center text-white font-bold text-xs">
</div>
<span className="text-white font-bold text-base"></span>
</div>
<div className="w-9" />
</header>
{/* Main scrollable content */}
<main className="main-content">
{children}
</main>
</div>
</div>
);
}