118 lines
3.0 KiB
TypeScript
118 lines
3.0 KiB
TypeScript
import type { FC } from "react";
|
|
|
|
import { useDocumentTitle } from "@mantine/hooks";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
import { useCurrentRoute } from "@/app/model";
|
|
import { useBankCard } from "@/entities/bank-card";
|
|
import { useBond } from "@/entities/bond";
|
|
import { useBrokerageAccounts } from "@/entities/brokerage-account";
|
|
import { useStock } from "@/entities/stock";
|
|
|
|
type DocumentTitleProps = { title: string };
|
|
|
|
const DocumentTitle: FC<DocumentTitleProps> = (props): undefined => {
|
|
const { t } = useTranslation();
|
|
useDocumentTitle(`${props.title} — ${t("appName")}`);
|
|
};
|
|
|
|
type AccountDocumentTitleProps = {
|
|
accountId: string;
|
|
section?: string;
|
|
};
|
|
|
|
const AccountDocumentTitle: FC<AccountDocumentTitleProps> = (props) => {
|
|
const { t } = useTranslation();
|
|
const { data } = useBrokerageAccounts();
|
|
|
|
const accountName
|
|
= props.accountId === "all"
|
|
? t("accounts.all")
|
|
: (data?.find(account => account.id === props.accountId)?.name
|
|
?? t("account.title"));
|
|
|
|
let section = t("portfolio.title");
|
|
|
|
switch (props.section ?? "") {
|
|
case "income": {
|
|
section = t("income.title");
|
|
break;
|
|
}
|
|
|
|
case "operations": {
|
|
section = t("ledger.title");
|
|
break;
|
|
}
|
|
|
|
case "events": {
|
|
section = t("events.title");
|
|
break;
|
|
}
|
|
|
|
default: {
|
|
break;
|
|
}
|
|
}
|
|
|
|
return <DocumentTitle title={`${section} — ${accountName}`} />;
|
|
};
|
|
|
|
type InstrumentDocumentTitleProps = { identifier: string };
|
|
|
|
const BondDocumentTitle: FC<InstrumentDocumentTitleProps> = (props) => {
|
|
const { t } = useTranslation();
|
|
const { data } = useBond(props.identifier);
|
|
|
|
return <DocumentTitle title={data?.name ?? t("bond.instrument")} />;
|
|
};
|
|
|
|
const StockDocumentTitle: FC<InstrumentDocumentTitleProps> = (props) => {
|
|
const { t } = useTranslation();
|
|
const { data } = useStock(props.identifier);
|
|
|
|
return <DocumentTitle title={data?.name ?? t("stock.share")} />;
|
|
};
|
|
|
|
const CardDocumentTitle: FC<InstrumentDocumentTitleProps> = (props) => {
|
|
const { t } = useTranslation();
|
|
const { data } = useBankCard(props.identifier);
|
|
|
|
return <DocumentTitle title={data?.name ?? t("bank.card")} />;
|
|
};
|
|
|
|
const ProtectedDocumentTitle: FC = () => {
|
|
const { t } = useTranslation();
|
|
|
|
const {
|
|
account,
|
|
bond,
|
|
bonds,
|
|
card,
|
|
cards,
|
|
settings,
|
|
stock,
|
|
stocks,
|
|
} = useCurrentRoute();
|
|
|
|
if (card) return <CardDocumentTitle identifier={card.params.cardId ?? ""} />;
|
|
if (account)
|
|
return (
|
|
<AccountDocumentTitle
|
|
accountId={account.params.accountId ?? ""}
|
|
section={account.params.section}
|
|
/>
|
|
);
|
|
if (bond) return <BondDocumentTitle identifier={bond.params.bondId ?? ""} />;
|
|
if (stock)
|
|
return <StockDocumentTitle identifier={stock.params.stockId ?? ""} />;
|
|
if (cards) return <DocumentTitle title={t("navigation.cards")} />;
|
|
if (bonds) return <DocumentTitle title={t("navigation.bonds")} />;
|
|
if (stocks) return <DocumentTitle title={t("navigation.stocks")} />;
|
|
|
|
return settings
|
|
? <DocumentTitle title={t("navigation.settings")} />
|
|
: <DocumentTitle title={t("navigation.accounts")} />;
|
|
};
|
|
|
|
export { ProtectedDocumentTitle };
|