77 lines
2.1 KiB
TypeScript
77 lines
2.1 KiB
TypeScript
import type { FC } from "react";
|
|
|
|
import { Stack } from "@mantine/core";
|
|
import { StateView } from "@wealthledger/ui";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
import type { BrokerageAccount } from "@/entities/brokerage-account";
|
|
import type { InvestmentResourceMeta } from "@/shared/api";
|
|
|
|
import { BrokerageEventsPreview } from "@/entities/brokerage-event";
|
|
import { ReadRetry, type ReadRetryProps, SourceSyncStatus } from "@/shared/ui";
|
|
|
|
import type {
|
|
AccountPageIncomeSummary,
|
|
AccountPageRecentEvents,
|
|
AccountPageRecentOperations,
|
|
} from "../../../model/previews";
|
|
|
|
import { AccountHeading } from "./AccountHeading.view";
|
|
import { IncomeSummary } from "./IncomeSummary.view";
|
|
import { PortfolioStructure } from "./PortfolioStructure/PortfolioStructure";
|
|
import { RecentOperations } from "./RecentOperations.view";
|
|
|
|
type AccountPageEmptyProps = {
|
|
account?: BrokerageAccount;
|
|
accountId?: string;
|
|
incomeSummary?: AccountPageIncomeSummary;
|
|
readRetry?: ReadRetryProps;
|
|
recentEvents: AccountPageRecentEvents;
|
|
recentOperations: AccountPageRecentOperations;
|
|
source?: InvestmentResourceMeta;
|
|
};
|
|
|
|
const AccountPageEmpty: FC<AccountPageEmptyProps> = (props) => {
|
|
const { t } = useTranslation();
|
|
|
|
const text = t(
|
|
props.accountId === "all"
|
|
? "portfolio.allEmptyText"
|
|
: "portfolio.emptyText",
|
|
);
|
|
|
|
return (
|
|
<Stack>
|
|
<AccountHeading account={props.account} accountId={props.accountId} />
|
|
|
|
<SourceSyncStatus
|
|
lastAttempt={props.source?.lastAttempt}
|
|
lastSuccessfulAt={props.source?.lastSuccessfulAt}
|
|
stale={props.source?.freshness === "stale"}
|
|
/>
|
|
|
|
{!!props.readRetry && <ReadRetry {...props.readRetry} />}
|
|
|
|
<StateView text={text} title={t("portfolio.emptyTitle")} />
|
|
|
|
<PortfolioStructure
|
|
structure={{ currencies: [], unvaluedCategories: [] }}
|
|
/>
|
|
|
|
<RecentOperations
|
|
allAccounts={props.accountId === "all"}
|
|
operations={props.recentOperations}
|
|
/>
|
|
|
|
<BrokerageEventsPreview
|
|
allAccounts={props.accountId === "all"}
|
|
events={props.recentEvents}
|
|
/>
|
|
|
|
{!!props.incomeSummary && <IncomeSummary {...props.incomeSummary} />}
|
|
</Stack>
|
|
);
|
|
};
|
|
|
|
export { AccountPageEmpty };
|