feat: render hourly investment states

src/pages/account/ui/AccountPage/AccountPage.vm.test.tsx

@@ -173,14 +173,14 @@ it("keeps overview sections independent when their source data is incomplete", a
 	mockLoadedAccountPage();
 	server.use(
 		http.get("*/api/v1/brokerage-accounts/:accountId/portfolio", () =>
-			HttpResponse.json(resource(portfolio, { availability: "partial" })),
+			HttpResponse.json(resource(portfolio, { completeness: "incomplete" })),
 		),
 		http.get("*/api/v1/brokerage-accounts/:accountId/operations", () =>
 			HttpResponse.json(
 
 				resource(
 					{ hasNext: false, items: [], nextCursor: null },
-					{ availability: "partial" },
+					{ completeness: "incomplete" },
 				),
 			),
 		),
@@ -188,7 +188,7 @@ it("keeps overview sections independent when their source data is incomplete", a
 			HttpResponse.json(
 				resource(
 					{ events: [], incomeTotalsByCurrency: [] },
-					{ availability: "partial" },
+					{ completeness: "incomplete" },
 				),
 			),
 		),

src/pages/account/ui/AccountPage/AccountPage.vm.ts

@@ -1,6 +1,7 @@
 import { useParams } from "react-router";
 
 import type { Portfolio } from "@/entities/portfolio";
+import type { InvestmentResourceMeta } from "@/shared/api";
 
 import { useBrokerageOperations } from "@/entities/broker-operation";
 import {
@@ -45,6 +46,7 @@ type AccountPageEmptyViewModel = AccountPageContent & {
 type AccountPageLoadedViewModel = AccountPageContent & {
 	portfolio: Portfolio;
 	positionSections: AccountPagePositionSection[];
+	source?: InvestmentResourceMeta;
 	state: "loaded";
 };
 
@@ -87,7 +89,7 @@ function useAccountPageViewModel(): AccountPageViewModel {
 	const availability = useInitialAvailability({
 		hasContent: !!portfolio.data,
 		identity: accountId ?? "account",
-		isError: portfolio.isError || portfolio.meta?.sync.state === "failed",
+		isError: portfolio.isError || portfolio.meta?.lastAttempt.state === "failed",
 		isFetching: portfolio.isFetching,
 	});
 
@@ -105,7 +107,7 @@ function useAccountPageViewModel(): AccountPageViewModel {
 	const incomeSummary = toIncomeSummary(accountId, income);
 
 	if (
-		portfolio.meta?.availability === "complete"
+		portfolio.meta?.availability === "available"
 		&& portfolio.data.positions.length === 0
 		&& portfolio.data.cashBalances.length === 0
 	)
@@ -118,7 +120,7 @@ function useAccountPageViewModel(): AccountPageViewModel {
 			state: "empty" as const,
 		};
 
-	const isPartial = portfolio.meta?.availability === "partial";
+	const isPartial = portfolio.meta?.completeness === "incomplete";
 
 	return {
 		account,
@@ -129,6 +131,7 @@ function useAccountPageViewModel(): AccountPageViewModel {
 		positionSections: toAccountPagePositionSections(portfolio.data),
 		recentEvents,
 		recentOperations,
+		source: portfolio.meta,
 		state: "loaded" as const,
 	};
 }

src/pages/account/ui/AccountPage/components/AccountPageLoaded.view.tsx

@@ -5,8 +5,10 @@ import { useTranslation } from "react-i18next";
 
 import type { BrokerageAccount } from "@/entities/brokerage-account";
 import type { Portfolio } from "@/entities/portfolio";
+import type { InvestmentResourceMeta } from "@/shared/api";
 
 import { BrokerageEventsPreview } from "@/entities/brokerage-event";
+import { SourceSyncStatus } from "@/shared/ui";
 import { PortfolioStructure } from "@/widgets/portfolio-structure";
 
 import type { AccountPagePositionSection } from "../../../model/positions";
@@ -32,6 +34,7 @@ type AccountPageLoadedProps = {
 	positionSections: AccountPagePositionSection[];
 	recentEvents: AccountPageRecentEvents;
 	recentOperations: AccountPageRecentOperations;
+	source?: InvestmentResourceMeta;
 };
 
 const AccountPageLoaded: FC<AccountPageLoadedProps> = (props) => {
@@ -49,6 +52,12 @@ const AccountPageLoaded: FC<AccountPageLoadedProps> = (props) => {
 		<Stack gap="lg">
 			<AccountHeading account={props.account} accountId={props.accountId} />
 
+			<SourceSyncStatus
+				lastAttempt={props.source?.lastAttempt}
+				lastSuccessfulAt={props.source?.lastSuccessfulAt}
+				stale={props.source?.freshness === "stale"}
+			/>
+
 			{props.partial
 				? <Alert role="status">{t("investment.partial")}</Alert>
 				: <CurrencyCards amounts={props.portfolio.totalsByCurrency} />}