Files
flxn-app/src/hooks/use-appshell-height.ts
2025-09-06 18:38:05 -05:00

22 lines
738 B
TypeScript

import { useMemo } from "react";
import { useIsMobile } from "./use-is-mobile";
import useRouterConfig from "@/features/core/hooks/use-router-config";
const useAppShellHeight = () => {
const isMobile = useIsMobile();
const { header } = useRouterConfig();
const height = useMemo(() => {
const appShellBottomPadding = isMobile ? "70px" : "0px";
const pageBottomPadding = "20px";
// const mobileNavbar = isMobile && !header.collapsed ? "4rem" : "0px";
const pullablePadding = "1.285rem";
return `calc(100dvh - var(--app-shell-header-height, 0px) - ${pullablePadding} - ${appShellBottomPadding} - ${pageBottomPadding})`;
}, [isMobile, header.collapsed]);
return height;
};
export default useAppShellHeight;