Consume the provided resource-envelope API snapshot. Preserve financial snapshots during refresh, observe synchronization without importing, and fence late responses across account and connection changes.
35 lines
1.2 KiB
TypeScript
35 lines
1.2 KiB
TypeScript
import type { FC } from "react";
|
|
import { useAccountsPageViewModel } from "./AccountsPage.vm";
|
|
import { AccountsPageEmpty } from "./components/AccountsPageEmpty.view";
|
|
import { AccountsPageError } from "./components/AccountsPageError.view";
|
|
import { AccountsPageLoaded } from "./components/AccountsPageLoaded.view";
|
|
import { AccountsPageLoading } from "./components/AccountsPageLoading.view";
|
|
|
|
const AccountsPage: FC = () => {
|
|
const viewModel = useAccountsPageViewModel();
|
|
if (viewModel.state === "loading") return <AccountsPageLoading />;
|
|
if (viewModel.state === "error") return <AccountsPageError {...viewModel} />;
|
|
if (viewModel.state === "empty")
|
|
return (
|
|
<AccountsPageEmpty
|
|
lastSuccessfulAt={viewModel.lastSuccessfulAt}
|
|
refreshing={viewModel.refreshing}
|
|
sourceError={viewModel.sourceError}
|
|
refreshError={viewModel.refreshError}
|
|
retry={viewModel.retry}
|
|
/>
|
|
);
|
|
return (
|
|
<AccountsPageLoaded
|
|
accounts={viewModel.accounts}
|
|
lastSuccessfulAt={viewModel.lastSuccessfulAt}
|
|
refreshing={viewModel.refreshing}
|
|
sourceError={viewModel.sourceError}
|
|
refreshError={viewModel.refreshError}
|
|
retry={viewModel.retry}
|
|
/>
|
|
);
|
|
};
|
|
|
|
export { AccountsPage };
|