app/src/components/common/SidebarLayout.tsx

39 lines
909 B
TypeScript

import { type JSX, type Component, type ParentProps } from "solid-js";
import UserFooter from "./UserFooter";
interface SidebarLayoutProps {
header?: JSX.Element;
footer?: JSX.Element;
showFooter?: boolean;
showFooterSettings?: boolean;
onFooterSettingsClick?: () => void;
}
const SidebarLayout: Component<ParentProps<SidebarLayoutProps>> = (props) => {
return (
<div class="w-full h-full bg-gray-900 flex flex-col">
{/* header */}
{props.header && (
<div class="shrink-0">
{props.header}
</div>
)}
{/* body */}
<div class="flex-1 overflow-y-auto">
{props.children}
</div>
{/* footer */}
{props.showFooter && (
<UserFooter
showSettings={props.showFooterSettings}
onSettingsClick={props.onFooterSettingsClick}
/>
)}
</div>
);
};
export default SidebarLayout;