Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 | 308x 1539x 1539x 1539x 308x 1417x 1417x 1079x | import React from "react";
import { useSuspenseQuery } from "@tanstack/react-query";
import { useTranslation } from "react-i18next";
import { AdminWrapper } from "~app/components/app/admin-wrapper";
import { Page } from "~app/components/page";
import { useConnectionIntentions } from "~app/hooks/use-connection-intentions";
import { useDebtsIntentions } from "~app/hooks/use-debts-intentions";
import { useTRPC } from "~app/utils/trpc";
const useShowAdmin = () => {
const trpc = useTRPC();
const { data: user } = useSuspenseQuery(trpc.user.get.queryOptions());
return user.user.role === "admin";
};
type Props = {
children: React.ReactNode;
} & Omit<React.ComponentProps<typeof Page>, "elements">;
export const ProtectedPage: React.FC<Props> = ({ children, ...props }) => {
const { t } = useTranslation("default");
return (
<Page
elements={React.useMemo(
() => [
{
iconName: "receipt",
pathname: "/receipts",
text: t("navigation.receipts"),
},
{
iconName: "debts",
text: t("navigation.debts"),
pathname: "/debts",
useBadgeAmount: useDebtsIntentions,
},
{
iconName: "users",
text: t("navigation.peers"),
pathname: "/peers",
useBadgeAmount: useConnectionIntentions,
},
{
iconName: "user",
text: t("navigation.user"),
pathname: "/user",
},
{
iconName: "settings",
text: t("navigation.settings"),
pathname: "/settings",
},
{
iconName: "admin",
pathname: "/admin",
text: t("navigation.admin"),
useShow: useShowAdmin,
PageWrapper: AdminWrapper,
ItemWrapper: AdminWrapper,
},
],
[t],
)}
{...props}
>
{children}
</Page>
);
};
|