import { ReactNode } from "react";

export default function MemberLayout({ children, header, footer, tab_bar }: { children: ReactNode, header?: ReactNode, footer?: ReactNode, tab_bar?: ReactNode }) {
    return (
        <div className="relative flex flex-col w-full h-svh overflow-clip ">
            <div className="flex-none min-h-[56px] border-b border-black/20">
                {header}
            </div>
            <div className="flex-none h-[4em]">
                {tab_bar}
            </div>

            <div className="flex-1 w-full h-full overflow-y-scroll">
                {children}
            </div>
            {footer && (
                <div className="flex-none h-[80px]">
                    {footer}
                </div>
            )}
        </div>
    );
}