37 lines
866 B
TypeScript
37 lines
866 B
TypeScript
import type { FC } from "react";
|
|
|
|
import { Alert, Button, Skeleton } from "@mantine/core";
|
|
import { LoadingSkeleton } from "@wealthledger/ui";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
type TbankConnectionErrorProps = {
|
|
retry: () => void;
|
|
};
|
|
|
|
const TbankConnectionLoading: FC = () => {
|
|
const { t } = useTranslation();
|
|
|
|
return (
|
|
<LoadingSkeleton label={t("states.loadingTitle")}>
|
|
<Skeleton height={20} width="45%" />
|
|
|
|
<Skeleton height={36} radius="sm" width={140} />
|
|
</LoadingSkeleton>
|
|
);
|
|
};
|
|
|
|
const TbankConnectionError: FC<TbankConnectionErrorProps> = (props) => {
|
|
const { retry } = props;
|
|
const { t } = useTranslation();
|
|
|
|
return (
|
|
<Alert color="red" title={t("tbank.statusError")}>
|
|
<Button onClick={retry} variant="subtle">
|
|
{t("tbank.retry")}
|
|
</Button>
|
|
</Alert>
|
|
);
|
|
};
|
|
|
|
export { TbankConnectionError, TbankConnectionLoading };
|