refactor: enforce frontend view model boundaries

src/app/ui/AppBreadcrumbs/AppBreadcrumbs.tsx

@@ -5,7 +5,7 @@ import { useTranslation } from "react-i18next";
 import { useMatch } from "react-router";
 
 import { AccountBreadcrumbs } from "./AccountBreadcrumbs";
-import { AccountScopeSwitch } from "./AccountScopeSwitch";
+import { AccountScopeSwitch } from "./AccountScopeSwitch/AccountScopeSwitch";
 import { BondBreadcrumbs } from "./BondBreadcrumbs";
 import { BreadcrumbTrail } from "./BreadcrumbTrail";
 import { CardBreadcrumbs } from "./CardBreadcrumbs";
@@ -13,10 +13,12 @@ import { StockBreadcrumbs } from "./StockBreadcrumbs";
 
 const AppBreadcrumbs: FC = () => {
 	const { t } = useTranslation();
+
 	const operations = useMatch({
 		end: true,
 		path: "/accounts/:accountId/operations",
 	});
+
 	const events = useMatch({ end: true, path: "/accounts/:accountId/events" });
 	const income = useMatch({ end: true, path: "/accounts/:accountId/income" });
 	const account = useMatch({ end: true, path: "/accounts/:accountId" });
@@ -37,6 +39,7 @@ const AppBreadcrumbs: FC = () => {
 					accountId={operations.params.accountId ?? ""}
 					section="operations"
 				/>
+
 				<AccountScopeSwitch
 					accountId={operations.params.accountId ?? ""}
 					section="operations"
@@ -50,6 +53,7 @@ const AppBreadcrumbs: FC = () => {
 					accountId={events.params.accountId ?? ""}
 					section="events"
 				/>
+
 				<AccountScopeSwitch
 					accountId={events.params.accountId ?? ""}
 					section="events"
@@ -63,6 +67,7 @@ const AppBreadcrumbs: FC = () => {
 					accountId={income.params.accountId ?? ""}
 					section="income"
 				/>
+
 				<AccountScopeSwitch
 					accountId={income.params.accountId ?? ""}
 					section="income"
@@ -73,6 +78,7 @@ const AppBreadcrumbs: FC = () => {
 		return (
 			<Stack gap={0} mb="md">
 				<AccountBreadcrumbs accountId={account.params.accountId ?? ""} />
+
 				<AccountScopeSwitch accountId={account.params.accountId ?? ""} />
 			</Stack>
 		);
@@ -80,7 +86,12 @@ const AppBreadcrumbs: FC = () => {
 	if (cards) return <BreadcrumbTrail items={[{ label: t("bank.title") }]} />;
 	if (accounts)
 		return <BreadcrumbTrail items={[{ label: t("breadcrumbs.accounts") }]} />;
-	return settings ? <BreadcrumbTrail items={[{ label: t("breadcrumbs.settings") }]} /> : undefined;
+
+	return settings
+		? (
+				<BreadcrumbTrail items={[{ label: t("breadcrumbs.settings") }]} />
+			)
+		: undefined;
 };
 
 export { AppBreadcrumbs };