46 lines
1.0 KiB
TypeScript
46 lines
1.0 KiB
TypeScript
import type { FC } from "react";
|
|
|
|
import { Paper, Skeleton, Stack } from "@mantine/core";
|
|
import { LoadingSkeleton } from "@wealthledger/ui";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
import classes from "../AccountIncomePage.module.css";
|
|
|
|
const AccountIncomePageLoading: FC = () => {
|
|
const { t } = useTranslation();
|
|
|
|
return (
|
|
<LoadingSkeleton label={t("states.loadingTitle")}>
|
|
<Stack gap="lg">
|
|
<Skeleton height={32} width="40%" />
|
|
|
|
<Paper p="md" radius="md" withBorder>
|
|
<Stack gap="sm">
|
|
<Skeleton height={20} width="20%" />
|
|
|
|
<div className={classes.fields}>
|
|
<Skeleton height={60} />
|
|
|
|
<Skeleton height={60} />
|
|
</div>
|
|
|
|
<Skeleton height={44} width="45%" />
|
|
</Stack>
|
|
</Paper>
|
|
|
|
<Skeleton height={100} radius="md" />
|
|
|
|
<Skeleton height={180} radius="md" />
|
|
|
|
<Skeleton height={24} width="25%" />
|
|
|
|
<Skeleton height={80} radius="md" />
|
|
|
|
<Skeleton height={80} radius="md" />
|
|
</Stack>
|
|
</LoadingSkeleton>
|
|
);
|
|
};
|
|
|
|
export { AccountIncomePageLoading };
|