commit 7fe22024b6eb88192e035d53c0be86afdaf7edcb
parent d7cfc5837c574ea996f05ecf090e3a1fa5c7567d
Author: Sebastian <sebasjm@taler-systems.com>
Date: Mon, 15 Dec 2025 11:27:36 -0300
add title to i18n
Diffstat:
5 files changed, 113 insertions(+), 81 deletions(-)
diff --git a/packages/merchant-backoffice-ui/src/components/menu/index.tsx b/packages/merchant-backoffice-ui/src/components/menu/index.tsx
@@ -22,81 +22,85 @@ import { Notification } from "../../utils/types.js";
import { NavigationBar } from "./NavigationBar.js";
import { Sidebar } from "./SideBar.js";
import { useSessionContext } from "../../context/session.js";
-import { useNavigationContext } from "@gnu-taler/web-util/browser";
+import {
+ useNavigationContext,
+ useTranslationContext,
+} from "@gnu-taler/web-util/browser";
import { LangSelector } from "./LangSelector.js";
+import { InternationalizationAPI } from "@gnu-taler/taler-util";
-function getInstanceTitle(path: string, id: string): string {
+function getInstanceTitle(path: string, id: string, i18n: InternationalizationAPI): string {
switch (path) {
case InstancePaths.settings:
- return `${id}: Settings`;
+ return i18n.ctx("title")`${id}: Settings`;
case InstancePaths.bank_new:
- return `${id}: New bank account`;
+ return i18n.ctx("title")`${id}: New bank account`;
case InstancePaths.bank_list:
- return `${id}: Bank accounts`;
+ return i18n.ctx("title")`${id}: Bank accounts`;
case InstancePaths.bank_update:
- return `${id}: Update bank Account`;
+ return i18n.ctx("title")`${id}: Update bank Account`;
case InstancePaths.order_list:
- return `${id}: Orders`;
+ return i18n.ctx("title")`${id}: Orders`;
case InstancePaths.order_list_section:
- return `${id}: Orders`;
+ return i18n.ctx("title")`${id}: Orders`;
case InstancePaths.order_new:
- return `${id}: New order`;
+ return i18n.ctx("title")`${id}: New order`;
case InstancePaths.inventory_list:
- return `${id}: Inventory`;
+ return i18n.ctx("title")`${id}: Inventory`;
case InstancePaths.inventory_new:
- return `${id}: New product`;
+ return i18n.ctx("title")`${id}: New product`;
case InstancePaths.inventory_update:
- return `${id}: Update product`;
+ return i18n.ctx("title")`${id}: Update product`;
case InstancePaths.category_list:
- return `${id}: Category`;
+ return i18n.ctx("title")`${id}: Category`;
case InstancePaths.category_new:
- return `${id}: New category`;
+ return i18n.ctx("title")`${id}: New category`;
case InstancePaths.category_update:
- return `${id}: Update category`;
+ return i18n.ctx("title")`${id}: Update category`;
case InstancePaths.transfers_list:
- return `${id}: Wire transfers`;
+ return i18n.ctx("title")`${id}: Wire transfers`;
case InstancePaths.webhooks_list:
- return `${id}: Webhooks`;
+ return i18n.ctx("title")`${id}: Webhooks`;
case InstancePaths.webhooks_new:
- return `${id}: New webhook`;
+ return i18n.ctx("title")`${id}: New webhook`;
case InstancePaths.webhooks_update:
- return `${id}: Update webhook`;
+ return i18n.ctx("title")`${id}: Update webhook`;
case InstancePaths.otp_devices_list:
- return `${id}: OTP devices`;
+ return i18n.ctx("title")`${id}: OTP devices`;
case InstancePaths.otp_devices_new:
- return `${id}: New OTP device`;
+ return i18n.ctx("title")`${id}: New OTP device`;
case InstancePaths.otp_devices_update:
- return `${id}: Update OTP device`;
+ return i18n.ctx("title")`${id}: Update OTP device`;
case InstancePaths.templates_new:
- return `${id}: New template`;
+ return i18n.ctx("title")`${id}: New template`;
case InstancePaths.templates_update:
- return `${id}: Update template`;
+ return i18n.ctx("title")`${id}: Update template`;
case InstancePaths.templates_list:
- return `${id}: Templates`;
+ return i18n.ctx("title")`${id}: Templates`;
case InstancePaths.templates_use:
- return `${id}: Use template`;
+ return i18n.ctx("title")`${id}: Use template`;
case InstancePaths.interface:
- return `${id}: Personalization`;
+ return i18n.ctx("title")`${id}: Personalization`;
case InstancePaths.token_family_list:
- return `${id}: Token families`;
+ return i18n.ctx("title")`${id}: Token families`;
case InstancePaths.token_family_new:
- return `${id}: New token family`;
+ return i18n.ctx("title")`${id}: New token family`;
case InstancePaths.token_family_update:
- return `${id}: Update token family`;
+ return i18n.ctx("title")`${id}: Update token family`;
case InstancePaths.access_token_list:
- return `${id}: Access tokens`;
+ return i18n.ctx("title")`${id}: Access tokens`;
case InstancePaths.access_token_new:
- return `${id}: New access token`;
+ return i18n.ctx("title")`${id}: New access token`;
default: {
return "";
}
}
}
-function getAdminTitle(path: string, instance: string) {
- if (path === AdminPaths.new_instance) return `New instance`;
- if (path === AdminPaths.list_instances) return `Instances`;
- return getInstanceTitle(path, instance);
+function getAdminTitle(path: string, instance: string, i18n: InternationalizationAPI) {
+ if (path === AdminPaths.new_instance) return i18n.ctx("title")`New instance`;
+ if (path === AdminPaths.list_instances) return i18n.ctx("title")`Instances`;
+ return getInstanceTitle(path, instance, i18n);
}
interface MenuProps {}
@@ -117,12 +121,13 @@ function WithTitle({
export function Menu(_p: MenuProps): VNode {
const [mobileOpen, setMobileOpen] = useState(false);
+ const { i18n } = useTranslationContext();
const { state, deImpersonate } = useSessionContext();
const { path } = useNavigationContext();
const titleWithSubtitle = !state.isAdmin
- ? getInstanceTitle(path, state.instance)
- : getAdminTitle(path, state.instance);
+ ? getInstanceTitle(path, state.instance, i18n)
+ : getAdminTitle(path, state.instance, i18n);
const isLoggedIn = state.status === "loggedIn";
@@ -239,9 +244,8 @@ export function NotConnectedAppMenu({
width: "100%",
display: "flex",
justifyContent: "space-between",
- paddingTop:8,
+ paddingTop: 8,
paddingRight: 8,
-
}}
>
<div />
diff --git a/packages/merchant-backoffice-ui/src/paths/instance/orders/details/DetailPage.tsx b/packages/merchant-backoffice-ui/src/paths/instance/orders/details/DetailPage.tsx
@@ -392,10 +392,21 @@ function ClaimedPage({
readonly
label={i18n.str`Amount`}
/>
- <Input<Claimed>
+ <Input<Paid>
name="order_status"
readonly
label={i18n.str`Order status`}
+ toStr={(d) => {
+ switch (d) {
+ case "paid":
+ return i18n.str`Paid`;
+ case "claimed":
+ return i18n.str`Claimed`;
+ case "unpiad":
+ return i18n.str`Unpaid`;
+ }
+ return d;
+ }}
/>
</FormProvider>
</div>
@@ -723,6 +734,17 @@ function PaidPage({
name="order_status"
readonly
label={i18n.str`Order status`}
+ toStr={(d) => {
+ switch (d) {
+ case "paid":
+ return i18n.str`Paid`;
+ case "claimed":
+ return i18n.str`Claimed`;
+ case "unpiad":
+ return i18n.str`Unpaid`;
+ }
+ return d;
+ }}
/>
<TextField<Paid>
name="order_status_url"
@@ -858,10 +880,21 @@ function UnpaidPage({
label={i18n.str`Amount`}
tooltip={i18n.str`Total price for the transaction`}
/>
- <Input<Unpaid>
+ <Input<Paid>
name="order_status"
readonly
label={i18n.str`Order status`}
+ toStr={(d) => {
+ switch (d) {
+ case "paid":
+ return i18n.str`Paid`;
+ case "claimed":
+ return i18n.str`Claimed`;
+ case "unpiad":
+ return i18n.str`Unpaid`;
+ }
+ return d;
+ }}
/>
<Input<Unpaid>
name="order_status_url"
diff --git a/packages/merchant-backoffice-ui/src/paths/instance/orders/list/ListPage.tsx b/packages/merchant-backoffice-ui/src/paths/instance/orders/list/ListPage.tsx
@@ -81,7 +81,7 @@ export function ListPage({
>
<div
class="has-tooltip-right"
- data-tooltip={i18n.str`Only show paid orders`}
+ data-tooltip={i18n.str`Only show unpaid orders`}
>
<a onClick={() => onChangeSection(OrderListSection.NEW)}>
<i18n.Translate>New</i18n.Translate>
diff --git a/packages/web-util/src/context/navigation.ts b/packages/web-util/src/context/navigation.ts
@@ -17,12 +17,7 @@
import { ComponentChildren, createContext, h, VNode } from "preact";
import { useContext, useEffect, useState } from "preact/hooks";
import {
- AppLocation,
- ObjectOf,
- Location,
- findMatch,
- RouteDefinition,
- LocationNotFound,
+ AppLocation
} from "../utils/route.js";
/**
@@ -43,14 +38,14 @@ const Context = createContext<Type>(undefined);
export const useNavigationContext = (): Type => useContext(Context);
// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function useCurrentLocation<T extends ObjectOf<RouteDefinition<any>>>(
- pagesMap: T,
-): Location<T> | LocationNotFound<T> {
- const pageList = Object.keys(pagesMap as object) as Array<keyof T>;
- const { path, params } = useNavigationContext();
+// export function useCurrentLocation<T extends ObjectOf<RouteDefinition<any>>>(
+// pagesMap: T,
+// ): Location<T> | LocationNotFound<T> {
+// const pageList = Object.keys(pagesMap as object) as Array<keyof T>;
+// const { path, params } = useNavigationContext();
- return findMatch(pagesMap, pageList, path, params);
-}
+// return findMatch(pagesMap, pageList, path, params);
+// }
function getPathAndParamsFromWindow(): {
path: string;
diff --git a/packages/web-util/src/utils/route.ts b/packages/web-util/src/utils/route.ts
@@ -76,31 +76,31 @@ export function buildNullRoutDefinition<
* @param path
* @param params
*/
-export function findMatch<T extends ObjectOf<RouteDefinition>>(
- pagesMap: T,
- pageList: Array<keyof T>,
- path: string,
- params: Record<string, string[]>,
-): Location<T> | LocationNotFound<T> {
- for (let idx = 0; idx < pageList.length; idx++) {
- const name = pageList[idx];
- const found = pagesMap[name].pattern.exec(path);
- if (found !== null) {
- const values = {} as Record<string, unknown>;
-
- if (found.groups !== undefined) {
- Object.entries(found.groups).forEach(([key, value]) => {
- values[key] = value;
- });
- }
-
- // @ts-expect-error values is a map string which is equivalent to the RouteParamsType
- return { name, parent: pagesMap, values, params };
- }
- }
- // @ts-expect-error values is a map string which is equivalent to the RouteParamsType
- return { name: undefined, parent: pagesMap, values: {}, params };
-}
+// export function findMatch<T extends ObjectOf<RouteDefinition>>(
+// pagesMap: T,
+// pageList: Array<keyof T>,
+// path: string,
+// params: Record<string, string[]>,
+// ): Location<T> | LocationNotFound<T> {
+// for (let idx = 0; idx < pageList.length; idx++) {
+// const name = pageList[idx];
+// const found = pagesMap[name].pattern.exec(path);
+// if (found !== null) {
+// const values = {} as Record<string, unknown>;
+
+// if (found.groups !== undefined) {
+// Object.entries(found.groups).forEach(([key, value]) => {
+// values[key] = value;
+// });
+// }
+
+// // @ts-expect-error values is a map string which is equivalent to the RouteParamsType
+// return { name, parent: pagesMap, values, params };
+// }
+// }
+// // @ts-expect-error values is a map string which is equivalent to the RouteParamsType
+// return { name: undefined, parent: pagesMap, values: {}, params };
+// }
/**
* get the type of the params of a location
