54 lines
1.2 KiB
TypeScript
54 lines
1.2 KiB
TypeScript
import type { FC } from "react";
|
|
|
|
import { Button, Stack, Text, Title } from "@mantine/core";
|
|
import { useTranslation } from "react-i18next";
|
|
import { Link } from "react-router";
|
|
|
|
import type { InvestmentResourceMeta } from "@/shared/api";
|
|
|
|
import {
|
|
type BrokerageAccountCard,
|
|
BrokerageAccountList,
|
|
} from "@/entities/brokerage-account";
|
|
import { SourceSyncStatus } from "@/shared/ui";
|
|
|
|
type AccountsPageLoadedProps = {
|
|
accounts: BrokerageAccountCard[];
|
|
meta: InvestmentResourceMeta;
|
|
};
|
|
|
|
const AccountsPageLoaded: FC<AccountsPageLoadedProps> = (props) => {
|
|
const { t } = useTranslation();
|
|
|
|
return (
|
|
<Stack gap="lg">
|
|
<Stack gap={4}>
|
|
<Title order={1}>{t("accounts.title")}</Title>
|
|
|
|
<Text c="dimmed" size="sm">
|
|
{t("accounts.subtitle")}
|
|
</Text>
|
|
|
|
<SourceSyncStatus
|
|
lastAttempt={props.meta.lastAttempt}
|
|
lastSuccessfulAt={props.meta.lastSuccessfulAt}
|
|
stale={props.meta.freshness === "stale"}
|
|
/>
|
|
</Stack>
|
|
|
|
<Button
|
|
component={Link}
|
|
to="/accounts/all"
|
|
variant="light"
|
|
w="fit-content"
|
|
>
|
|
{t("accounts.openAll")}
|
|
</Button>
|
|
|
|
<BrokerageAccountList accounts={props.accounts} />
|
|
</Stack>
|
|
);
|
|
};
|
|
|
|
export { AccountsPageLoaded };
|