taler-typescript-core

Wallet core logic and WebUIs for various components
Log | Files | Refs | Submodules | README | LICENSE

commit bad3085879ab1589aa7dfb4832de749736fa6e46
parent 868f4b92a3a147916f0a0f37a22282e9352c2e70
Author: Sebastian <sebasjm@taler-systems.com>
Date:   Fri, 23 Jan 2026 11:03:17 -0300

fix #10530

Diffstat:
Mpackages/merchant-backoffice-ui/src/components/SolveMFA.tsx | 10+++++-----
Mpackages/merchant-backoffice-ui/src/components/form/InputDate.tsx | 17++++++++++-------
Mpackages/merchant-backoffice-ui/src/components/menu/index.tsx | 2+-
Mpackages/merchant-backoffice-ui/src/hooks/preference.ts | 6+++---
Mpackages/merchant-backoffice-ui/src/paths/instance/accessTokens/list/Table.tsx | 8++++----
Mpackages/merchant-backoffice-ui/src/paths/instance/orders/details/DetailPage.tsx | 10+++++-----
Mpackages/merchant-backoffice-ui/src/paths/instance/orders/details/Timeline.tsx | 6+++---
Mpackages/merchant-backoffice-ui/src/paths/instance/orders/list/ListPage.tsx | 10+++++-----
Mpackages/merchant-backoffice-ui/src/paths/instance/orders/list/Table.tsx | 10+++++-----
Mpackages/merchant-backoffice-ui/src/paths/instance/products/list/Table.tsx | 4++--
Mpackages/merchant-backoffice-ui/src/paths/instance/statistics/list/OrdersChart.tsx | 10+++++-----
Mpackages/merchant-backoffice-ui/src/paths/instance/tokenfamilies/create/CreatePage.tsx | 78+++++++++++++++++++++++++++++++++++++++++++++++++++++-------------------------
Mpackages/merchant-backoffice-ui/src/paths/instance/tokenfamilies/list/Table.tsx | 2+-
Mpackages/merchant-backoffice-ui/src/paths/instance/tokenfamilies/update/UpdatePage.tsx | 42+++++++++++++++++++++++++++++++++++++-----
Mpackages/merchant-backoffice-ui/src/paths/instance/transfers/list/Table.tsx | 10+++++-----
Mpackages/merchant-backoffice-ui/src/paths/instance/transfers/list/index.tsx | 6+++---
Mpackages/merchant-backoffice-ui/src/paths/settings/index.tsx | 8++++----
17 files changed, 151 insertions(+), 88 deletions(-)

