movie-web/src/setup/Layout.tsx
mrjvs 24aeb68f55 error boundary
Co-authored-by: Jip Frijlink <JipFr@users.noreply.github.com>
2023-02-24 21:45:14 +01:00

27 lines
700 B
TypeScript

import { Banner } from "@/components/Banner";
import { useBannerSize } from "@/hooks/useBanner";
import { useIsOnline } from "@/hooks/usePing";
import { ReactNode } from "react";
import { useTranslation } from "react-i18next";
export function Layout(props: { children: ReactNode }) {
const { t } = useTranslation();
const isOnline = useIsOnline();
const bannerSize = useBannerSize();
return (
<div>
<div className="fixed inset-x-0 z-[1000]">
{!isOnline ? <Banner type="error">{t("errors.offline")}</Banner> : null}
</div>
<div
style={{
paddingTop: `${bannerSize}px`,
}}
>
{props.children}
</div>
</div>
);
}