7 Commits
67 changed files with 591 additions and 776 deletions
+7 -6
View File
@@ -8,7 +8,7 @@ Vitest — отдельную JSDOM конфигурацию. Точные versi
[package.json](../package.json), реализация — source of truth. [package.json](../package.json), реализация — source of truth.
```text ```text
app → pages → features → entities → shared app → pages → widgets → features → entities → shared
page container → page VM → entity/feature query → shared/api → backend /api/v1 page container → page VM → entity/feature query → shared/api → backend /api/v1
↓ ↓
props → state/section views props → state/section views
@@ -30,13 +30,14 @@ contract; frontend не читает его checkout для генерации
| --- | --- | | --- | --- |
| Bootstrap, глобальные providers, routes | `app` | | Bootstrap, глобальные providers, routes | `app` |
| Композиция маршрута и поведение, нужное только этому экрану | `pages/<page>` | | Композиция маршрута и поведение, нужное только этому экрану | `pages/<page>` |
| Крупная переиспользуемая композиция экрана | `widgets/<widget>` |
| Самостоятельная пользовательская возможность с собственным смыслом | `features/<capability>` | | Самостоятельная пользовательская возможность с собственным смыслом | `features/<capability>` |
| Представление/поведение бизнес-сущности | `entities/<entity>` | | Представление/поведение бизнес-сущности | `entities/<entity>` |
| Переиспользуемый код без WealthLedger domain meaning | `shared` | | Переиспользуемый код без WealthLedger domain meaning | `shared` |
Локальный FSD profile: `app → pages → features → entities → shared`. Локальный FSD profile: `app → pages → widgets → features → entities → shared`.
Слой `widgets` не используется: композиция экрана и компонент для одной page Widget собирает несколько нижних слоёв в самостоятельный UI-блок; компонент для
остаются у page. Form, mutation или click handler сами по себе не одной page остаётся у page. Form, mutation или click handler сами по себе не
требуют feature. Два callers не делают domain helper generic shared. требуют feature. Два callers не делают domain helper generic shared.
Slice именуется по ответственности, а не `helpers`, `hooks` или `types`. Slice именуется по ответственности, а не `helpers`, `hooks` или `types`.
@@ -48,12 +49,12 @@ Slice именуется по ответственности, а не `helpers`,
Cross-slice consumer использует `@/` и `index.ts` владельца, например Cross-slice consumer использует `@/` и `index.ts` владельца, например
`@/entities/portfolio`. Alias Vite и TypeScript согласован. Другой slice не `@/entities/portfolio`. Alias Vite и TypeScript согласован. Другой slice не
импортирует внутренний файл напрямую. Slices `pages`, `features`, `entities` не зависят от соседнего slice своего слоя; импортирует внутренний файл напрямую. Slices `pages`, `widgets`, `features`, `entities` не зависят от соседнего slice своего слоя;
композиция принадлежит вышележащему owner. Existing меж-slice исключения композиция принадлежит вышележащему owner. Existing меж-slice исключения
не являются разрешением добавлять новые. не являются разрешением добавлять новые.
Направление зависимостей, public imports и запрет соседних slices в Направление зависимостей, public imports и запрет соседних slices в
`pages`, `features`, `entities` проверяет `npm run deps`. Внутренние imports `pages`, `widgets`, `features`, `entities` проверяет `npm run deps`. Внутренние imports
одного slice и связи shared segments этот запрет не ограничивает. одного slice и связи shared segments этот запрет не ограничивает.
Knip проверяет использование exports, а не смысл placement. Knip проверяет использование exports, а не смысл placement.
-25
View File
@@ -1,30 +1,5 @@
# Changelog # Changelog
## [1.4.0](https://git.personal.ksv741.ru/WealthLedger/frontend/compare/v1.3.0...v1.4.0) (2026-11-06)
### Features
* **investments:** warn and offer retry after exhausted read retries (WealthLedger/frontend[#55](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/55)) ([#136](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/136)) ([8ce1e8e](https://git.personal.ksv741.ru/WealthLedger/frontend/commit/8ce1e8e44486dcc23d4c074559ca2bb517880b60))
### Bug Fixes
* **account:** show source metadata on empty account and income (WealthLedger/frontend[#55](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/55)) ([#133](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/133)) ([9619dc9](https://git.personal.ksv741.ru/WealthLedger/frontend/commit/9619dc979172dbc16391206e801ed67862d20116))
* align audit findings for Events, currency and auth (WealthLedger/frontend[#155](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/155)) ([668f2ef](https://git.personal.ksv741.ru/WealthLedger/frontend/commit/668f2ef70e535a1222e7f600b1be4a31fefc6f8b))
### Refactoring
* **api:** consume bank operation oneOf contract (WealthLedger/frontend[#144](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/144)) ([#152](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/152)) ([2d070ce](https://git.personal.ksv741.ru/WealthLedger/frontend/commit/2d070ce2b54bbee466ecf6cc18b437910f0c07f8))
* drop dead query helpers and simplify read deadline (WealthLedger/frontend[#141](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/141)) ([#149](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/149)) ([5077bd4](https://git.personal.ksv741.ru/WealthLedger/frontend/commit/5077bd4f0baa4a59643e875485c2f08253cc198d))
* move portfolio structure into account page, drop widgets (WealthLedger/frontend[#139](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/139)) ([#140](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/140)) ([e2d143d](https://git.personal.ksv741.ru/WealthLedger/frontend/commit/e2d143df46e650139e49b7c80a886008ede86d2a))
* normalize view models and share breadcrumbs and titles (WealthLedger/frontend[#143](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/143)) ([#153](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/153)) ([2db39f2](https://git.personal.ksv741.ru/WealthLedger/frontend/commit/2db39f25d9478350ad56a1b2e2ca6496068257c5))
* replace repeated lazy page wrappers with lazyPage helper ([#131](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/131)) ([#132](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/132)) ([71fbe77](https://git.personal.ksv741.ru/WealthLedger/frontend/commit/71fbe7774d3ed63fcb84bc644da997921bc049b2))
* share path-root query predicate (WealthLedger/frontend[#142](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/142)) ([#154](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/154)) ([cadba8d](https://git.personal.ksv741.ru/WealthLedger/frontend/commit/cadba8d075daf9b20c0c9de97ad5bd8f5a3e74fc))
### Maintenance
* **api:** update OpenAPI snapshot with UpcomingEventsDto.window (WealthLedger/frontend[#134](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/134)) ([#135](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/135)) ([aaee959](https://git.personal.ksv741.ru/WealthLedger/frontend/commit/aaee9591d7880193ee9b0c14339e8477264e4a94))
* **deps:** set Renovate release age, PR limit and update groups (WealthLedger/main[#6](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/6)) ([#137](https://git.personal.ksv741.ru/WealthLedger/frontend/issues/137)) ([ad93725](https://git.personal.ksv741.ru/WealthLedger/frontend/commit/ad93725a84615ec329631b71ed8db33337085740))
## [1.3.0](https://git.personal.ksv741.ru/WealthLedger/frontend/compare/v1.2.1...v1.3.0) (2026-11-01) ## [1.3.0](https://git.personal.ksv741.ru/WealthLedger/frontend/compare/v1.2.1...v1.3.0) (2026-11-01)
### Features ### Features
+11 -5
View File
@@ -29,17 +29,17 @@ module.exports = {
}, },
{ {
from: { from: {
path: "^src/(app|pages|features|entities|shared)/([^/]+)/", path: "^src/(app|pages|widgets|features|entities|shared)/([^/]+)/",
}, },
name: "slices-must-use-public-api", name: "slices-must-use-public-api",
severity: "error", severity: "error",
to: { to: {
path: String.raw`^src/(app|pages|features|entities|shared)/([^/]+)/(?!index\.ts$)`, path: String.raw`^src/(app|pages|widgets|features|entities|shared)/([^/]+)/(?!index\.ts$)`,
pathNot: "^src/$1/$2/", pathNot: "^src/$1/$2/",
}, },
}, },
{ {
from: { path: "^src/(pages|features|entities)/([^/]+)/" }, from: { path: "^src/(pages|widgets|features|entities)/([^/]+)/" },
name: "no-same-layer-cross-slice-imports", name: "no-same-layer-cross-slice-imports",
severity: "error", severity: "error",
to: { path: "^src/$1/", pathNot: "^src/$1/$2/" }, to: { path: "^src/$1/", pathNot: "^src/$1/$2/" },
@@ -48,18 +48,24 @@ module.exports = {
from: { path: "^src/shared/" }, from: { path: "^src/shared/" },
name: "shared-must-not-depend-on-layers", name: "shared-must-not-depend-on-layers",
severity: "error", severity: "error",
to: { path: "^src/(entities|features|pages|app)/" }, to: { path: "^src/(entities|features|widgets|pages|app)/" },
}, },
{ {
from: { path: "^src/entities/" }, from: { path: "^src/entities/" },
name: "entities-must-not-depend-on-higher-layers", name: "entities-must-not-depend-on-higher-layers",
severity: "error", severity: "error",
to: { path: "^src/(features|pages|app)/" }, to: { path: "^src/(features|widgets|pages|app)/" },
}, },
{ {
from: { path: "^src/features/" }, from: { path: "^src/features/" },
name: "features-must-not-depend-on-higher-layers", name: "features-must-not-depend-on-higher-layers",
severity: "error", severity: "error",
to: { path: "^src/(widgets|pages|app)/" },
},
{
from: { path: "^src/widgets/" },
name: "widgets-must-not-depend-on-higher-layers",
severity: "error",
to: { path: "^src/(pages|app)/" }, to: { path: "^src/(pages|app)/" },
}, },
{ {
-9
View File
@@ -17,21 +17,12 @@ http {
default $http_x_forwarded_proto; default $http_x_forwarded_proto;
'' $scheme; '' $scheme;
} }
# One shared budget: the external proxy's client-IP forwarding is not verified.
map "$request_method:$uri" $auth_admission_key {
default "";
POST:/api/v1/auth/login auth;
POST:/api/v1/auth/register auth;
}
limit_req_zone $auth_admission_key zone=auth_admission:1m rate=2r/s;
limit_req_status 429;
server { server {
listen 8080; listen 8080;
server_name _; server_name _;
root /usr/share/nginx/html; root /usr/share/nginx/html;
resolver 127.0.0.11 valid=5s ipv6=off; resolver 127.0.0.11 valid=5s ipv6=off;
location /api/ { location /api/ {
limit_req zone=auth_admission burst=5 nodelay;
set $backend http://backend:3000; set $backend http://backend:3000;
proxy_pass $backend$request_uri; proxy_pass $backend$request_uri;
proxy_set_header Host $http_host; proxy_set_header Host $http_host;
+1 -6
View File
@@ -25,11 +25,7 @@ const readability = {
) )
context.report({ messageId: "schema", node }); context.report({ messageId: "schema", node });
}, },
FunctionDeclaration(node) { FunctionDeclaration: checkParameters,
checkParameters(node);
if (node.id?.name?.endsWith?.("ViewModel"))
context.report({ messageId: "vmName", node: node.id });
},
FunctionExpression: checkParameters, FunctionExpression: checkParameters,
ImportDeclaration(node) { ImportDeclaration(node) {
if ( if (
@@ -99,7 +95,6 @@ const readability = {
schema: "Declare Zod schemas in a dedicated *.schema.ts file.", schema: "Declare Zod schemas in a dedicated *.schema.ts file.",
svg: "Own SVG markup in packages/icons, and import its public component.", svg: "Own SVG markup in packages/icons, and import its public component.",
union: "Put complex union members on separate lines.", union: "Put complex union members on separate lines.",
vmName: "Name custom hooks use*Vm, not use*ViewModel.",
}, },
schema: [], schema: [],
type: "suggestion", type: "suggestion",
+2 -2
View File
@@ -1,12 +1,12 @@
{ {
"name": "wealth-ledger-frontend", "name": "wealth-ledger-frontend",
"version": "1.4.0", "version": "1.3.0",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "wealth-ledger-frontend", "name": "wealth-ledger-frontend",
"version": "1.4.0", "version": "1.3.0",
"workspaces": [ "workspaces": [
"packages/*" "packages/*"
], ],
+1 -1
View File
@@ -1,7 +1,7 @@
{ {
"name": "wealth-ledger-frontend", "name": "wealth-ledger-frontend",
"private": true, "private": true,
"version": "1.4.0", "version": "1.3.0",
"type": "module", "type": "module",
"engines": { "engines": {
"node": "24.22.1" "node": "24.22.1"
+1 -16
View File
@@ -1,30 +1,15 @@
{ {
"$schema": "https://docs.renovatebot.com/renovate-schema.json", "$schema": "https://docs.renovatebot.com/renovate-schema.json",
"extends": ["config:recommended", ":semanticCommitTypeAll(chore)", "security:minimumReleaseAgeNpm"], "extends": ["config:recommended", ":semanticCommitTypeAll(chore)"],
"timezone": "Europe/Moscow", "timezone": "Europe/Moscow",
"labels": ["dependencies"], "labels": ["dependencies"],
"dependencyDashboard": true, "dependencyDashboard": true,
"rangeStrategy": "pin", "rangeStrategy": "pin",
"prConcurrentLimit": 5,
"lockFileMaintenance": {
"enabled": true,
"schedule": ["before 4am on the first day of the month"]
},
"packageRules": [ "packageRules": [
{ {
"matchUpdateTypes": ["minor", "patch"], "matchUpdateTypes": ["minor", "patch"],
"groupName": "non-major dependencies" "groupName": "non-major dependencies"
}, },
{
"matchManagers": ["github-actions"],
"matchUpdateTypes": ["minor", "patch"],
"groupName": "non-major github actions"
},
{
"matchManagers": ["docker-compose", "dockerfile"],
"matchUpdateTypes": ["minor", "patch"],
"groupName": "non-major container images"
},
{ {
"matchUpdateTypes": ["major"], "matchUpdateTypes": ["major"],
"dependencyDashboardApproval": true "dependencyDashboardApproval": true
@@ -217,7 +217,6 @@ beforeEach(() => {
}), }),
), ),
incomeTotalsByCurrency: [], incomeTotalsByCurrency: [],
window: { from: "2026-09-01", to: "2026-10-01" },
}), }),
), ),
), ),
@@ -1,5 +1,6 @@
import type { FC } from "react"; import type { FC } from "react";
import { useDocumentTitle } from "@mantine/hooks";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useCurrentRoute } from "@/app/model"; import { useCurrentRoute } from "@/app/model";
@@ -7,12 +8,12 @@ import { useBankCard } from "@/entities/bank-card";
import { useBond } from "@/entities/bond"; import { useBond } from "@/entities/bond";
import { useBrokerageAccounts } from "@/entities/brokerage-account"; import { useBrokerageAccounts } from "@/entities/brokerage-account";
import { useStock } from "@/entities/stock"; import { useStock } from "@/entities/stock";
import { useAppDocumentTitle } from "@/shared/ui";
type DocumentTitleProps = { title: string }; type DocumentTitleProps = { title: string };
const DocumentTitle: FC<DocumentTitleProps> = (props): undefined => { const DocumentTitle: FC<DocumentTitleProps> = (props): undefined => {
useAppDocumentTitle(props.title); const { t } = useTranslation();
useDocumentTitle(`${props.title} — ${t("appName")}`);
}; };
type AccountDocumentTitleProps = { type AccountDocumentTitleProps = {
@@ -1,12 +1,12 @@
import type { FC, PropsWithChildren } from "react"; import type { FC, PropsWithChildren } from "react";
import { Button, Stack, Text, Title } from "@mantine/core"; import { Button, Stack, Text, Title } from "@mantine/core";
import { useDocumentTitle } from "@mantine/hooks";
import { Component } from "react"; import { Component } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { Link, useLocation } from "react-router"; import { Link, useLocation } from "react-router";
import { useAuth } from "@/features/auth"; import { useAuth } from "@/features/auth";
import { useAppDocumentTitle } from "@/shared/ui";
type BoundaryProps = PropsWithChildren<{ type BoundaryProps = PropsWithChildren<{
authenticated: boolean; authenticated: boolean;
@@ -37,7 +37,7 @@ class Boundary extends Component<BoundaryProps, State> {
const RouteErrorFallback: FC<RouteErrorFallbackProps> = (props) => { const RouteErrorFallback: FC<RouteErrorFallbackProps> = (props) => {
const { authenticated } = props; const { authenticated } = props;
const { t } = useTranslation(); const { t } = useTranslation();
useAppDocumentTitle(t("routeError.title")); useDocumentTitle(`${t("routeError.title")} — ${t("appName")}`);
const to = authenticated ? "/accounts" : "/login"; const to = authenticated ? "/accounts" : "/login";
return ( return (
+7 -17
View File
@@ -7,8 +7,10 @@ import { useCurrentRoute } from "@/app/model";
import { AccountBreadcrumbs } from "./AccountBreadcrumbs"; import { AccountBreadcrumbs } from "./AccountBreadcrumbs";
import { AccountScopeSwitch } from "./AccountScopeSwitch/AccountScopeSwitch"; import { AccountScopeSwitch } from "./AccountScopeSwitch/AccountScopeSwitch";
import { BondBreadcrumbs } from "./BondBreadcrumbs";
import { BreadcrumbTrail } from "./BreadcrumbTrail"; import { BreadcrumbTrail } from "./BreadcrumbTrail";
import { EntityBreadcrumbs } from "./EntityBreadcrumbs"; import { CardBreadcrumbs } from "./CardBreadcrumbs";
import { StockBreadcrumbs } from "./StockBreadcrumbs";
const AppBreadcrumbs: FC = () => { const AppBreadcrumbs: FC = () => {
const { t } = useTranslation(); const { t } = useTranslation();
@@ -24,16 +26,9 @@ const AppBreadcrumbs: FC = () => {
stock, stock,
} = useCurrentRoute(); } = useCurrentRoute();
if (bond) { if (bond) return <BondBreadcrumbs identifier={bond.params.bondId ?? ""} />;
return <EntityBreadcrumbs identifier={bond.params.bondId ?? ""} kind="bond" />; if (stock)
} return <StockBreadcrumbs identifier={stock.params.stockId ?? ""} />;
if (stock) {
return (
<EntityBreadcrumbs identifier={stock.params.stockId ?? ""} kind="stock" />
);
}
if (account && (section || !account.params.section)) if (account && (section || !account.params.section))
return ( return (
<Stack gap={0} mb="md"> <Stack gap={0} mb="md">
@@ -48,13 +43,8 @@ const AppBreadcrumbs: FC = () => {
/> />
</Stack> </Stack>
); );
if (card) return <CardBreadcrumbs identifier={card.params.cardId ?? ""} />;
if (card) {
return <EntityBreadcrumbs identifier={card.params.cardId ?? ""} kind="card" />;
}
if (cards) return <BreadcrumbTrail items={[{ label: t("bank.title") }]} />; if (cards) return <BreadcrumbTrail items={[{ label: t("bank.title") }]} />;
if (accounts) if (accounts)
return <BreadcrumbTrail items={[{ label: t("breadcrumbs.accounts") }]} />; return <BreadcrumbTrail items={[{ label: t("breadcrumbs.accounts") }]} />;
@@ -0,0 +1,25 @@
import type { FC } from "react";
import { useTranslation } from "react-i18next";
import { useBond } from "@/entities/bond";
import { BreadcrumbTrail } from "./BreadcrumbTrail";
type BondBreadcrumbsProps = { identifier: string };
const BondBreadcrumbs: FC<BondBreadcrumbsProps> = (props) => {
const { data } = useBond(props.identifier);
const { t } = useTranslation();
return (
<BreadcrumbTrail
items={[
{ label: t("bond.searchTitle"), to: "/bonds" },
{ label: data?.name ?? t("bond.instrument") },
]}
/>
);
};
export { BondBreadcrumbs };
@@ -39,4 +39,4 @@ const BreadcrumbTrail: FC<BreadcrumbTrailProps> = (props) => {
); );
}; };
export { BreadcrumbTrail, type Crumb }; export { BreadcrumbTrail };
@@ -0,0 +1,25 @@
import type { FC } from "react";
import { useTranslation } from "react-i18next";
import { useBankCard } from "@/entities/bank-card";
import { BreadcrumbTrail } from "./BreadcrumbTrail";
type CardBreadcrumbsProps = { identifier: string };
const CardBreadcrumbs: FC<CardBreadcrumbsProps> = (props) => {
const { data } = useBankCard(props.identifier);
const { t } = useTranslation();
return (
<BreadcrumbTrail
items={[
{ label: t("bank.title"), to: "/cards" },
{ label: data?.name ?? t("bank.card") },
]}
/>
);
};
export { CardBreadcrumbs };
@@ -1,48 +0,0 @@
import type { FC } from "react";
import { useTranslation } from "react-i18next";
import { useBankCard } from "@/entities/bank-card";
import { useBond } from "@/entities/bond";
import { useStock } from "@/entities/stock";
import type { Crumb } from "./BreadcrumbTrail";
import { BreadcrumbTrail } from "./BreadcrumbTrail";
type EntityBreadcrumbsProps = {
identifier: string;
kind:
| "bond"
| "card"
| "stock";
};
const EntityBreadcrumbs: FC<EntityBreadcrumbsProps> = (props) => {
const { identifier, kind } = props;
const { t } = useTranslation();
const bond = useBond(kind === "bond" ? identifier : "");
const card = useBankCard(kind === "card" ? identifier : "");
const stock = useStock(kind === "stock" ? identifier : "");
let parent: Crumb;
let name: string;
if (kind === "bond") {
parent = { label: t("bond.searchTitle"), to: "/bonds" };
name = bond.data?.name ?? t("bond.instrument");
}
else if (kind === "stock") {
parent = { label: t("stock.searchTitle"), to: "/stocks" };
name = stock.data?.name ?? t("stock.share");
}
else {
parent = { label: t("bank.title"), to: "/cards" };
name = card.data?.name ?? t("bank.card");
}
return <BreadcrumbTrail items={[parent, { label: name }]} />;
};
export { EntityBreadcrumbs };
@@ -0,0 +1,25 @@
import type { FC } from "react";
import { useTranslation } from "react-i18next";
import { useStock } from "@/entities/stock";
import { BreadcrumbTrail } from "./BreadcrumbTrail";
type StockBreadcrumbsProps = { identifier: string };
const StockBreadcrumbs: FC<StockBreadcrumbsProps> = (props) => {
const { data } = useStock(props.identifier);
const { t } = useTranslation();
return (
<BreadcrumbTrail
items={[
{ label: t("stock.searchTitle"), to: "/stocks" },
{ label: data?.name ?? t("stock.share") },
]}
/>
);
};
export { StockBreadcrumbs };
+10 -4
View File
@@ -5,7 +5,6 @@ import {
ApiErrorCode, ApiErrorCode,
apiErrorCode, apiErrorCode,
isApiErrorCode, isApiErrorCode,
isGetUnder,
} from "@/shared/api"; } from "@/shared/api";
import type { import type {
@@ -27,14 +26,21 @@ async function mutationData<T>(
return data; return data;
} }
const bankCardGetPredicate = isGetUnder(["/api/v1/bank-cards"]);
function useBankMutationOptions() { function useBankMutationOptions() {
const queryClient = useQueryClient(); const queryClient = useQueryClient();
const invalidate = () => const invalidate = () =>
queryClient.invalidateQueries({ queryClient.invalidateQueries({
predicate: ({ queryKey }) => bankCardGetPredicate(queryKey), predicate: ({ queryKey }) => {
const [method, path] = queryKey;
return (
method === "get"
&& typeof path === "string"
&& (path === "/api/v1/bank-cards"
|| path.startsWith("/api/v1/bank-cards/"))
);
},
}); });
return { return {
@@ -2,18 +2,19 @@ import type { QueryClient } from "@tanstack/react-query";
import { import {
apiQueryClient, apiQueryClient,
isGetUnder,
type paths, type paths,
} from "@/shared/api"; } from "@/shared/api";
type TbankConnectionStatus type TbankConnectionStatus
= paths["/api/v1/tbank-connection"]["get"]["responses"][200]["content"]["application/json"]; = paths["/api/v1/tbank-connection"]["get"]["responses"][200]["content"]["application/json"];
const investmentGetPredicate = isGetUnder([ function isInvestmentPath(path: string) {
"/api/v1/brokerage-accounts", return [
"/api/v1/stocks", "/api/v1/brokerage-accounts",
"/api/v1/bonds", "/api/v1/stocks",
]); "/api/v1/bonds",
].some(root => path === root || path.startsWith(`${root}/`));
}
const tbankConnectionQueryOptions = () => const tbankConnectionQueryOptions = () =>
apiQueryClient.queryOptions("get", "/api/v1/tbank-connection"); apiQueryClient.queryOptions("get", "/api/v1/tbank-connection");
@@ -26,7 +27,15 @@ function commitTbankConnectionBoundary(
) { ) {
queryClient.setQueryData(tbankConnectionQueryKey, status); queryClient.setQueryData(tbankConnectionQueryKey, status);
void queryClient.resetQueries({ void queryClient.resetQueries({
predicate: ({ queryKey }) => investmentGetPredicate(queryKey), predicate: ({ queryKey }) => {
const [method, path] = queryKey;
return (
method === "get"
&& typeof path === "string"
&& isInvestmentPath(path)
);
},
}); });
} }
@@ -4,16 +4,16 @@ import {
TbankConnectionError, TbankConnectionError,
TbankConnectionLoading, TbankConnectionLoading,
} from "./TbankConnectionSection.view"; } from "./TbankConnectionSection.view";
import { useTbankConnectionSectionVm } from "./TbankConnectionSection.vm"; import { useTbankConnectionViewModel } from "./TbankConnectionSection.vm";
import { TbankConnectionSectionLoaded } from "./TbankConnectionSectionLoaded"; import { TbankConnectionSectionLoaded } from "./TbankConnectionSectionLoaded";
const TbankConnectionSection: FC = () => { const TbankConnectionSection: FC = () => {
const vm = useTbankConnectionSectionVm(); const viewModel = useTbankConnectionViewModel();
if (vm.state === "loading") return <TbankConnectionLoading />; if (viewModel.state === "loading") return <TbankConnectionLoading />;
return vm.state === "error" return viewModel.state === "error"
? <TbankConnectionError retry={vm.retry} /> ? <TbankConnectionError retry={viewModel.retry} />
: <TbankConnectionSectionLoaded {...vm} />; : <TbankConnectionSectionLoaded {...viewModel} />;
}; };
export { TbankConnectionSection }; export { TbankConnectionSection };
@@ -2,7 +2,7 @@ import { useAuthenticatedQuery } from "@/shared/api";
import { tbankConnectionQueryOptions } from "../../model/connection-boundary"; import { tbankConnectionQueryOptions } from "../../model/connection-boundary";
function useTbankConnectionSectionVm() { function useTbankConnectionViewModel() {
const status = useAuthenticatedQuery({ const status = useAuthenticatedQuery({
...tbankConnectionQueryOptions(), ...tbankConnectionQueryOptions(),
}); });
@@ -22,4 +22,4 @@ function useTbankConnectionSectionVm() {
}; };
} }
export { useTbankConnectionSectionVm }; export { useTbankConnectionViewModel };
@@ -26,7 +26,7 @@ import { resource } from "@/test/resource";
import { server } from "@/test/server"; import { server } from "@/test/server";
import { AccountEventsPage } from "./AccountEventsPage"; import { AccountEventsPage } from "./AccountEventsPage";
import { useAccountEventsPageVm } from "./AccountEventsPage.vm"; import { useAccountEventsPageViewModel } from "./AccountEventsPage.vm";
const Navigation: FC = () => { const Navigation: FC = () => {
const location = useLocation(); const location = useLocation();
@@ -100,7 +100,7 @@ describe("Upcoming event date filters", () => {
); );
const queryClient = createTestQueryClient(); const queryClient = createTestQueryClient();
const { result } = renderHook(() => useAccountEventsPageVm(), { const { result } = renderHook(() => useAccountEventsPageViewModel(), {
wrapper: ({ children }) => ( wrapper: ({ children }) => (
<QueryClientProvider client={queryClient}> <QueryClientProvider client={queryClient}>
<MemoryRouter initialEntries={["?from=2099-02-01"]}> <MemoryRouter initialEntries={["?from=2099-02-01"]}>
@@ -146,7 +146,7 @@ describe("Upcoming event date filters", () => {
const queryClient = createTestQueryClient(); const queryClient = createTestQueryClient();
const { result } = renderHook( const { result } = renderHook(
() => useAccountEventsPageVm(), () => useAccountEventsPageViewModel(),
{ {
wrapper: ({ children }) => ( wrapper: ({ children }) => (
<QueryClientProvider client={queryClient}> <QueryClientProvider client={queryClient}>
@@ -176,11 +176,7 @@ describe("Upcoming event date filters", () => {
({ request }) => { ({ request }) => {
searches.push(new URL(request.url).search); searches.push(new URL(request.url).search);
return HttpResponse.json(resource({ return HttpResponse.json(resource({ events: [] }));
calculatedAt: "2026-08-14T00:00:00Z",
events: [],
window: { from: "2026-08-14", to: "2026-09-13" },
}));
}, },
), ),
); );
@@ -227,11 +223,7 @@ describe("Upcoming event date filters", () => {
"*/api/v1/brokerage-accounts/:accountId/events", "*/api/v1/brokerage-accounts/:accountId/events",
({ request }) => ({ request }) =>
new URL(request.url).searchParams.get("from") === defaultFrom new URL(request.url).searchParams.get("from") === defaultFrom
? HttpResponse.json(resource({ ? HttpResponse.json(resource({ events: [] }))
calculatedAt: "2026-08-14T00:00:00Z",
events: [],
window: { from: "2026-08-14", to: "2026-09-13" },
}))
: HttpResponse.json({ code: "VALIDATION_ERROR" }, { status: 400 }), : HttpResponse.json({ code: "VALIDATION_ERROR" }, { status: 400 }),
), ),
); );
@@ -264,7 +256,6 @@ describe("Upcoming event date filters", () => {
calculatedAt: "2099-01-01T00:00:00Z", calculatedAt: "2099-01-01T00:00:00Z",
events: [], events: [],
incomeTotalsByCurrency: [], incomeTotalsByCurrency: [],
window: { from: "2099-01-01", to: "2099-01-31" },
}), }),
); );
}, },
@@ -273,7 +264,6 @@ describe("Upcoming event date filters", () => {
renderEvents(accountId, ["?from=2026-02-01&to=2026-02-28"]); renderEvents(accountId, ["?from=2026-02-01&to=2026-02-28"]);
const from = await screen.findByLabelText("Период"); const from = await screen.findByLabelText("Период");
expect(from).toHaveTextContent("01.02.2026 – 28.02.2026"); expect(from).toHaveTextContent("01.02.2026 – 28.02.2026");
expect(screen.getByText(/Прогноз от .* на 01\.01\.2099 – 31\.01\.2099/)).toBeVisible();
expect(screen.getByRole("button", { name: "Применить" })).toBeDisabled(); expect(screen.getByRole("button", { name: "Применить" })).toBeDisabled();
expect(searches).toEqual(["?from=2026-02-01&to=2026-02-28"]); expect(searches).toEqual(["?from=2026-02-01&to=2026-02-28"]);
@@ -371,7 +361,7 @@ it("retains the previous complete forecast when its source refresh fails", async
); );
const queryClient = createTestQueryClient(); const queryClient = createTestQueryClient();
const { result } = renderHook(() => useAccountEventsPageVm(), { const { result } = renderHook(() => useAccountEventsPageViewModel(), {
wrapper: ({ children }) => ( wrapper: ({ children }) => (
<QueryClientProvider client={queryClient}> <QueryClientProvider client={queryClient}>
<MemoryRouter initialEntries={["/accounts/all/events"]}> <MemoryRouter initialEntries={["/accounts/all/events"]}>
@@ -17,8 +17,6 @@ const RETRIES_EXHAUSTED_MS = 6000;
const TEST_MS = 10_000; const TEST_MS = 10_000;
const snapshot = resource({ const snapshot = resource({
accountId: "account-1",
calculatedAt: "2026-08-14T00:00:00Z",
events: [ events: [
{ {
date: "2026-10-01", date: "2026-10-01",
@@ -34,7 +32,6 @@ const snapshot = resource({
}, },
], ],
incomeTotalsByCurrency: [{ currency: "RUB", value: "123.45" }], incomeTotalsByCurrency: [{ currency: "RUB", value: "123.45" }],
window: { from: "2026-08-14", to: "2026-09-13" },
}); });
function renderEvents() { function renderEvents() {
@@ -103,13 +100,7 @@ describe("AccountEventsPage read retry", () => {
async () => { async () => {
let isFailing = false; let isFailing = false;
let requests = 0; let requests = 0;
let imports = 0;
server.use( server.use(
http.post("*/api/v1/tbank-sync", () => {
imports += 1;
return HttpResponse.json({}, { status: 202 });
}),
http.get("*/api/v1/brokerage-accounts/:accountId/events", () => { http.get("*/api/v1/brokerage-accounts/:accountId/events", () => {
requests += 1; requests += 1;
@@ -120,7 +111,6 @@ describe("AccountEventsPage read retry", () => {
); );
const { queryClient } = renderEvents(); const { queryClient } = renderEvents();
await screen.findByText("Купон · Synthetic coupon"); await screen.findByText("Купон · Synthetic coupon");
expect(screen.getByText(/Прогноз от .* на 14\.08\.2026 – 13\.09\.2026/)).toBeVisible();
expect(screen.queryByRole("button", { name: "Повторить" })) expect(screen.queryByRole("button", { name: "Повторить" }))
.not.toBeInTheDocument(); .not.toBeInTheDocument();
@@ -137,7 +127,6 @@ describe("AccountEventsPage read retry", () => {
expect(screen.getByText("Не удалось обновить данные")).toBeInTheDocument(); expect(screen.getByText("Не удалось обновить данные")).toBeInTheDocument();
expect(screen.getByText("Купон · Synthetic coupon")).toBeInTheDocument(); expect(screen.getByText("Купон · Synthetic coupon")).toBeInTheDocument();
expect(screen.getByText(/Прогноз от .* на 14\.08\.2026 – 13\.09\.2026/)).toBeVisible();
expect(requests).toBe(4); expect(requests).toBe(4);
isFailing = false; isFailing = false;
@@ -147,7 +136,6 @@ describe("AccountEventsPage read retry", () => {
expect(screen.queryByText("Не удалось обновить данные")) expect(screen.queryByText("Не удалось обновить данные"))
.not.toBeInTheDocument()); .not.toBeInTheDocument());
expect(requests).toBe(5); expect(requests).toBe(5);
expect(imports).toBe(0);
}, },
); );
@@ -47,7 +47,6 @@ describe("AccountEventsPage", () => {
accountId: "account", accountId: "account",
calculatedAt: "2026-08-14T00:00:00Z", calculatedAt: "2026-08-14T00:00:00Z",
events: [], events: [],
window: { from: "2026-08-14", to: "2026-09-13" },
}, },
isError: false, isError: false,
isLoading: false, isLoading: false,
@@ -137,7 +136,6 @@ describe("AccountEventsPage", () => {
type: "offer", type: "offer",
}, },
], ],
window: { from: "2026-08-14", to: "2026-09-13" },
}, },
isError: false, isError: false,
isLoading: false, isLoading: false,
@@ -278,7 +276,6 @@ describe("AccountEventsPage", () => {
accountId: "all", accountId: "all",
calculatedAt: "2026-08-14T00:00:00Z", calculatedAt: "2026-08-14T00:00:00Z",
events: [...events], events: [...events],
window: { from: "2026-08-14", to: "2026-09-13" },
}, },
isError: false, isError: false,
isLoading: false, isLoading: false,
@@ -1,17 +1,17 @@
import type { FC } from "react"; import type { FC } from "react";
import { useAccountEventsPageVm } from "./AccountEventsPage.vm"; import { useAccountEventsPageViewModel } from "./AccountEventsPage.vm";
import { AccountEventsPageError } from "./components/AccountEventsPageError.view"; import { AccountEventsPageError } from "./components/AccountEventsPageError.view";
import { AccountEventsPageLoaded } from "./components/AccountEventsPageLoaded.view"; import { AccountEventsPageLoaded } from "./components/AccountEventsPageLoaded.view";
import { AccountEventsPageLoading } from "./components/AccountEventsPageLoading.view"; import { AccountEventsPageLoading } from "./components/AccountEventsPageLoading.view";
const AccountEventsPage: FC = () => { const AccountEventsPage: FC = () => {
const vm = useAccountEventsPageVm(); const viewModel = useAccountEventsPageViewModel();
if (vm.state === "loading") return <AccountEventsPageLoading />; if (viewModel.state === "loading") return <AccountEventsPageLoading />;
return vm.state === "error" return viewModel.state === "error"
? <AccountEventsPageError {...vm} /> ? <AccountEventsPageError {...viewModel} />
: <AccountEventsPageLoaded {...vm} />; : <AccountEventsPageLoaded {...viewModel} />;
}; };
export { AccountEventsPage }; export { AccountEventsPage };
@@ -18,7 +18,6 @@ import {
type AccountEventsPageViewModel type AccountEventsPageViewModel
= | { = | {
allAccounts: boolean; allAccounts: boolean;
calculatedAt: string;
canApply: boolean; canApply: boolean;
draftPeriod: [null | string, null | string]; draftPeriod: [null | string, null | string];
events: BrokerageEvent[]; events: BrokerageEvent[];
@@ -32,7 +31,6 @@ type AccountEventsPageViewModel
source?: InvestmentResourceMeta; source?: InvestmentResourceMeta;
state: "loaded"; state: "loaded";
totalVisible: boolean; totalVisible: boolean;
window: { from: string; to: string };
} }
| { | {
onReset: () => void; onReset: () => void;
@@ -41,7 +39,7 @@ type AccountEventsPageViewModel
} }
| { state: "loading" }; | { state: "loading" };
function useAccountEventsPageVm(): AccountEventsPageViewModel { function useAccountEventsPageViewModel(): AccountEventsPageViewModel {
const { accountId = "" } = useParams(); const { accountId = "" } = useParams();
const { const {
@@ -112,7 +110,6 @@ function useAccountEventsPageVm(): AccountEventsPageViewModel {
return { return {
allAccounts: accountId === "all", allAccounts: accountId === "all",
calculatedAt: events.data.calculatedAt,
canApply: canApply:
(draftFrom !== appliedFrom || draftTo !== appliedTo) (draftFrom !== appliedFrom || draftTo !== appliedTo)
&& isValidPeriod(draftFrom, draftTo), && isValidPeriod(draftFrom, draftTo),
@@ -136,8 +133,7 @@ function useAccountEventsPageVm(): AccountEventsPageViewModel {
source: events.meta, source: events.meta,
state: "loaded", state: "loaded",
totalVisible: events.meta?.completeness === "complete", totalVisible: events.meta?.completeness === "complete",
window: events.data.window,
}; };
} }
export { type AccountEventsPageViewModel, useAccountEventsPageVm }; export { type AccountEventsPageViewModel, useAccountEventsPageViewModel };
@@ -17,7 +17,7 @@ import {
brokerageEventGroupKey, brokerageEventGroupKey,
brokerageEventKey, brokerageEventKey,
} from "@/entities/brokerage-event"; } from "@/entities/brokerage-event";
import { formatDate, formatSnapshotTime, groupItems } from "@/shared/lib"; import { groupItems } from "@/shared/lib";
import { ReadRetry, SourceSyncStatus } from "@/shared/ui"; import { ReadRetry, SourceSyncStatus } from "@/shared/ui";
import type { AccountEventsPageViewModel } from "../AccountEventsPage.vm"; import type { AccountEventsPageViewModel } from "../AccountEventsPage.vm";
@@ -89,14 +89,6 @@ const AccountEventsPageLoaded: FC<AccountEventsPageLoadedProps> = (props) => {
<Text c="dimmed">{t("events.hint")}</Text> <Text c="dimmed">{t("events.hint")}</Text>
<Text c="dimmed" size="sm">
{t("events.forecastWindow", {
date: formatSnapshotTime(props.calculatedAt),
from: formatDate(props.window.from),
to: formatDate(props.window.to),
})}
</Text>
<Group align="end"> <Group align="end">
<DatePickerInput <DatePickerInput
allowSingleDateInRange allowSingleDateInRange
@@ -34,7 +34,7 @@ import { server } from "@/test/server";
import { toIncomeDisplayModel } from "../../model/display"; import { toIncomeDisplayModel } from "../../model/display";
import { AccountIncomePage } from "./AccountIncomePage"; import { AccountIncomePage } from "./AccountIncomePage";
import { import {
useAccountIncomePageVm, useAccountIncomePageViewModel,
} from "./AccountIncomePage.vm"; } from "./AccountIncomePage.vm";
import { IncomePayments } from "./components/IncomePayments.view"; import { IncomePayments } from "./components/IncomePayments.view";
@@ -171,7 +171,7 @@ describe("AccountIncomePage", () => {
); );
const queryClient = createTestQueryClient(); const queryClient = createTestQueryClient();
const { result } = renderHook(() => useAccountIncomePageVm(), { const { result } = renderHook(() => useAccountIncomePageViewModel(), {
wrapper: ({ children }) => ( wrapper: ({ children }) => (
<QueryClientProvider client={queryClient}> <QueryClientProvider client={queryClient}>
<MemoryRouter initialEntries={["?from=2024-02-29&to=2024-03-01"]}> <MemoryRouter initialEntries={["?from=2024-02-29&to=2024-03-01"]}>
@@ -1,17 +1,17 @@
import type { FC } from "react"; import type { FC } from "react";
import { useAccountIncomePageVm } from "./AccountIncomePage.vm"; import { useAccountIncomePageViewModel } from "./AccountIncomePage.vm";
import { AccountIncomePageError } from "./components/AccountIncomePageError.view"; import { AccountIncomePageError } from "./components/AccountIncomePageError.view";
import { AccountIncomePageLoaded } from "./components/AccountIncomePageLoaded.view"; import { AccountIncomePageLoaded } from "./components/AccountIncomePageLoaded.view";
import { AccountIncomePageLoading } from "./components/AccountIncomePageLoading.view"; import { AccountIncomePageLoading } from "./components/AccountIncomePageLoading.view";
const AccountIncomePage: FC = () => { const AccountIncomePage: FC = () => {
const vm = useAccountIncomePageVm(); const viewModel = useAccountIncomePageViewModel();
if (vm.state === "loading") return <AccountIncomePageLoading />; if (viewModel.state === "loading") return <AccountIncomePageLoading />;
return vm.state === "error" return viewModel.state === "error"
? <AccountIncomePageError {...vm} /> ? <AccountIncomePageError {...viewModel} />
: <AccountIncomePageLoaded {...vm} />; : <AccountIncomePageLoaded {...viewModel} />;
}; };
export { AccountIncomePage }; export { AccountIncomePage };
@@ -43,7 +43,7 @@ type AccountIncomePageViewModel
} }
| { state: "loading" }; | { state: "loading" };
const useAccountIncomePageVm = (): AccountIncomePageViewModel => { const useAccountIncomePageViewModel = (): AccountIncomePageViewModel => {
const { accountId = "" } = useParams(); const { accountId = "" } = useParams();
const [searchParameters, setSearchParameters] = useSearchParams(); const [searchParameters, setSearchParameters] = useSearchParams();
@@ -146,5 +146,5 @@ function isValidIncomePeriod(period: IncomePeriod): boolean {
export { export {
type AccountIncomePageViewModel, type AccountIncomePageViewModel,
useAccountIncomePageVm, useAccountIncomePageViewModel,
}; };
@@ -6,15 +6,15 @@ import { AccountOperationsPageLoaded } from "./components/AccountOperationsPageL
import { AccountOperationsPageLoading } from "./components/AccountOperationsPageLoading.view"; import { AccountOperationsPageLoading } from "./components/AccountOperationsPageLoading.view";
const AccountOperationsPage: FC = () => { const AccountOperationsPage: FC = () => {
const vm = useAccountOperationsPageVm(); const viewModel = useAccountOperationsPageVm();
if (vm.state === "loading") { if (viewModel.state === "loading") {
return <AccountOperationsPageLoading />; return <AccountOperationsPageLoading />;
} }
return vm.state === "error" return viewModel.state === "error"
? <AccountOperationsPageError {...vm} /> ? <AccountOperationsPageError {...viewModel} />
: <AccountOperationsPageLoaded {...vm} />; : <AccountOperationsPageLoaded {...viewModel} />;
}; };
export { AccountOperationsPage }; export { AccountOperationsPage };
+4 -22
View File
@@ -23,7 +23,7 @@ function sections(positions: Portfolio["positions"]) {
} }
describe("account position sections", () => { describe("account position sections", () => {
it("excludes currency mirrors from display and share denominators", () => { it("excludes currency instruments only from display, preserving order and share denominators", () => {
const otherTypes = [ const otherTypes = [
"OPTION", "OPTION",
"OTHER", "OTHER",
@@ -73,30 +73,12 @@ describe("account position sections", () => {
"FIGI-FUND", "FIGI-FUND",
...otherTypes.map(type => `FIGI-${type}-NEXT`), ...otherTypes.map(type => `FIGI-${type}-NEXT`),
]); ]);
expect(sections[0]?.groups[0]?.positions[0].shareText).toBe("50 %"); expect(sections[0]?.groups[0]?.positions[0].shareText).toBe("40 %");
expect(sections[1]?.groups[0]?.positions[0].shareText).toBe("25 %"); expect(sections[1]?.groups[0]?.positions[0].shareText).toBe("20 %");
expect(sections[2]?.groups[1]?.positions[0].shareText).toBe("25 %"); expect(sections[2]?.groups[1]?.positions[0].shareText).toBe("20 %");
expect(snapshot).toEqual(original); expect(snapshot).toEqual(original);
}); });
it("keeps all-account positions from both accounts without counting mirrored cash", () => {
const result = sections([
makePosition({ account: { id: "a", name: "Основной" }, currentValue: { currency: "RUB", value: "100" } }),
makePosition({ account: { id: "a", name: "Основной" }, currentValue: { currency: "RUB", value: "50" }, type: "CURRENCY" }),
makePosition({ account: { id: "b", name: "ИИС" }, currentValue: { currency: "RUB", value: "100" } }),
]);
const visible = result.flatMap(section =>
section.groups.flatMap(group => group.positions));
expect(visible)
.toEqual(expect.arrayContaining([
expect.objectContaining({ account: { id: "a", name: "Основной" }, shareText: "50 %" }),
expect.objectContaining({ account: { id: "b", name: "ИИС" }, shareText: "50 %" }),
]));
expect(visible).toHaveLength(2);
});
it("prepares grouped position sections with derived display data", () => { it("prepares grouped position sections with derived display data", () => {
expect( expect(
toAccountPagePositionSections(portfolio).map(({ groups, kind }) => ({ toAccountPagePositionSections(portfolio).map(({ groups, kind }) => ({
+1 -1
View File
@@ -152,7 +152,7 @@ function toAccountPagePositionSections(
const denominators = new Map<string, number>(); const denominators = new Map<string, number>();
for (const position of portfolio.positions) { for (const position of portfolio.positions) {
if (position.type === "CURRENCY" || !position.currentValue) continue; if (!position.currentValue) continue;
const currency = position.currentValue.currency; const currency = position.currentValue.currency;
denominators.set( denominators.set(
currency, currency,
@@ -1,48 +1,48 @@
import type { FC } from "react"; import type { FC } from "react";
import { useAccountPageVm } from "./AccountPage.vm"; import { useAccountPageViewModel } from "./AccountPage.vm";
import { AccountPageEmpty } from "./components/AccountPageEmpty.view"; import { AccountPageEmpty } from "./components/AccountPageEmpty.view";
import { AccountPageError } from "./components/AccountPageError.view"; import { AccountPageError } from "./components/AccountPageError.view";
import { AccountPageLoaded } from "./components/AccountPageLoaded.view"; import { AccountPageLoaded } from "./components/AccountPageLoaded.view";
import { AccountPageLoading } from "./components/AccountPageLoading/AccountPageLoading.view"; import { AccountPageLoading } from "./components/AccountPageLoading/AccountPageLoading.view";
const AccountPage: FC = () => { const AccountPage: FC = () => {
const vm = useAccountPageVm(); const viewModel = useAccountPageViewModel();
if (vm.state === "loading") return <AccountPageLoading />; if (viewModel.state === "loading") return <AccountPageLoading />;
if (vm.state === "error") return <AccountPageError {...vm} />; if (viewModel.state === "error") return <AccountPageError {...viewModel} />;
if (vm.state === "empty") if (viewModel.state === "empty")
return ( return (
<AccountPageEmpty <AccountPageEmpty
account={vm.account} account={viewModel.account}
accountId={vm.accountId} accountId={viewModel.accountId}
incomeSummary={vm.incomeSummary} incomeSummary={viewModel.incomeSummary}
readRetry={vm.readRetry} readRetry={viewModel.readRetry}
recentEvents={vm.recentEvents} recentEvents={viewModel.recentEvents}
recentOperations={vm.recentOperations} recentOperations={viewModel.recentOperations}
source={vm.source} source={viewModel.source}
/> />
); );
return ( return (
<AccountPageLoaded <AccountPageLoaded
account={vm.account} account={viewModel.account}
accountId={vm.accountId} accountId={viewModel.accountId}
concentration={vm.concentration} concentration={viewModel.concentration}
currency={vm.currency} currency={viewModel.currency}
incomeSummary={vm.incomeSummary} incomeSummary={viewModel.incomeSummary}
onCurrencyChange={vm.onCurrencyChange} onCurrencyChange={viewModel.onCurrencyChange}
onSliceChange={vm.onSliceChange} onSliceChange={viewModel.onSliceChange}
onTabChange={vm.onTabChange} onTabChange={viewModel.onTabChange}
partial={vm.partial} partial={viewModel.partial}
portfolio={vm.portfolio} portfolio={viewModel.portfolio}
positionSections={vm.positionSections} positionSections={viewModel.positionSections}
readRetry={vm.readRetry} readRetry={viewModel.readRetry}
recentEvents={vm.recentEvents} recentEvents={viewModel.recentEvents}
recentOperations={vm.recentOperations} recentOperations={viewModel.recentOperations}
slice={vm.slice} slice={viewModel.slice}
source={vm.source} source={viewModel.source}
tab={vm.tab} tab={viewModel.tab}
unrealizedReturns={vm.unrealizedReturns} unrealizedReturns={viewModel.unrealizedReturns}
/> />
); );
}; };
@@ -12,7 +12,7 @@ import { resource } from "@/test/resource";
import { server } from "@/test/server"; import { server } from "@/test/server";
import { portfolio } from "../../model/positions.fixtures"; import { portfolio } from "../../model/positions.fixtures";
import { useAccountPageVm } from "./AccountPage.vm"; import { useAccountPageViewModel } from "./AccountPage.vm";
function configureTestAuth() { function configureTestAuth() {
configureAuthClient({ configureAuthClient({
@@ -102,12 +102,12 @@ function mockLoadedAccountPage() {
); );
} }
describe("useAccountPageVm", () => { describe("useAccountPageViewModel", () => {
it("prepares recent operations and events state for presentation views", async () => { it("prepares recent operations and events state for presentation views", async () => {
configureTestAuth(); configureTestAuth();
mockLoadedAccountPage(); mockLoadedAccountPage();
const { result } = renderHook(() => useAccountPageVm(), { const { result } = renderHook(() => useAccountPageViewModel(), {
wrapper: createWrapper(), wrapper: createWrapper(),
}); });
@@ -154,7 +154,7 @@ describe("useAccountPageVm", () => {
), ),
); );
const { result } = renderHook(() => useAccountPageVm(), { const { result } = renderHook(() => useAccountPageViewModel(), {
wrapper: createWrapper(), wrapper: createWrapper(),
}); });
@@ -194,7 +194,7 @@ it("keeps overview sections independent when their source data is incomplete", a
), ),
); );
const { result } = renderHook(() => useAccountPageVm(), { const { result } = renderHook(() => useAccountPageViewModel(), {
wrapper: createWrapper(), wrapper: createWrapper(),
}); });
@@ -232,7 +232,7 @@ it("keeps overview sections loaded without exposing technical retry", async () =
), ),
); );
const { result } = renderHook(() => useAccountPageVm(), { const { result } = renderHook(() => useAccountPageViewModel(), {
wrapper: createWrapper(), wrapper: createWrapper(),
}); });
@@ -77,7 +77,7 @@ type AccountPageViewModel
| { code?: string; readRetry: AccountPageReadRetry; state: "error" } | { code?: string; readRetry: AccountPageReadRetry; state: "error" }
| { state: "loading" }; | { state: "loading" };
function useAccountPageVm(): AccountPageViewModel { function useAccountPageViewModel(): AccountPageViewModel {
const { accountId } = useParams(); const { accountId } = useParams();
const { t } = useTranslation(); const { t } = useTranslation();
@@ -199,4 +199,4 @@ function useAccountPageVm(): AccountPageViewModel {
}; };
} }
export { useAccountPageVm }; export { useAccountPageViewModel };
@@ -9,6 +9,7 @@ import type { InvestmentResourceMeta } from "@/shared/api";
import { BrokerageEventsPreview } from "@/entities/brokerage-event"; import { BrokerageEventsPreview } from "@/entities/brokerage-event";
import { ReadRetry, type ReadRetryProps, SourceSyncStatus } from "@/shared/ui"; import { ReadRetry, type ReadRetryProps, SourceSyncStatus } from "@/shared/ui";
import { PortfolioStructure } from "@/widgets/portfolio-structure";
import type { import type {
AccountPageIncomeSummary, AccountPageIncomeSummary,
@@ -18,7 +19,6 @@ import type {
import { AccountHeading } from "./AccountHeading.view"; import { AccountHeading } from "./AccountHeading.view";
import { IncomeSummary } from "./IncomeSummary.view"; import { IncomeSummary } from "./IncomeSummary.view";
import { PortfolioStructure } from "./PortfolioStructure/PortfolioStructure";
import { RecentOperations } from "./RecentOperations.view"; import { RecentOperations } from "./RecentOperations.view";
type AccountPageEmptyProps = { type AccountPageEmptyProps = {
@@ -16,6 +16,7 @@ import type { InvestmentResourceMeta } from "@/shared/api";
import { BrokerageEventsPreview } from "@/entities/brokerage-event"; import { BrokerageEventsPreview } from "@/entities/brokerage-event";
import { formatMoney } from "@/shared/lib"; import { formatMoney } from "@/shared/lib";
import { ReadRetry, type ReadRetryProps, SourceSyncStatus } from "@/shared/ui"; import { ReadRetry, type ReadRetryProps, SourceSyncStatus } from "@/shared/ui";
import { PortfolioStructure } from "@/widgets/portfolio-structure";
import type { Concentration as ConcentrationModel, Slice } from "../../../model/concentration"; import type { Concentration as ConcentrationModel, Slice } from "../../../model/concentration";
import type { AccountPagePositionSection } from "../../../model/positions"; import type { AccountPagePositionSection } from "../../../model/positions";
@@ -30,7 +31,6 @@ import { AccountHeading } from "./AccountHeading.view";
import { Concentration } from "./Concentration/Concentration.view"; import { Concentration } from "./Concentration/Concentration.view";
import { CurrencyCards } from "./CurrencyCards/CurrencyCards.view"; import { CurrencyCards } from "./CurrencyCards/CurrencyCards.view";
import { IncomeSummary } from "./IncomeSummary.view"; import { IncomeSummary } from "./IncomeSummary.view";
import { PortfolioStructure } from "./PortfolioStructure/PortfolioStructure";
import { PositionSection } from "./PositionSection.view"; import { PositionSection } from "./PositionSection.view";
import { RecentOperations } from "./RecentOperations.view"; import { RecentOperations } from "./RecentOperations.view";
@@ -1,22 +1,22 @@
import type { FC } from "react"; import type { FC } from "react";
import { useAccountsPageVm } from "./AccountsPage.vm"; import { useAccountsPageViewModel } from "./AccountsPage.vm";
import { AccountsPageEmpty } from "./components/AccountsPageEmpty.view"; import { AccountsPageEmpty } from "./components/AccountsPageEmpty.view";
import { AccountsPageError } from "./components/AccountsPageError.view"; import { AccountsPageError } from "./components/AccountsPageError.view";
import { AccountsPageLoaded } from "./components/AccountsPageLoaded.view"; import { AccountsPageLoaded } from "./components/AccountsPageLoaded.view";
import { AccountsPageLoading } from "./components/AccountsPageLoading.view"; import { AccountsPageLoading } from "./components/AccountsPageLoading.view";
const AccountsPage: FC = () => { const AccountsPage: FC = () => {
const vm = useAccountsPageVm(); const viewModel = useAccountsPageViewModel();
if (vm.state === "loading") return <AccountsPageLoading />; if (viewModel.state === "loading") return <AccountsPageLoading />;
if (vm.state === "error") return <AccountsPageError {...vm} />; if (viewModel.state === "error") return <AccountsPageError {...viewModel} />;
if (vm.state === "empty") return <AccountsPageEmpty />; if (viewModel.state === "empty") return <AccountsPageEmpty />;
return ( return (
<AccountsPageLoaded <AccountsPageLoaded
accounts={vm.accounts} accounts={viewModel.accounts}
meta={vm.meta} meta={viewModel.meta}
readRetry={vm.readRetry} readRetry={viewModel.readRetry}
/> />
); );
}; };
@@ -30,7 +30,7 @@ function isAccountsAccessFailure(code?: string) {
|| isApiErrorCode(code, ApiErrorCode.TbankNotConnected); || isApiErrorCode(code, ApiErrorCode.TbankNotConnected);
} }
function useAccountsPageVm(): AccountsPageViewModel { function useAccountsPageViewModel(): AccountsPageViewModel {
const accounts = useBrokerageAccounts(); const accounts = useBrokerageAccounts();
useScreenSync({ screen: "accounts" }, [accounts]); useScreenSync({ screen: "accounts" }, [accounts]);
@@ -73,4 +73,4 @@ function useAccountsPageVm(): AccountsPageViewModel {
}; };
} }
export { useAccountsPageVm }; export { useAccountsPageViewModel };
@@ -120,52 +120,11 @@ const useOperationFormVm = (props: OperationFormProps) => {
body: { ...body, version }, body: { ...body, version },
id: props.operation.id, id: props.operation.id,
}); });
else { else
const base = { await operationCreation.mutateAsync({
amount: body.amount,
cardId: values.cardId,
date: values.date,
description: values.description,
id: intent, id: intent,
}; ...body,
});
switch (values.kind) {
case "expense": {
await operationCreation.mutateAsync({
...base,
categoryId: values.categoryId || defaultCategoryId,
kind: values.kind,
});
break;
}
case "refund": {
await operationCreation.mutateAsync({
...base,
kind: values.kind,
originalExpenseId: values.originalExpenseId,
});
break;
}
case "topup": {
await operationCreation.mutateAsync({
...base,
kind: values.kind,
});
break;
}
case "transfer": {
await operationCreation.mutateAsync({
...base,
kind: values.kind,
targetCardId: values.targetCardId,
});
break;
}
}
}
notifications.show({ notifications.show({
id: "bank-operation-saved-" + actionId, id: "bank-operation-saved-" + actionId,
+2 -2
View File
@@ -1,13 +1,13 @@
import type { FC } from "react"; import type { FC } from "react";
import { useDocumentTitle } from "@mantine/hooks";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { AuthPageLayout, LoginForm } from "@/features/auth"; import { AuthPageLayout, LoginForm } from "@/features/auth";
import { useAppDocumentTitle } from "@/shared/ui";
const LoginPage: FC = () => { const LoginPage: FC = () => {
const { t } = useTranslation(); const { t } = useTranslation();
useAppDocumentTitle(t("auth.login")); useDocumentTitle(`${t("auth.login")} — ${t("appName")}`);
return ( return (
<AuthPageLayout title={t("auth.login")}> <AuthPageLayout title={t("auth.login")}>
+2 -3
View File
@@ -1,15 +1,14 @@
import type { FC } from "react"; import type { FC } from "react";
import { Button, Stack, Title } from "@mantine/core"; import { Button, Stack, Title } from "@mantine/core";
import { useDocumentTitle } from "@mantine/hooks";
import { StateView } from "@wealthledger/ui"; import { StateView } from "@wealthledger/ui";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { Link } from "react-router"; import { Link } from "react-router";
import { useAppDocumentTitle } from "@/shared/ui";
const NotFoundPage: FC = () => { const NotFoundPage: FC = () => {
const { t } = useTranslation(); const { t } = useTranslation();
useAppDocumentTitle(t("notFound.title")); useDocumentTitle(`${t("notFound.title")} — ${t("appName")}`);
return ( return (
<Stack> <Stack>
+2 -2
View File
@@ -1,13 +1,13 @@
import type { FC } from "react"; import type { FC } from "react";
import { useDocumentTitle } from "@mantine/hooks";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { AuthPageLayout, RegisterForm } from "@/features/auth"; import { AuthPageLayout, RegisterForm } from "@/features/auth";
import { useAppDocumentTitle } from "@/shared/ui";
const RegisterPage: FC = () => { const RegisterPage: FC = () => {
const { t } = useTranslation(); const { t } = useTranslation();
useAppDocumentTitle(t("auth.register")); useDocumentTitle(`${t("auth.register")} — ${t("appName")}`);
return ( return (
<AuthPageLayout title={t("auth.register")}> <AuthPageLayout title={t("auth.register")}>
@@ -1,24 +1,13 @@
import type { FC } from "react"; import type { FC } from "react";
import { Button, Stack, Title } from "@mantine/core"; import { Button, Stack, Title } from "@mantine/core";
import { useTranslation } from "react-i18next";
import { useAuth } from "@/features/auth";
import { TbankConnectionSection } from "@/features/tbank-connection"; import { TbankConnectionSection } from "@/features/tbank-connection";
const SettingsPage: FC = () => { import { useSettingsPageVm } from "./SettingsPage.vm";
const { t } = useTranslation();
const { logout } = useAuth();
// eslint-disable-next-line frontend/readability -- the page VM was removed as degenerate (frontend#143); a one-off error-swallowing logout is not a ViewModel. const SettingsPage: FC = () => {
const onLogout = async () => { const { onLogout, t } = useSettingsPageVm();
try {
await logout();
}
catch {
// The session is already cleared; the route guard owns navigation.
}
};
return ( return (
<Stack> <Stack>
@@ -0,0 +1,21 @@
import { useTranslation } from "react-i18next";
import { useAuth } from "@/features/auth";
function useSettingsPageVm() {
const { t } = useTranslation();
const { logout } = useAuth();
const onLogout = async () => {
try {
await logout();
}
catch {
// The session is already cleared; the route guard owns navigation.
}
};
return { onLogout, t };
}
export { useSettingsPageVm };
+52 -40
View File
@@ -6,7 +6,10 @@ import { createQueryWrapper } from "@/test/query";
import { resource } from "@/test/resource"; import { resource } from "@/test/resource";
import { server } from "@/test/server"; import { server } from "@/test/server";
import { useAuthenticatedQuery } from "./authenticated-query"; import {
useAuthenticatedQueries,
useAuthenticatedQuery,
} from "./authenticated-query";
import { apiQueryClient, configureAuthClient } from "./client"; import { apiQueryClient, configureAuthClient } from "./client";
const useSingleQuery = () => const useSingleQuery = () =>
@@ -14,49 +17,58 @@ const useSingleQuery = () =>
apiQueryClient.queryOptions("get", "/api/v1/brokerage-accounts"), apiQueryClient.queryOptions("get", "/api/v1/brokerage-accounts"),
); );
const useMultipleQueries = () =>
useAuthenticatedQueries([
apiQueryClient.queryOptions("get", "/api/v1/brokerage-accounts"),
])[0];
describe("useAuthenticatedQuery", () => { describe("useAuthenticatedQuery", () => {
it("keeps protected queries idle without a session and loads after session configuration", async () => { it.each(["single", "multiple"])(
const requests = vi.fn(); "keeps %s protected queries idle without a session and loads after session configuration",
server.use( async (mode) => {
http.get("*/api/v1/brokerage-accounts", () => { const requests = vi.fn();
requests(); server.use(
http.get("*/api/v1/brokerage-accounts", () => {
requests();
return HttpResponse.json( return HttpResponse.json(
resource([ resource([
{ {
id: "account-1", id: "account-1",
name: "Основной", name: "Основной",
openedOn: "2024-08-13", openedOn: "2024-08-13",
type: "BROKERAGE", type: "BROKERAGE",
}, },
]), ]),
); );
}), }),
); );
const { result } = renderHook(useSingleQuery, { const { result } = renderHook(
wrapper: createQueryWrapper().wrapper, mode === "single" ? useSingleQuery : useMultipleQueries,
}); { wrapper: createQueryWrapper().wrapper },
);
await new Promise(resolve => setTimeout(resolve, 0)); await new Promise(resolve => setTimeout(resolve, 0));
expect(requests).not.toHaveBeenCalled(); expect(requests).not.toHaveBeenCalled();
expect(result.current?.fetchStatus).toBe("idle"); expect(result.current?.fetchStatus).toBe("idle");
configureAuthClient({ configureAuthClient({
accessToken: () => "token", accessToken: () => "token",
clear: vi.fn(), clear: vi.fn(),
refresh: () => Promise.resolve(true), refresh: () => Promise.resolve(true),
}); });
await waitFor(() => expect(result.current?.isSuccess).toBe(true)); await waitFor(() => expect(result.current?.isSuccess).toBe(true));
expect(requests).toHaveBeenCalledOnce(); expect(requests).toHaveBeenCalledOnce();
expect(result.current?.data?.data).toEqual([ expect(result.current?.data?.data).toEqual([
{ {
id: "account-1", id: "account-1",
name: "Основной", name: "Основной",
openedOn: "2024-08-13", openedOn: "2024-08-13",
type: "BROKERAGE", type: "BROKERAGE",
}, },
]); ]);
}); },
);
}); });
+21 -1
View File
@@ -1,5 +1,6 @@
import { import {
type QueryKey, type QueryKey,
useQueries,
useQuery, useQuery,
type UseQueryOptions, type UseQueryOptions,
type UseQueryResult, type UseQueryResult,
@@ -11,6 +12,25 @@ import {
subscribeAuthenticatedSession, subscribeAuthenticatedSession,
} from "./client"; } from "./client";
function useAuthenticatedQueries<TData, TError, TQueryKey extends QueryKey>(
queries: UseQueryOptions<TData, TError, TData, TQueryKey>[],
) {
const hasSession = useHasAuthenticatedSession();
return useQueries({
queries: queries.map(
(options): UseQueryOptions<TData, TError, TData, TQueryKey> => ({
...options,
enabled: query =>
hasSession
&& (typeof options.enabled === "function"
? options.enabled(query)
: (options.enabled ?? true)),
}),
),
});
}
function useAuthenticatedQuery< function useAuthenticatedQuery<
TQueryFunctionData = unknown, TQueryFunctionData = unknown,
TError = Error, TError = Error,
@@ -38,4 +58,4 @@ function useHasAuthenticatedSession() {
); );
} }
export { useAuthenticatedQuery }; export { useAuthenticatedQueries, useAuthenticatedQuery };
+28 -27
View File
@@ -208,50 +208,51 @@ function parseJson(body: string): unknown {
} }
async function readAttempt(request: Request): Promise<ReadAttempt> { async function readAttempt(request: Request): Promise<ReadAttempt> {
// Manual timeout (not AbortSignal.timeout) so fake-timer tests can advance it. const controller = new AbortController();
const timeout = new AbortController(); const failure: { reason?: "abort" | "timeout" } = {};
const timer = setTimeout(() => timeout.abort(), GET_DEADLINE_MS);
const signal = AbortSignal.any([request.signal, timeout.signal]); const { promise: deadline, reject: rejectDeadline }
= Promise.withResolvers<never>();
const timeout = setTimeout(() => {
failure.reason = "timeout";
controller.abort();
rejectDeadline(abortError());
}, GET_DEADLINE_MS);
const abort = () => {
failure.reason = "abort";
controller.abort();
rejectDeadline(abortError());
};
request.signal.addEventListener("abort", abort, { once: true });
const timedRequest = new Request(request, { signal: controller.signal });
try { try {
// MSW keeps a stalled body readable after abort, so keep the race. const response = await Promise.race([fetch(timedRequest), deadline]);
const response = await Promise.race([ const body = await Promise.race([response.text(), deadline]);
fetch(new Request(request, { signal })), const problem = parseJson(body);
rejectOnAbort(signal),
]);
const body = await Promise.race([response.text(), rejectOnAbort(signal)]);
return { return {
problem: parseJson(body), problem,
reason: "transient", reason: "transient",
response: new Response(body, response), response: new Response(body, response),
}; };
} }
catch (error) { catch (error) {
if (request.signal.aborted) return { reason: "abort" }; if (failure.reason === "abort") return { reason: "abort" };
// Timeout or network failure: retryable. if (failure.reason === "timeout" || isNetworkFailure(error))
if (timeout.signal.aborted || isNetworkFailure(error))
return { reason: "transient" }; return { reason: "transient" };
throw error; throw error;
} }
finally { finally {
clearTimeout(timer); clearTimeout(timeout);
request.signal.removeEventListener("abort", abort);
} }
} }
function rejectOnAbort(signal: AbortSignal): Promise<never> {
return new Promise((_resolve, reject) => {
// The signal is either already aborted or one of two parents firing once.
signal.addEventListener(
"abort",
() => reject(abortError()),
{ once: true },
);
});
}
function retryAfterMs(response: Response): number | undefined { function retryAfterMs(response: Response): number | undefined {
const header = response.headers.get("Retry-After"); const header = response.headers.get("Retry-After");
if (!header) return undefined; if (!header) return undefined;
+24 -72
View File
@@ -775,77 +775,6 @@ export interface components {
*/ */
password: string; password: string;
}; };
RubMoneyInputDto: {
/** @enum {string} */
currency: "RUB";
value: string;
};
CreateExpenseOperationDto: {
/** Format: uuid */
id: string;
/** Format: uuid */
cardId: string;
amount: components["schemas"]["RubMoneyInputDto"];
/** Format: date */
date: string;
description?: string;
/**
* @description discriminator enum property added by openapi-typescript
* @enum {string}
*/
kind: "expense";
/** Format: uuid */
categoryId?: string;
};
CreateTopupOperationDto: {
/** Format: uuid */
id: string;
/** Format: uuid */
cardId: string;
amount: components["schemas"]["RubMoneyInputDto"];
/** Format: date */
date: string;
description?: string;
/**
* @description discriminator enum property added by openapi-typescript
* @enum {string}
*/
kind: "topup";
};
CreateTransferOperationDto: {
/** Format: uuid */
id: string;
/** Format: uuid */
cardId: string;
amount: components["schemas"]["RubMoneyInputDto"];
/** Format: date */
date: string;
description?: string;
/**
* @description discriminator enum property added by openapi-typescript
* @enum {string}
*/
kind: "transfer";
/** Format: uuid */
targetCardId: string;
};
CreateRefundOperationDto: {
/** Format: uuid */
id: string;
/** Format: uuid */
cardId: string;
amount: components["schemas"]["RubMoneyInputDto"];
/** Format: date */
date: string;
description?: string;
/**
* @description discriminator enum property added by openapi-typescript
* @enum {string}
*/
kind: "refund";
/** Format: uuid */
originalExpenseId: string;
};
MoneyDto: { MoneyDto: {
currency: string; currency: string;
value: string; value: string;
@@ -863,6 +792,11 @@ export interface components {
archivedAt: string | null; archivedAt: string | null;
version: number; version: number;
}; };
RubMoneyInputDto: {
/** @enum {string} */
currency: "RUB";
value: string;
};
CreateBankCardDto: { CreateBankCardDto: {
/** Format: uuid */ /** Format: uuid */
id: string; id: string;
@@ -907,6 +841,24 @@ export interface components {
net: components["schemas"]["MoneyDto"]; net: components["schemas"]["MoneyDto"];
categories: components["schemas"]["BankSummaryCategoryDto"][]; categories: components["schemas"]["BankSummaryCategoryDto"][];
}; };
CreateBankOperationDto: {
/** Format: uuid */
id: string;
/** @enum {string} */
kind: "expense" | "topup" | "transfer" | "refund";
/** Format: uuid */
cardId: string;
/** Format: uuid */
targetCardId?: string;
/** Format: uuid */
categoryId?: string;
/** Format: uuid */
originalExpenseId?: string;
amount: components["schemas"]["RubMoneyInputDto"];
/** Format: date */
date: string;
description?: string;
};
BankOperationDto: { BankOperationDto: {
id: string; id: string;
/** @enum {string} */ /** @enum {string} */
@@ -2646,7 +2598,7 @@ export interface operations {
}; };
requestBody: { requestBody: {
content: { content: {
"application/json": components["schemas"]["CreateExpenseOperationDto"] | components["schemas"]["CreateTopupOperationDto"] | components["schemas"]["CreateTransferOperationDto"] | components["schemas"]["CreateRefundOperationDto"]; "application/json": components["schemas"]["CreateBankOperationDto"];
}; };
}; };
responses: { responses: {
-1
View File
@@ -13,7 +13,6 @@ export {
isApiErrorCode, isApiErrorCode,
isBrokerageAccessLoss, isBrokerageAccessLoss,
} from "./problem-details"; } from "./problem-details";
export { isGetUnder } from "./query-predicate";
export { isReadFailureExhausted, readRetry } from "./read-failure"; export { isReadFailureExhausted, readRetry } from "./read-failure";
export { export {
-26
View File
@@ -1,26 +0,0 @@
import { describe, expect, it } from "vitest";
import { isGetUnder } from "./query-predicate";
describe("isGetUnder", () => {
it("matches the root itself and nested paths for get queries only", () => {
const predicate = isGetUnder(["/api/v1/bank-cards"]);
expect(predicate(["get", "/api/v1/bank-cards"])).toBe(true);
expect(predicate(["get", "/api/v1/bank-cards/{id}"])).toBe(true);
expect(predicate(["get", "/api/v1/bank-cards"])).toBe(true);
expect(predicate(["get", "/api/v1/bank-cardsx"])).toBe(false);
expect(predicate(["post", "/api/v1/bank-cards"])).toBe(false);
expect(predicate(["get", "/api/v1/other"])).toBe(false);
});
it("checks every root and tolerates init and non-string parts", () => {
const predicate = isGetUnder(["/api/v1/stocks", "/api/v1/bonds"]);
expect(predicate(["get", "/api/v1/stocks/{uid}/quote", { params: {} }]))
.toBe(true);
expect(predicate(["get", "/api/v1/bonds"])).toBe(true);
expect(predicate([undefined, "/api/v1/stocks"])).toBe(false);
expect(predicate(["get", undefined])).toBe(false);
});
});
-18
View File
@@ -1,18 +0,0 @@
import type { QueryKey } from "@tanstack/react-query";
// openapi-react-query shapes query keys as [method, path, init].
function isGetUnder(roots: readonly string[]) {
const predicate = (queryKey: QueryKey) => {
const [method, path] = queryKey as readonly [unknown, unknown];
return (
method === "get"
&& typeof path === "string"
&& roots.some(root => path === root || path.startsWith(`${root}/`))
);
};
return predicate;
}
export { isGetUnder };
+73
View File
@@ -37,6 +37,38 @@ function auth() {
} }
describe("persistent resource query lifecycle", () => { describe("persistent resource query lifecycle", () => {
it("observes once into the canonical cache without another import", async () => {
auth();
const modes: (null | string)[] = [];
let observations = 0;
server.use(
http.get(
"*/api/v1/brokerage-accounts/:accountId/portfolio",
({ request }) => {
const mode = new URL(request.url).searchParams.get("sync");
modes.push(mode);
if (mode) observations += 1;
return HttpResponse.json(
resource(snapshot, {
dataRevision: observations > 0 ? "new" : "old",
}),
);
},
),
);
const { queryClient, wrapper } = createQueryWrapper();
const { result } = renderHook(() => usePrivateResource("a"), { wrapper });
await waitFor(() => expect(result.current.isSuccess).toBe(true));
await act(() => result.current.observe());
await waitFor(() => expect(result.current.meta?.dataRevision).toBe("new"));
expect(modes).toEqual([null, "observe"]);
expect(queryClient.getQueryCache().getAll()).toHaveLength(1);
expect(
queryClient.getQueryData(resourceOptions("a").queryKey),
).toMatchObject({ data: snapshot, meta: { dataRevision: "new" } });
});
it("keeps successful HTTP state distinct from missing or failed source data", async () => { it("keeps successful HTTP state distinct from missing or failed source data", async () => {
auth(); auth();
server.use( server.use(
@@ -104,6 +136,47 @@ describe("persistent resource query lifecycle", () => {
expect(result.current.isSuccess).toBe(true); expect(result.current.isSuccess).toBe(true);
expect(result.current.isPending).toBe(false); expect(result.current.isPending).toBe(false);
}); });
it("keeps the observed snapshot when an older query finishes later", async () => {
auth();
const { promise: blocked, resolve: release }
= Promise.withResolvers<void>();
let isStarted = false;
server.use(
http.get(
"*/api/v1/brokerage-accounts/:accountId/portfolio",
async ({ request }) => {
if (!new URL(request.url).searchParams.has("sync")) {
isStarted = true;
await blocked;
return HttpResponse.json(resource({ ...snapshot, isStale: true }));
}
return HttpResponse.json(resource(snapshot));
},
),
);
const { result } = renderHook(() => usePrivateResource("a"), {
wrapper: createQueryWrapper().wrapper,
});
await waitFor(() => expect(isStarted).toBe(true));
// Capture the observation promise before releasing the old handler; the
// final assertion must follow its settlement, not the handler release.
let observation: Promise<unknown> = Promise.resolve();
await act(async () => {
observation = result.current.observe() ?? Promise.resolve();
await observation;
});
await act(async () => {
release();
await observation;
});
expect(result.current.data).toEqual(snapshot);
});
it("clears private snapshots on confirmed access loss and fences another pending success", async () => { it("clears private snapshots on confirmed access loss and fences another pending success", async () => {
auth(); auth();
let isDenied = false; let isDenied = false;
+55 -4
View File
@@ -1,5 +1,6 @@
import { import {
type QueryClient, type QueryClient,
type QueryFunctionContext,
useQueryClient, useQueryClient,
type UseQueryOptions, type UseQueryOptions,
} from "@tanstack/react-query"; } from "@tanstack/react-query";
@@ -8,6 +9,7 @@ import { useEffect } from "react";
import type { components, paths } from "./generated/schema"; import type { components, paths } from "./generated/schema";
import { useAuthenticatedQuery } from "./authenticated-query"; import { useAuthenticatedQuery } from "./authenticated-query";
import { getAuthenticatedSessionSnapshot } from "./client";
import { apiErrorCode, isBrokerageAccessLoss } from "./problem-details"; import { apiErrorCode, isBrokerageAccessLoss } from "./problem-details";
type InvestmentResourceMeta = components["schemas"]["InvestmentResourceMetaDto"]; type InvestmentResourceMeta = components["schemas"]["InvestmentResourceMetaDto"];
@@ -29,7 +31,7 @@ type ResourcePath = {
type ResourceQueryKey = readonly [ type ResourceQueryKey = readonly [
"get", "get",
ResourcePath, ResourcePath,
{ params?: { path?: object; query?: object } }?, { params?: { path?: object; query?: { sync?: "observe" } } }?,
]; ];
function invalidateResourceAccess( function invalidateResourceAccess(
@@ -55,6 +57,22 @@ function invalidateResourceAccess(
}); });
} }
// Keep endpoint and parameters intact. The generated queryFn accepts the
// optional sync mode even for a cache key originally created without init.
function observationKey<K extends readonly unknown[]>(key: K): K {
const [method, path, init] = key as unknown as [
string,
string,
{ params?: { path?: object; query?: object } }?,
];
return [method, path, {
...init,
params: { ...init?.params, query: { ...init?.params?.query, sync: "observe" } },
}] as unknown as K;
}
// Observation changes transport mode, never the generated cache identity.
function useResourceQuery< function useResourceQuery<
T extends Resource, T extends Resource,
E = unknown, E = unknown,
@@ -74,17 +92,50 @@ function useResourceQuery<
if (group) invalidateResourceAccess(client, group, query.error); if (group) invalidateResourceAccess(client, group, query.error);
}, [client, group, query.error]); }, [client, group, query.error]);
const observe = async () => {
const queryFunction = options.queryFn;
if (
typeof queryFunction !== "function"
|| !query.isEnabled
|| !getAuthenticatedSessionSnapshot()
)
return;
// Cancellation is synchronous; start the replacement in the same boundary.
void client.cancelQueries({ exact: true, queryKey: options.queryKey });
return client.query({
...options,
queryFn: async (context: QueryFunctionContext<K>) => {
const queryKey = observationKey(context.queryKey);
return queryFunction({ ...context, queryKey });
},
retry: false,
// Keep the cache envelope independent of observer projection.
select: undefined,
staleTime: 0,
});
};
const data: T["data"] | undefined = query.data?.data; const data: T["data"] | undefined = query.data?.data;
const meta: T["meta"] | undefined = query.data?.meta; const meta: T["meta"] | undefined = query.data?.meta;
// Project resource fields; refetch still returns the transport envelope. // Project resource fields; refetch still returns the transport envelope.
// queryKey is kept for screen-sync cache bookkeeping.
return { return {
// eslint-disable-next-line @tanstack/query/no-rest-destructuring -- Single projection point; consumers already depend on the whole query state.
...query,
data: data ?? undefined, data: data ?? undefined,
error: query.error,
fetchStatus: query.fetchStatus,
isEnabled: query.isEnabled,
isError: query.isError,
isFetching: query.isFetching,
isLoading: query.isLoading,
isPending: query.isPending,
isSuccess: query.isSuccess,
meta, meta,
observe,
queryKey: options.queryKey, queryKey: options.queryKey,
refetch: query.refetch,
status: query.status,
sync: query.data && "sync" in query.data ? query.data.sync : undefined, sync: query.data && "sync" in query.data ? query.data.sync : undefined,
}; };
} }
+72 -204
View File
@@ -1053,29 +1053,7 @@
"content": { "content": {
"application/json": { "application/json": {
"schema": { "schema": {
"oneOf": [ "$ref": "#/components/schemas/CreateBankOperationDto"
{
"$ref": "#/components/schemas/CreateExpenseOperationDto"
},
{
"$ref": "#/components/schemas/CreateTopupOperationDto"
},
{
"$ref": "#/components/schemas/CreateTransferOperationDto"
},
{
"$ref": "#/components/schemas/CreateRefundOperationDto"
}
],
"discriminator": {
"propertyName": "kind",
"mapping": {
"expense": "#/components/schemas/CreateExpenseOperationDto",
"topup": "#/components/schemas/CreateTopupOperationDto",
"transfer": "#/components/schemas/CreateTransferOperationDto",
"refund": "#/components/schemas/CreateRefundOperationDto"
}
}
} }
} }
} }
@@ -5362,187 +5340,6 @@
"password" "password"
] ]
}, },
"RubMoneyInputDto": {
"type": "object",
"properties": {
"currency": {
"type": "string",
"enum": [
"RUB"
]
},
"value": {
"type": "string",
"pattern": "^-?[0-9]+(\\.[0-9]{1,2})?$"
}
},
"required": [
"currency",
"value"
]
},
"CreateExpenseOperationDto": {
"type": "object",
"properties": {
"id": {
"type": "string",
"format": "uuid"
},
"cardId": {
"type": "string",
"format": "uuid"
},
"amount": {
"$ref": "#/components/schemas/RubMoneyInputDto"
},
"date": {
"type": "string",
"format": "date"
},
"description": {
"type": "string",
"maxLength": 500
},
"kind": {
"type": "string",
"enum": [
"expense"
]
},
"categoryId": {
"type": "string",
"format": "uuid"
}
},
"required": [
"id",
"cardId",
"amount",
"date",
"kind"
]
},
"CreateTopupOperationDto": {
"type": "object",
"properties": {
"id": {
"type": "string",
"format": "uuid"
},
"cardId": {
"type": "string",
"format": "uuid"
},
"amount": {
"$ref": "#/components/schemas/RubMoneyInputDto"
},
"date": {
"type": "string",
"format": "date"
},
"description": {
"type": "string",
"maxLength": 500
},
"kind": {
"type": "string",
"enum": [
"topup"
]
}
},
"required": [
"id",
"cardId",
"amount",
"date",
"kind"
]
},
"CreateTransferOperationDto": {
"type": "object",
"properties": {
"id": {
"type": "string",
"format": "uuid"
},
"cardId": {
"type": "string",
"format": "uuid"
},
"amount": {
"$ref": "#/components/schemas/RubMoneyInputDto"
},
"date": {
"type": "string",
"format": "date"
},
"description": {
"type": "string",
"maxLength": 500
},
"kind": {
"type": "string",
"enum": [
"transfer"
]
},
"targetCardId": {
"type": "string",
"format": "uuid"
}
},
"required": [
"id",
"cardId",
"amount",
"date",
"kind",
"targetCardId"
]
},
"CreateRefundOperationDto": {
"type": "object",
"properties": {
"id": {
"type": "string",
"format": "uuid"
},
"cardId": {
"type": "string",
"format": "uuid"
},
"amount": {
"$ref": "#/components/schemas/RubMoneyInputDto"
},
"date": {
"type": "string",
"format": "date"
},
"description": {
"type": "string",
"maxLength": 500
},
"kind": {
"type": "string",
"enum": [
"refund"
]
},
"originalExpenseId": {
"type": "string",
"format": "uuid"
}
},
"required": [
"id",
"cardId",
"amount",
"date",
"kind",
"originalExpenseId"
]
},
"MoneyDto": { "MoneyDto": {
"type": "object", "type": "object",
"properties": { "properties": {
@@ -5614,6 +5411,25 @@
"version" "version"
] ]
}, },
"RubMoneyInputDto": {
"type": "object",
"properties": {
"currency": {
"type": "string",
"enum": [
"RUB"
]
},
"value": {
"type": "string",
"pattern": "^-?[0-9]+(\\.[0-9]{1,2})?$"
}
},
"required": [
"currency",
"value"
]
},
"CreateBankCardDto": { "CreateBankCardDto": {
"type": "object", "type": "object",
"properties": { "properties": {
@@ -5783,6 +5599,58 @@
"categories" "categories"
] ]
}, },
"CreateBankOperationDto": {
"type": "object",
"properties": {
"id": {
"type": "string",
"format": "uuid"
},
"kind": {
"type": "string",
"enum": [
"expense",
"topup",
"transfer",
"refund"
]
},
"cardId": {
"type": "string",
"format": "uuid"
},
"targetCardId": {
"type": "string",
"format": "uuid"
},
"categoryId": {
"type": "string",
"format": "uuid"
},
"originalExpenseId": {
"type": "string",
"format": "uuid"
},
"amount": {
"$ref": "#/components/schemas/RubMoneyInputDto"
},
"date": {
"type": "string",
"format": "date"
},
"description": {
"type": "string",
"maxLength": 500
}
},
"required": [
"id",
"kind",
"cardId",
"amount",
"date"
]
},
"BankOperationDto": { "BankOperationDto": {
"type": "object", "type": "object",
"properties": { "properties": {
-1
View File
@@ -360,7 +360,6 @@ const ru = {
emptyTitle: "За выбранный период событий не найдено", emptyTitle: "За выбранный период событий не найдено",
errorText: "Попробуйте запросить прогноз еще раз.", errorText: "Попробуйте запросить прогноз еще раз.",
errorTitle: "Не удалось загрузить будущие события", errorTitle: "Не удалось загрузить будущие события",
forecastWindow: "Прогноз от {{date}} на {{from}} – {{to}}",
hint: "Прогноз рассчитан по текущей позиции до налогов. Покрытие зависит от доступных данных MOEX.", hint: "Прогноз рассчитан по текущей позиции до налогов. Покрытие зависит от доступных данных MOEX.",
noAmount: "Сумма неизвестна", noAmount: "Сумма неизвестна",
open: "Открыть будущие события", open: "Открыть будущие события",
-1
View File
@@ -11,4 +11,3 @@ export {
type ReadRetryProps, type ReadRetryProps,
} from "./ReadRetry/ReadRetry"; } from "./ReadRetry/ReadRetry";
export { SourceSyncStatus } from "./SourceSyncStatus/SourceSyncStatus"; export { SourceSyncStatus } from "./SourceSyncStatus/SourceSyncStatus";
export { useAppDocumentTitle } from "./useAppDocumentTitle";
-13
View File
@@ -1,13 +0,0 @@
import { useDocumentTitle } from "@mantine/hooks";
import { useTranslation } from "react-i18next";
/**
* Sets `document.title` to `<title> — <appName>`.
* Owner of the "page title + app name suffix" formatting rule.
*/
function useAppDocumentTitle(title: string) {
const { t } = useTranslation();
useDocumentTitle(`${title} — ${t("appName")}`);
}
export { useAppDocumentTitle };
-1
View File
@@ -66,7 +66,6 @@ const handlers = [
accountId: "account-1", accountId: "account-1",
calculatedAt: "2026-08-14T00:00:00Z", calculatedAt: "2026-08-14T00:00:00Z",
events: [], events: [],
window: { from: "2026-08-14", to: "2026-09-13" },
}), }),
), ),
), ),
+1
View File
@@ -0,0 +1 @@
export { PortfolioStructure } from "./ui/PortfolioStructure";
@@ -28,7 +28,7 @@ const meta = {
}, },
}, },
tags: ["autodocs"], tags: ["autodocs"],
title: "Product/PortfolioStructure", title: "Widgets/PortfolioStructure",
} satisfies Meta<typeof PortfolioStructure>; } satisfies Meta<typeof PortfolioStructure>;
export default meta; export default meta;