From c59f9a2556731ad95ab8bd7eefe7fa8a41629834 Mon Sep 17 00:00:00 2001 From: Sebastian Date: Tue, 20 Dec 2022 17:45:24 -0300 Subject: use translation context from web-utils, don't use match react-router since is broken --- .../src/components/modal/index.tsx | 96 ++++++++++++---------- 1 file changed, 52 insertions(+), 44 deletions(-) (limited to 'packages/merchant-backoffice-ui/src/components/modal/index.tsx') diff --git a/packages/merchant-backoffice-ui/src/components/modal/index.tsx b/packages/merchant-backoffice-ui/src/components/modal/index.tsx index 6e5575f63..c9c7d0ce5 100644 --- a/packages/merchant-backoffice-ui/src/components/modal/index.tsx +++ b/packages/merchant-backoffice-ui/src/components/modal/index.tsx @@ -19,12 +19,12 @@ * @author Sebastian Javier Marchano (sebasjm) */ +import { useTranslationContext } from "@gnu-taler/web-util/lib/index.browser"; import { ComponentChildren, h, VNode } from "preact"; import { useState } from "preact/hooks"; import { useInstanceContext } from "../../context/instance.js"; -import { Translate, useTranslator } from "../../i18n/index.js"; import { DEFAULT_REQUEST_TIMEOUT } from "../../utils/constants.js"; -import { Loading, Spinner } from "../exception/loading.js"; +import { Spinner } from "../exception/loading.js"; import { FormProvider } from "../form/FormProvider.js"; import { Input } from "../form/Input.js"; @@ -49,6 +49,7 @@ export function ConfirmModal({ disabled, label = "Confirm", }: Props): VNode { + const { i18n } = useTranslationContext(); return (
@@ -65,14 +66,14 @@ export function ConfirmModal({
@@ -94,6 +95,7 @@ export function ContinueModal({ children, disabled, }: Props): VNode { + const { i18n } = useTranslationContext(); return (
@@ -110,7 +112,7 @@ export function ContinueModal({ disabled={disabled} onClick={onConfirm} > - Continue + Continue
@@ -147,6 +149,7 @@ export function ClearConfirmModal({ onConfirm, children, }: Props & { onClear?: () => void }): VNode { + const { i18n } = useTranslationContext(); return (
@@ -163,19 +166,19 @@ export function ClearConfirmModal({ onClick={onClear} disabled={onClear === undefined} > - Clear + Clear )}
@@ -210,7 +213,7 @@ export function DeleteModal({ onConfirm={() => onConfirm(element.id)} >

- If you delete the instance named "{element.name}" (ID:{" "} + If you delete the instance named "{element.name}" (ID:{" "} {element.id}), the merchant will no longer be able to process orders or refunds

@@ -241,12 +244,13 @@ export function PurgeModal({ onConfirm={() => onConfirm(element.id)} >

- If you purge the instance named "{element.name}" (ID:{" "} - {element.id}), you will also delete all it's transaction data. + If you purge the instance named "{element.name}" (ID:{" "} + {element.id}), you will also delete all it's transaction + data.

The instance will disappear from your list, and you will no longer be - able to access it's data. + able to access it's data.

Purging an instance cannot be undone. @@ -275,20 +279,22 @@ export function UpdateTokenModal({ new_token: "", repeat_token: "", }); - const i18n = useTranslator(); + const { i18n } = useTranslationContext(); const hasInputTheCorrectOldToken = oldToken && oldToken !== form.old_token; const errors = { old_token: hasInputTheCorrectOldToken - ? i18n`is not the same as the current access token` + ? i18n.str`is not the same as the current access token` : undefined, new_token: !form.new_token - ? i18n`cannot be empty` + ? i18n.str`cannot be empty` : form.new_token === form.old_token - ? i18n`cannot be the same as the old token` + ? i18n.str`cannot be the same as the old token` : undefined, repeat_token: - form.new_token !== form.repeat_token ? i18n`is not the same` : undefined, + form.new_token !== form.repeat_token + ? i18n.str`is not the same` + : undefined, }; const hasErrors = Object.keys(errors).some( @@ -297,7 +303,7 @@ export function UpdateTokenModal({ const instance = useInstanceContext(); - const text = i18n`You are updating the access token from instance with id ${instance.id}`; + const text = i18n.str`You are updating the access token from instance with id ${instance.id}`; return ( name="old_token" - label={i18n`Old access token`} - tooltip={i18n`access token currently in use`} + label={i18n.str`Old access token`} + tooltip={i18n.str`access token currently in use`} inputType="password" /> )} name="new_token" - label={i18n`New access token`} - tooltip={i18n`next access token to be used`} + label={i18n.str`New access token`} + tooltip={i18n.str`next access token to be used`} inputType="password" /> name="repeat_token" - label={i18n`Repeat access token`} - tooltip={i18n`confirm the same access token`} + label={i18n.str`Repeat access token`} + tooltip={i18n.str`confirm the same access token`} inputType="password" />

- + Clearing the access token will mean public access to the instance - +

@@ -353,16 +359,18 @@ export function SetTokenNewInstanceModal({ new_token: "", repeat_token: "", }); - const i18n = useTranslator(); + const { i18n } = useTranslationContext(); const errors = { new_token: !form.new_token - ? i18n`cannot be empty` + ? i18n.str`cannot be empty` : form.new_token === form.old_token - ? i18n`cannot be the same as the old access token` + ? i18n.str`cannot be the same as the old access token` : undefined, repeat_token: - form.new_token !== form.repeat_token ? i18n`is not the same` : undefined, + form.new_token !== form.repeat_token + ? i18n.str`is not the same` + : undefined, }; const hasErrors = Object.keys(errors).some( @@ -374,7 +382,7 @@ export function SetTokenNewInstanceModal({
-

{i18n`You are setting the access token for the new instance`}

+

{i18n.str`You are setting the access token for the new instance`}

@@ -388,22 +396,22 @@ export function SetTokenNewInstanceModal({ > name="new_token" - label={i18n`New access token`} - tooltip={i18n`next access token to be used`} + label={i18n.str`New access token`} + tooltip={i18n.str`next access token to be used`} inputType="password" /> name="repeat_token" - label={i18n`Repeat access token`} - tooltip={i18n`confirm the same access token`} + label={i18n.str`Repeat access token`} + tooltip={i18n.str`confirm the same access token`} inputType="password" />

- + With external authorization method no check will be done by the merchant backend - +

@@ -416,19 +424,19 @@ export function SetTokenNewInstanceModal({ onClick={onClear} disabled={onClear === undefined} > - Set external authorization + Set external authorization )}
@@ -443,14 +451,14 @@ export function SetTokenNewInstanceModal({ } export function LoadingModal({ onCancel }: { onCancel: () => void }): VNode { - const i18n = useTranslator(); + const { i18n } = useTranslationContext(); return (

- Operation in progress... + Operation in progress...

@@ -459,12 +467,12 @@ export function LoadingModal({ onCancel }: { onCancel: () => void }): VNode {
-

{i18n`The operation will be automatically canceled after ${DEFAULT_REQUEST_TIMEOUT} seconds`}

+

{i18n.str`The operation will be automatically canceled after ${DEFAULT_REQUEST_TIMEOUT} seconds`}

-- cgit v1.2.3