- sidebar-resize.tsx: hook useSidebarResize (localStorage persistence, 280-560px) - sidebar-resize-client.tsx: wrapper layout qui applique la largeur - layout.tsx: remplace div statique par SidebarResizeClient - Resize handle: barre 1px→3px au hover, brand-accent pendant drag - pointer events (pas mouse) pour support tactile - cursor: col-resize + userSelect:none pendant le drag L'utilisateur peut maintenant réduire ou élargir la zone de carnet en glissant la barre entre le sidebar et le contenu principal.
58 lines
2.2 KiB
TypeScript
58 lines
2.2 KiB
TypeScript
import { Suspense } from "react";
|
|
import { Sidebar } from "@/components/sidebar";
|
|
import { ProvidersWrapper } from "@/components/providers-wrapper";
|
|
import { auth } from "@/auth";
|
|
import { headers } from "next/headers";
|
|
import { detectUserLanguage, parseAcceptLanguage } from "@/lib/i18n/detect-user-language";
|
|
import { loadTranslations } from "@/lib/i18n/load-translations";
|
|
import { getAISettings } from "@/app/actions/ai-settings";
|
|
import { AIChatLayoutBridge } from "@/components/ai-chat-layout-bridge";
|
|
import { SidebarResizeClient } from "@/components/sidebar-resize-client";
|
|
|
|
|
|
export default async function MainLayout({
|
|
children,
|
|
}: Readonly<{
|
|
children: React.ReactNode;
|
|
}>) {
|
|
const headersList = await headers();
|
|
const browserLang = parseAcceptLanguage(headersList.get("accept-language"));
|
|
|
|
const [session, initialLanguage] = await Promise.all([
|
|
auth(),
|
|
detectUserLanguage(browserLang),
|
|
]);
|
|
|
|
const initialTranslations = await loadTranslations(initialLanguage);
|
|
|
|
const aiSettings = session?.user?.id
|
|
? await getAISettings(session.user.id)
|
|
: null;
|
|
const showAIAssistant = aiSettings?.paragraphRefactor !== false;
|
|
|
|
return (
|
|
<ProvidersWrapper
|
|
initialLanguage={initialLanguage}
|
|
initialTranslations={initialTranslations}
|
|
initialAiProcessingConsent={aiSettings?.aiProcessingConsent === true}
|
|
>
|
|
{/* No top-bar header — sidebar-only navigation (architectural-grid design) */}
|
|
<SidebarResizeClient>
|
|
<Suspense fallback={<div className="hidden w-80 shrink-0 md:block h-full self-stretch" />}>
|
|
<Sidebar user={session?.user} />
|
|
</Suspense>
|
|
|
|
<main className="flex min-h-0 flex-1 flex-col overflow-y-auto scroll-smooth bg-memento-paper dark:bg-background" id="main-content">
|
|
<a href="#main-content" className="sr-only focus:not-sr-only focus:absolute focus:z-[9999] focus:top-2 focus:left-2 focus:bg-brand-accent focus:text-white focus:px-4 focus:py-2 focus:rounded-lg focus:text-sm focus:font-bold">
|
|
Skip to content
|
|
</a>
|
|
{children}
|
|
</main>
|
|
</SidebarResizeClient>
|
|
|
|
{showAIAssistant && <AIChatLayoutBridge />}
|
|
</ProvidersWrapper>
|
|
);
|
|
}
|
|
|