67 lines
1.7 KiB
React
67 lines
1.7 KiB
React
import GenericFallback from "../GenericFallback/index.jsx";
|
|
import Fallback from "../Fallback/index.jsx";
|
|
import { Typography } from "@mui/material";
|
|
import { useTheme } from "@emotion/react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { useIsAdmin } from "@/Hooks/useIsAdmin.js";
|
|
import PropTypes from "prop-types";
|
|
const PageStateWrapper = ({
|
|
networkError,
|
|
isLoading,
|
|
items,
|
|
type,
|
|
fallbackLink,
|
|
fallbackChildren,
|
|
children,
|
|
}) => {
|
|
const theme = useTheme();
|
|
const { t } = useTranslation();
|
|
const isAdmin = useIsAdmin();
|
|
const isEmpty = items === null || (Array.isArray(items) && items.length === 0);
|
|
const hasInitialized = items !== undefined && !(isLoading && isEmpty);
|
|
const showEmpty = !isLoading && isEmpty;
|
|
if (networkError) {
|
|
return (
|
|
<GenericFallback>
|
|
<Typography
|
|
variant="h1"
|
|
marginY={theme.spacing(4)}
|
|
color={theme.palette.primary.contrastTextTertiary}
|
|
>
|
|
{t("common.toasts.networkError")}
|
|
</Typography>
|
|
<Typography>{t("common.toasts.checkConnection")}</Typography>
|
|
</GenericFallback>
|
|
);
|
|
}
|
|
if (!hasInitialized) {
|
|
return null;
|
|
}
|
|
if (showEmpty) {
|
|
return (
|
|
<Fallback
|
|
type={type}
|
|
title={t(`${type}.fallback.title`)}
|
|
checks={t(`${type}.fallback.checks`, { returnObjects: true })}
|
|
link={fallbackLink}
|
|
isAdmin={isAdmin}
|
|
>
|
|
{fallbackChildren}
|
|
</Fallback>
|
|
);
|
|
}
|
|
return <>{children}</>;
|
|
};
|
|
|
|
PageStateWrapper.propTypes = {
|
|
networkError: PropTypes.any,
|
|
isLoading: PropTypes.bool,
|
|
items: PropTypes.oneOfType([PropTypes.array, PropTypes.oneOf([null])]),
|
|
type: PropTypes.string,
|
|
fallbackLink: PropTypes.string,
|
|
fallbackChildren: PropTypes.node,
|
|
children: PropTypes.node,
|
|
};
|
|
|
|
export default PageStateWrapper;
|