diff --git a/packages/merchant-backoffice-ui/src/components/SolveMFA.tsx b/packages/merchant-backoffice-ui/src/components/SolveMFA.tsx @@ -21,7 +21,7 @@ import { Fragment, h, VNode } from "preact"; import { useEffect, useState } from "preact/hooks"; import { useSessionContext } from "../context/session.js"; import { - datetimeFormatForSettings, + datetimeFormatForPreferences, usePreference, } from "../hooks/preference.js"; import { FormErrors, FormProvider } from "./form/FormProvider.js"; @@ -61,7 +61,7 @@ function SolveChallenge({ const [showExpired, setExpired] = useState( expiration !== undefined && AbsoluteTime.isExpired(expiration), ); - const [settings] = usePreference(); + const [preferences] = usePreference(); useEffect(() => { if (showExpired) return; @@ -167,7 +167,7 @@ function SolveChallenge({ <span> {format( expiration.t_ms, - datetimeFormatForSettings(settings), + datetimeFormatForPreferences(preferences), )} </span> </i18n.Translate> @@ -229,7 +229,7 @@ export function SolveMFAChallenges({ expiration: AbsoluteTime; }>(); const [notification, safeFunctionHandler] = useLocalNotificationBetter(); - const [settings] = usePreference(); + const [preferences] = usePreference(); const sendMessage = safeFunctionHandler((ch: Challenge) => lib.instance.sendChallenge(ch.challenge_id), @@ -396,7 +396,7 @@ export function SolveMFAChallenges({ <p> <i18n.Translate> You have to wait until{" "} - {format(time.t_ms, datetimeFormatForSettings(settings))} + {format(time.t_ms, datetimeFormatForPreferences(preferences))} to send a new code. </i18n.Translate> </p> diff --git a/packages/merchant-backoffice-ui/src/components/form/InputDate.tsx b/packages/merchant-backoffice-ui/src/components/form/InputDate.tsx @@ -25,8 +25,8 @@ import { useState } from "preact/hooks"; import { DatePicker } from "../picker/DatePicker.js"; import { InputProps, useField } from "./useField.js"; import { - dateFormatForSettings, - datetimeFormatForSettings, + dateFormatForPreferences, + datetimeFormatForPreferences, usePreference, } from "../../hooks/preference.js"; @@ -53,7 +53,7 @@ export function InputDate<T>({ }: Props<keyof T>): VNode { const [opened, setOpened] = useState(false); const { i18n } = useTranslationContext(); - const [settings] = usePreference(); + const [preferences] = usePreference(); const { error, required, value, onChange } = useField<T>(name); @@ -61,14 +61,17 @@ export function InputDate<T>({ if (!value) { strValue = withTimestampSupport ? "unknown" : ""; } else if (value instanceof Date) { - strValue = format(value, datetimeFormatForSettings(settings)); + strValue = format(value, datetimeFormatForPreferences(preferences)); } else if (value.t_s) { strValue = value.t_s === "never" ? withTimestampSupport ? i18n.str`Never` : "" - : format(new Date(value.t_s * 1000), datetimeFormatForSettings(settings)); + : format( + new Date(value.t_s * 1000), + datetimeFormatForPreferences(preferences), + ); } return ( @@ -77,7 +80,7 @@ export function InputDate<T>({ <label class="label"> {label} {required && ( - <span class="has-text-danger" style={{marginLeft:5}}> + <span class="has-text-danger" style={{ marginLeft: 5 }}> * </span> )} @@ -108,7 +111,7 @@ export function InputDate<T>({ if (!readonly) setOpened(true); }} /> - {help} + <span class="has-text-grey">{help}</span> </p> <div class="control" diff --git a/packages/merchant-backoffice-ui/src/components/menu/index.tsx b/packages/merchant-backoffice-ui/src/components/menu/index.tsx @@ -82,7 +82,7 @@ function getInstanceTitle(path: string, id: string, i18n: InternationalizationAP case InstancePaths.interface: return i18n.ctx("title")`${id}: Personalization`; case InstancePaths.token_family_list: - return i18n.ctx("title")`${id}: Token families`; + return i18n.ctx("title")`${id}: Discounts & Suscriptions`; case InstancePaths.token_family_new: return i18n.ctx("title")`${id}: New token family`; case InstancePaths.token_family_update: diff --git a/packages/merchant-backoffice-ui/src/hooks/preference.ts b/packages/merchant-backoffice-ui/src/hooks/preference.ts @@ -120,7 +120,7 @@ export function usePreference(): [ return [value, updateField, update]; } -export function dateFormatForSettings(s: Preferences): string { +export function dateFormatForPreferences(s: Preferences): string { switch (s.dateFormat) { case "ymd": return "yyyy/MM/dd"; @@ -131,6 +131,6 @@ export function dateFormatForSettings(s: Preferences): string { } } -export function datetimeFormatForSettings(s: Preferences): string { - return dateFormatForSettings(s) + " HH:mm:ss"; +export function datetimeFormatForPreferences(s: Preferences): string { + return dateFormatForPreferences(s) + " HH:mm:ss"; } diff --git a/packages/merchant-backoffice-ui/src/paths/instance/accessTokens/list/Table.tsx b/packages/merchant-backoffice-ui/src/paths/instance/accessTokens/list/Table.tsx @@ -25,7 +25,7 @@ import { format } from "date-fns"; import { Fragment, h, VNode } from "preact"; import { StateUpdater, useState } from "preact/hooks"; import { - datetimeFormatForSettings, + datetimeFormatForPreferences, usePreference, } from "../../../../hooks/preference.js"; @@ -116,7 +116,7 @@ function Table({ onLoadMoreBefore, }: TableProps): VNode { const { i18n } = useTranslationContext(); - const [settings] = usePreference(); + const [preferences] = usePreference(); return ( <Fragment> <div class="table-container"> @@ -167,7 +167,7 @@ function Table({ ? i18n.str`Never` : format( new Date(t.creation_time.t_s * 1000), - datetimeFormatForSettings(settings), + datetimeFormatForPreferences(preferences), )} </td> <td @@ -178,7 +178,7 @@ function Table({ ? i18n.str`Never` : format( new Date(t.expiration.t_s * 1000), - datetimeFormatForSettings(settings), + datetimeFormatForPreferences(preferences), )} </td> <td 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 @@ -45,7 +45,7 @@ import { ProductList } from "../../../../components/product/ProductList.js"; import { useSessionContext } from "../../../../context/session.js"; import { useWaitForOrderPayment } from "../../../../hooks/order.js"; import { - datetimeFormatForSettings, + datetimeFormatForPreferences, usePreference, } from "../../../../hooks/preference.js"; import { mergeRefunds } from "../../../../utils/amount.js"; @@ -268,7 +268,7 @@ function ClaimedPage({ }) { const { i18n } = useTranslationContext(); const [value, valueHandler] = useState<Partial<Claimed>>(order); - const [settings] = usePreference(); + const [preferences] = usePreference(); useWaitForOrderPayment(id, order); const now = new Date(); const refundable = @@ -356,7 +356,7 @@ function ClaimedPage({ new Date( order.contract_terms.timestamp.t_s * 1000, ), - datetimeFormatForSettings(settings), + datetimeFormatForPreferences(preferences), )} </p> </div> @@ -816,7 +816,7 @@ function UnpaidPage({ }) { const [value, valueHandler] = useState<Partial<Unpaid>>(order); const { i18n } = useTranslationContext(); - const [settings] = usePreference(); + const [preferences] = usePreference(); useWaitForOrderPayment(id, order); return ( @@ -867,7 +867,7 @@ function UnpaidPage({ ? i18n.str`Never` : format( new Date(order.creation_time.t_s * 1000), - datetimeFormatForSettings(settings), + datetimeFormatForPreferences(preferences), )} </p> </div> diff --git a/packages/merchant-backoffice-ui/src/paths/instance/orders/details/Timeline.tsx b/packages/merchant-backoffice-ui/src/paths/instance/orders/details/Timeline.tsx @@ -22,7 +22,7 @@ import { format } from "date-fns"; import { h } from "preact"; import { useEffect, useState } from "preact/hooks"; import { - datetimeFormatForSettings, + datetimeFormatForPreferences, usePreference, } from "../../../../hooks/preference.js"; @@ -40,7 +40,7 @@ export function Timeline({ events: e }: Props) { }); events.sort((a, b) => a.when.getTime() - b.when.getTime()); - const [settings] = usePreference(); + const [preferences] = usePreference(); const [state, setState] = useState(events); useEffect(() => { const handle = setTimeout(() => { @@ -138,7 +138,7 @@ export function Timeline({ events: e }: Props) { <div class="timeline-content"> {e.type !== "now" && ( <p class="heading"> - {format(e.when, datetimeFormatForSettings(settings))} + {format(e.when, datetimeFormatForPreferences(preferences))} </p> )} <p>{e.description}</p> 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 @@ -26,7 +26,7 @@ import { Fragment, VNode, h } from "preact"; import { useState } from "preact/hooks"; import { DatePicker } from "../../../../components/picker/DatePicker.js"; import { - dateFormatForSettings, + dateFormatForPreferences, usePreference, } from "../../../../hooks/preference.js"; import { CardTable } from "./Table.js"; @@ -66,7 +66,7 @@ export function ListPage({ const { i18n } = useTranslationContext(); const dateTooltip = i18n.str`Select date to show nearby orders`; const [pickDate, setPickDate] = useState(false); - const [settings] = usePreference(); + const [preferences] = usePreference(); return ( <Fragment> @@ -196,11 +196,11 @@ export function ListPage({ ? "" : format( jumpToDate.t_ms, - dateFormatForSettings(settings), + dateFormatForPreferences(preferences), ) } - placeholder={i18n.str`Jump to date (${dateFormatForSettings( - settings, + placeholder={i18n.str`Jump to date (${dateFormatForPreferences( + preferences, )})`} onClick={() => { setPickDate(true); diff --git a/packages/merchant-backoffice-ui/src/paths/instance/orders/list/Table.tsx b/packages/merchant-backoffice-ui/src/paths/instance/orders/list/Table.tsx @@ -51,7 +51,7 @@ import { ConfirmModal } from "../../../../components/modal/index.js"; import { useSessionContext } from "../../../../context/session.js"; import { WithId } from "../../../../declaration.js"; import { - datetimeFormatForSettings, + datetimeFormatForPreferences, UIElement, usePreference, } from "../../../../hooks/preference.js"; @@ -160,7 +160,7 @@ function Table({ onLoadMoreBefore, }: TableProps): VNode { const { i18n } = useTranslationContext(); - const [settings] = usePreference(); + const [preferences] = usePreference(); const { state: session, lib } = useSessionContext(); const [notification, safeFunctionHandler] = useLocalNotificationBetter(); const copyUrl = safeFunctionHandler((token: AccessToken, id: string) => @@ -224,7 +224,7 @@ function Table({ ? i18n.str`Never` : format( new Date(i.timestamp.t_s * 1000), - datetimeFormatForSettings(settings), + datetimeFormatForPreferences(preferences), )} </td> <td @@ -326,7 +326,7 @@ export function RefundModal({ }: RefundModalProps): VNode { type State = { mainReason?: string; description?: string; refund?: string }; const [form, setValue] = useState<State>({}); - const [settings] = usePreference(); + const [preferences] = usePreference(); const { i18n } = useTranslationContext(); // const [errors, setErrors] = useState<FormErrors<State>>({}); const [notification, safeFunctionHandler] = useLocalNotificationBetter(); @@ -458,7 +458,7 @@ export function RefundModal({ ? i18n.str`Never` : format( new Date(r.timestamp.t_s * 1000), - datetimeFormatForSettings(settings), + datetimeFormatForPreferences(preferences), )} </td> <td>{r.amount}</td> diff --git a/packages/merchant-backoffice-ui/src/paths/instance/products/list/Table.tsx b/packages/merchant-backoffice-ui/src/paths/instance/products/list/Table.tsx @@ -46,7 +46,7 @@ import { useSessionContext } from "../../../../context/session.js"; import { WithId } from "../../../../declaration.js"; import { UIElement, - dateFormatForSettings, + dateFormatForPreferences, usePreference, } from "../../../../hooks/preference.js"; @@ -213,7 +213,7 @@ function Table({ ? i18n.str`Never` : `restock at ${format( new Date(i.next_restock.t_s * 1000), - dateFormatForSettings(preference), + dateFormatForPreferences(preference), )}`; let stockInfo: ComponentChildren = ""; if (i.total_stock < 0) { diff --git a/packages/merchant-backoffice-ui/src/paths/instance/statistics/list/OrdersChart.tsx b/packages/merchant-backoffice-ui/src/paths/instance/statistics/list/OrdersChart.tsx @@ -33,7 +33,7 @@ import { Fragment, VNode, h } from "preact"; import { useState } from "preact/hooks"; import { DatePicker } from "../../../../components/picker/DatePicker.js"; import { - dateFormatForSettings, + dateFormatForPreferences, usePreference, } from "../../../../hooks/preference.js"; import { @@ -72,7 +72,7 @@ export function OrdersChart({ onSelectDate, }: OrdersChartProps): VNode { const { i18n } = useTranslationContext(); - const [settings] = usePreference(); + const [preferences] = usePreference(); const [pickDate, setPickDate] = useState(false); const [showTable, setShowTable] = useState<boolean>(false); const counters = useInstanceStatisticsCounter(); @@ -170,11 +170,11 @@ export function OrdersChart({ ? "" : format( filterFromDate.t_ms, - dateFormatForSettings(settings), + dateFormatForPreferences(preferences), ) } - placeholder={i18n.str`Start from (${dateFormatForSettings( - settings, + placeholder={i18n.str`Start from (${dateFormatForPreferences( + preferences, )})`} onClick={() => { setPickDate(true); diff --git a/packages/merchant-backoffice-ui/src/paths/instance/tokenfamilies/create/CreatePage.tsx b/packages/merchant-backoffice-ui/src/paths/instance/tokenfamilies/create/CreatePage.tsx @@ -32,18 +32,22 @@ import { useLocalNotificationBetter, useTranslationContext, } from "@gnu-taler/web-util/browser"; +import { addDays, addMonths, endOfMonth, format, startOfMonth } from "date-fns"; import { h, VNode } from "preact"; import { useState } from "preact/hooks"; import { FormErrors, FormProvider, } from "../../../../components/form/FormProvider.js"; -import { Input } from "../../../../components/form/Input.js"; import { InputDate } from "../../../../components/form/InputDate.js"; import { InputDuration } from "../../../../components/form/InputDuration.js"; import { InputSelector } from "../../../../components/form/InputSelector.js"; import { InputWithAddon } from "../../../../components/form/InputWithAddon.js"; import { useSessionContext } from "../../../../context/session.js"; +import { + dateFormatForPreferences, + usePreference, +} from "../../../../hooks/preference.js"; const TALER_SCREEN_ID = 67; @@ -54,6 +58,13 @@ export interface Props { onBack?: () => void; } +const today = new Date(); +const nextMonth = addMonths(today, 1); +const firstDayNextMonth = startOfMonth(nextMonth); +const lastDayNextMonth = endOfMonth(nextMonth); +const afterLastDayNextMonth = addDays(lastDayNextMonth, 1); +const firstDayNextMonthAnd30Days = addDays(firstDayNextMonth, 30); + export function CreatePage({ onCreated, onBack }: Props): VNode { const { state: session, lib } = useSessionContext(); const [notification, safeFunctionHandler] = useLocalNotificationBetter(); @@ -101,6 +112,7 @@ export function CreatePage({ onCreated, onBack }: Props): VNode { assertUnreachable(fail); } }; + const [preferences] = usePreference(); return ( <div> @@ -126,46 +138,62 @@ export function CreatePage({ onCreated, onBack }: Props): VNode { <InputSelector<Entity> name="kind" label={i18n.str`Kind`} - tooltip={i18n.str`Token family kind`} + tooltip={i18n.str`Choose between a discount and a subscription`} values={["discount", "subscription"]} /> - <Input<Entity> - name="name" - inputType="text" - label={i18n.str`Name`} - tooltip={i18n.str`User-readable token family name`} - /> - <Input<Entity> - name="description" - inputType="multiline" - label={i18n.str`Description`} - tooltip={i18n.str`Token family description for customers`} - /> <InputDate<Entity> name="valid_after" - label={i18n.str`Valid After`} - tooltip={i18n.str`Token family can issue tokens after this date`} + label={i18n.str`Start Date`} + tooltip={i18n.str`The first day the coupon/subscription can be used.`} + help={i18n.str` If set to ${format( + firstDayNextMonth, + dateFormatForPreferences(preferences), + )}, it cannot be used before this date.`} withTimestampSupport /> + <InputDate<Entity> name="valid_before" - label={i18n.str`Valid Before`} - tooltip={i18n.str`Token family can issue tokens until this date`} + label={i18n.str`Expiration Date`} + tooltip={i18n.str`The last day the coupon/subscription can be used.`} + help={i18n.str` If set to ${format( + lastDayNextMonth, + dateFormatForPreferences(preferences), + )}, they are no longer valid from ${format( + afterLastDayNextMonth, + dateFormatForPreferences(preferences), + )}.`} withTimestampSupport /> <InputDuration<Entity> - name="validity_granularity" - label={i18n.str`Validity Granularity`} - tooltip={i18n.str`Rounding granularity for the start validity of keys, must be 1 minute, 1 hour, 1 day, 1 week, 30 days or 90 days`} - useProtocolDuration - /> - <InputDuration<Entity> name="duration" label={i18n.str`Duration`} - tooltip={i18n.str`Validity duration of a issued token`} + tooltip={i18n.str`How long the coupon/subscription remains valid after being activated.`} + help={i18n.str`If you activate it on ${format( + firstDayNextMonth, + dateFormatForPreferences(preferences), + )} with duration of 30 days, it remains valid until ${format( + firstDayNextMonthAnd30Days, + dateFormatForPreferences(preferences), + )}.`} withForever useProtocolDuration /> + + <InputDuration<Entity> + name="validity_granularity" + label={i18n.str`Validity Granularity`} + tooltip={i18n.str`Rounds the validity to a specific unit of time (like day, hour, minute).`} + help={i18n.str` If set to “1 day”, a 30-day pass bought on ${format( + firstDayNextMonth, + dateFormatForPreferences(preferences), + )} is valid until the end of ${format( + firstDayNextMonthAnd30Days, + dateFormatForPreferences(preferences), + )}, not exactly at the same time of day you purchased it.`} + useProtocolDuration + /> + <div class="buttons is-right mt-5"> {onBack && ( <button type="button" class="button" onClick={onBack}> diff --git a/packages/merchant-backoffice-ui/src/paths/instance/tokenfamilies/list/Table.tsx b/packages/merchant-backoffice-ui/src/paths/instance/tokenfamilies/list/Table.tsx @@ -122,7 +122,7 @@ function Table({ <i18n.Translate>Name</i18n.Translate> </th> <th> - <i18n.Translate>Valid After</i18n.Translate> + <i18n.Translate>Start Date</i18n.Translate> </th> <th> <i18n.Translate>Valid Before</i18n.Translate> diff --git a/packages/merchant-backoffice-ui/src/paths/instance/tokenfamilies/update/UpdatePage.tsx b/packages/merchant-backoffice-ui/src/paths/instance/tokenfamilies/update/UpdatePage.tsx @@ -41,6 +41,11 @@ import { InputDate } from "../../../../components/form/InputDate.js"; import { InputDuration } from "../../../../components/form/InputDuration.js"; import { useSessionContext } from "../../../../context/session.js"; import { undefinedIfEmpty } from "../../../../utils/table.js"; +import { + datetimeFormatForPreferences, + usePreference, +} from "../../../../hooks/preference.js"; +import { addDays, addMonths, endOfMonth, format, startOfMonth } from "date-fns"; const TALER_SCREEN_ID = 70; @@ -52,6 +57,13 @@ interface Props { tokenFamily: TalerMerchantApi.TokenFamilyDetails; } +const today = new Date(); +const nextMonth = addMonths(today, 1); +const firstDayNextMonth = startOfMonth(nextMonth); +const lastDayNextMonth = endOfMonth(nextMonth); +const afterLastDayNextMonth = addDays(lastDayNextMonth, 1); +const firstDayNextMonthAnd30Days = addDays(firstDayNextMonth, 30); + export function UpdatePage({ onUpdated, onBack, tokenFamily }: Props) { const [value, valueHandler] = useState<Partial<Entity>>(tokenFamily); const { i18n } = useTranslationContext(); @@ -85,6 +97,8 @@ export function UpdatePage({ onUpdated, onBack, tokenFamily }: Props) { } }; + const [preferences] = usePreference(); + return ( <div> <LocalNotificationBannerBulma notification={notification} /> @@ -129,20 +143,38 @@ export function UpdatePage({ onUpdated, onBack, tokenFamily }: Props) { /> <InputDate<Entity> name="valid_after" - label={i18n.str`Valid After`} - tooltip={i18n.str`Token family can issue tokens after this date`} + label={i18n.str`Start Date`} + tooltip={i18n.str`The first day the coupon/subscription can be used.`} + help={i18n.str` If set to ${format( + firstDayNextMonth, + datetimeFormatForPreferences(preferences), + )}, it cannot be used before this date.`} withTimestampSupport /> <InputDate<Entity> name="valid_before" - label={i18n.str`Valid Before`} - tooltip={i18n.str`Token family can issue tokens until this date`} + label={i18n.str`Expiration Date`} + tooltip={i18n.str`The last day the coupon/subscription can be used.`} + help={i18n.str` If set to ${format( + lastDayNextMonth, + datetimeFormatForPreferences(preferences), + )}, they are no longer valid from ${format( + afterLastDayNextMonth, + datetimeFormatForPreferences(preferences), + )}.`} withTimestampSupport /> <InputDuration<Entity> name="duration" label={i18n.str`Duration`} - tooltip={i18n.str`Validity duration of a issued token`} + tooltip={i18n.str`How long the coupon/subscription remains valid after being activated.`} + help={i18n.str`If you activate it on ${format( + firstDayNextMonth, + datetimeFormatForPreferences(preferences), + )} with duration of 30 days, it remains valid until ${format( + firstDayNextMonthAnd30Days, + datetimeFormatForPreferences(preferences), + )}.`} withForever useProtocolDuration /> diff --git a/packages/merchant-backoffice-ui/src/paths/instance/transfers/list/Table.tsx b/packages/merchant-backoffice-ui/src/paths/instance/transfers/list/Table.tsx @@ -25,7 +25,7 @@ import { format } from "date-fns"; import { h, VNode } from "preact"; import { WithId } from "../../../../declaration.js"; import { - datetimeFormatForSettings, + datetimeFormatForPreferences, usePreference, } from "../../../../hooks/preference.js"; @@ -45,7 +45,7 @@ export function CardTableIncoming({ onSelectedToConfirm, }: TablePropsIncoming): VNode { const { i18n } = useTranslationContext(); - const [settings] = usePreference(); + const [preferences] = usePreference(); return ( <div class="card has-table"> <header class="card-header"> @@ -116,7 +116,7 @@ export function CardTableIncoming({ ? i18n.str`never` : format( i.execution_time.t_s * 1000, - datetimeFormatForSettings(settings), + datetimeFormatForPreferences(preferences), ) : i18n.str`unknown`} </td> @@ -158,7 +158,7 @@ export function CardTableVerified({ onLoadMoreBefore, }: TablePropsVerified): VNode { const { i18n } = useTranslationContext(); - const [settings] = usePreference(); + const [preferences] = usePreference(); return ( <div class="card has-table"> <header class="card-header"> @@ -210,7 +210,7 @@ export function CardTableVerified({ ? i18n.str`never` : format( i.execution_time.t_s * 1000, - datetimeFormatForSettings(settings), + datetimeFormatForPreferences(preferences), ) : i18n.str`unknown`} </td> diff --git a/packages/merchant-backoffice-ui/src/paths/instance/transfers/list/index.tsx b/packages/merchant-backoffice-ui/src/paths/instance/transfers/list/index.tsx @@ -41,7 +41,7 @@ import { ConfirmModal, Row } from "../../../../components/modal/index.js"; import { useSessionContext } from "../../../../context/session.js"; import { useInstanceBankAccounts } from "../../../../hooks/bank.js"; import { - datetimeFormatForSettings, + datetimeFormatForPreferences, usePreference, } from "../../../../hooks/preference.js"; import { @@ -68,7 +68,7 @@ export default function ListTransfer({}: Props): VNode { const { state: session, lib } = useSessionContext(); const [position, setPosition] = useState<string | undefined>(undefined); - const [settings] = usePreference(); + const [preferences] = usePreference(); const instance = useInstanceBankAccounts(); const accounts = @@ -215,7 +215,7 @@ export default function ListTransfer({}: Props): VNode { name={i18n.str`Time`} value={format( selected.execution_time.t_s * 1000, - datetimeFormatForSettings(settings), + datetimeFormatForPreferences(preferences), )} /> ) : undefined} diff --git a/packages/merchant-backoffice-ui/src/paths/settings/index.tsx b/packages/merchant-backoffice-ui/src/paths/settings/index.tsx @@ -26,7 +26,7 @@ import { } from "../../components/form/FormProvider.js"; import { InputSelector } from "../../components/form/InputSelector.js"; import { LangSelector } from "../../components/menu/LangSelector.js"; -import { dateFormatForSettings, datetimeFormatForSettings, Preferences, usePreference } from "../../hooks/preference.js"; +import { dateFormatForPreferences, datetimeFormatForPreferences, Preferences, usePreference } from "../../hooks/preference.js"; import { useSessionContext } from "../../context/session.js"; import { NotificationCard } from "../../components/menu/index.js"; import { format } from "date-fns"; @@ -63,7 +63,7 @@ export function Settings({ onClose }: { onClose?: () => void }): VNode { updateValue(v); } - const [settings] = usePreference(); + const [preferences] = usePreference(); return ( <div> @@ -102,8 +102,8 @@ export function Settings({ onClose }: { onClose?: () => void }): VNode { expand={true} help={ <p> - {format(new Date(), dateFormatForSettings(settings))}<br/> - {format(new Date(), datetimeFormatForSettings(settings))}<br/> + {format(new Date(), dateFormatForPreferences(preferences))}<br/> + {format(new Date(), datetimeFormatForPreferences(preferences))}<br/> </p> } toStr={(e) => {