'use client'

import type { ReactNode } from 'react'
import Header from '@/components/Header'
import Sidebar from '@/components/Sidebar'
import BackToTop from '@/components/BackToTop'

export default function FamilyPageShell({
    sidebarOpen,
    onMenuClick,
    onSidebarClose,
    children,
}: {
    sidebarOpen: boolean
    onMenuClick: () => void
    onSidebarClose: () => void
    children: ReactNode
}) {
    return (
        <div className="min-h-screen bg-white text-black dark:bg-[#0c0d0e] dark:text-white">
            <Header onMenuClick={onMenuClick} />
            <div className="flex-1 min-h-screen w-full max-w-full overflow-x-hidden pt-[60px]">
                <div className="flex">
                    <Sidebar mode="drawer" isOpen={sidebarOpen} onClose={onSidebarClose} />
                    <div className="flex min-w-0 flex-1 flex-col">{children}</div>
                </div>
            </div>
            <BackToTop />
        </div>
    )
}