64 lines
1.7 KiB
TypeScript
64 lines
1.7 KiB
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
import Providers from "@/components/Providers";
|
|
import Sidebar from "@/components/Sidebar";
|
|
import { DictionaryProvider } from "@/components/DictionaryContext";
|
|
|
|
export default function DashboardLayout({
|
|
children,
|
|
dict,
|
|
lang,
|
|
}: {
|
|
children: React.ReactNode;
|
|
dict: any;
|
|
lang: string;
|
|
}) {
|
|
const [isSidebarOpen, setIsSidebarOpen] = useState(false);
|
|
|
|
return (
|
|
<Providers>
|
|
<DictionaryProvider dictionary={dict}>
|
|
<div className={`app-layout ${isSidebarOpen ? "sidebar-open" : ""}`}>
|
|
{/* Mobile Overlay */}
|
|
<div
|
|
className="sidebar-overlay"
|
|
onClick={() => setIsSidebarOpen(false)}
|
|
/>
|
|
|
|
<Sidebar
|
|
dict={dict}
|
|
lang={lang}
|
|
onClose={() => setIsSidebarOpen(false)}
|
|
/>
|
|
|
|
<div className="main-content">
|
|
{/* Mobile Header */}
|
|
<header className="mobile-header">
|
|
<button
|
|
className="mobile-menu-btn"
|
|
onClick={() => setIsSidebarOpen(true)}
|
|
>
|
|
<MenuIcon />
|
|
</button>
|
|
<div className="mobile-logo">AyrisMail</div>
|
|
</header>
|
|
|
|
{children}
|
|
</div>
|
|
</div>
|
|
</DictionaryProvider>
|
|
</Providers>
|
|
);
|
|
}
|
|
|
|
function MenuIcon() {
|
|
return (
|
|
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
|
<line x1="4" x2="20" y1="12" y2="12" />
|
|
<line x1="4" x2="20" y1="6" y2="6" />
|
|
<line x1="4" x2="20" y1="18" y2="18" />
|
|
</svg>
|
|
);
|
|
}
|