08ab0d1a1e
La sidebar et le lab header utilisaient border-r, pr-4, ml-2, ml-auto au lieu des propriétés logiques CSS (border-e, pe-4, ms-2, ms-auto). En mode RTL (persan/arabe), ces propriétés physiques ne s'inversent pas, ce qui causait la sidebar à basculer du mauvais côté lors de la navigation vers Lab/Excalidraw. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
42 lines
1.7 KiB
TypeScript
42 lines
1.7 KiB
TypeScript
import { HeaderWrapper } from "@/components/header-wrapper";
|
|
import { Sidebar } from "@/components/sidebar";
|
|
import { ProvidersWrapper } from "@/components/providers-wrapper";
|
|
import { auth } from "@/auth";
|
|
import { detectUserLanguage } from "@/lib/i18n/detect-user-language";
|
|
import { loadTranslations } from "@/lib/i18n/load-translations";
|
|
|
|
export default async function MainLayout({
|
|
children,
|
|
}: Readonly<{
|
|
children: React.ReactNode;
|
|
}>) {
|
|
// Run auth + language detection + translation loading in parallel
|
|
const [session, initialLanguage] = await Promise.all([
|
|
auth(),
|
|
detectUserLanguage(),
|
|
]);
|
|
|
|
// Load initial translations server-side to prevent hydration mismatch
|
|
const initialTranslations = await loadTranslations(initialLanguage);
|
|
|
|
return (
|
|
<ProvidersWrapper initialLanguage={initialLanguage} initialTranslations={initialTranslations}>
|
|
<div className="bg-background-light dark:bg-background-dark font-display text-slate-900 dark:text-white overflow-hidden h-screen flex flex-col">
|
|
{/* Top Navigation - Style Keep */}
|
|
<HeaderWrapper user={session?.user} />
|
|
|
|
{/* Main Layout */}
|
|
<div className="flex flex-1 overflow-hidden">
|
|
{/* Sidebar Navigation - Style Keep */}
|
|
<Sidebar className="w-64 flex-none flex-col bg-white dark:bg-[#1e2128] border-e border-slate-200 dark:border-slate-800 overflow-y-auto hidden md:flex" user={session?.user} />
|
|
|
|
{/* Main Content Area */}
|
|
<main className="flex min-h-0 flex-1 flex-col overflow-y-auto bg-background-light dark:bg-background-dark p-4 scroll-smooth">
|
|
{children}
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</ProvidersWrapper>
|
|
);
|
|
}
|