From 1a71cd5ba2e9afb0ba7ef22760ecbe8b44aad953 Mon Sep 17 00:00:00 2001 From: Sebastian Date: Wed, 3 Jan 2024 14:52:00 -0300 Subject: split forms js --- .../src/pages/AntiMoneyLaunderingForm.tsx | 101 +-------------------- .../aml-backoffice-ui/src/pages/CaseDetails.tsx | 19 ++-- .../aml-backoffice-ui/src/pages/Cases.stories.tsx | 2 +- packages/aml-backoffice-ui/src/pages/Cases.tsx | 21 +---- .../aml-backoffice-ui/src/pages/CreateAccount.tsx | 6 +- .../aml-backoffice-ui/src/pages/NewFormEntry.tsx | 5 +- .../src/pages/ShowConsolidated.tsx | 53 +++-------- .../aml-backoffice-ui/src/pages/UnlockAccount.tsx | 4 +- 8 files changed, 43 insertions(+), 168 deletions(-) (limited to 'packages/aml-backoffice-ui/src/pages') diff --git a/packages/aml-backoffice-ui/src/pages/AntiMoneyLaunderingForm.tsx b/packages/aml-backoffice-ui/src/pages/AntiMoneyLaunderingForm.tsx index ede8c9955..07ef0481a 100644 --- a/packages/aml-backoffice-ui/src/pages/AntiMoneyLaunderingForm.tsx +++ b/packages/aml-backoffice-ui/src/pages/AntiMoneyLaunderingForm.tsx @@ -1,22 +1,14 @@ import { AbsoluteTime, AmountJson, Amounts, Codec, OperationResult, buildCodecForObject, codecForNumber, codecForString, codecOptional } from "@gnu-taler/taler-util"; +import { DefaultForm, useTranslationContext } from "@gnu-taler/web-util/browser"; import { h } from "preact"; -import { v1 as form_902_11e_v1 } from "../forms/902_11e.js"; -import { v1 as form_902_12e_v1 } from "../forms/902_12e.js"; -import { v1 as form_902_13e_v1 } from "../forms/902_13e.js"; -import { v1 as form_902_15e_v1 } from "../forms/902_15e.js"; -import { v1 as form_902_1e_v1 } from "../forms/902_1e.js"; -import { v1 as form_902_4e_v1 } from "../forms/902_4e.js"; -import { v1 as form_902_5e_v1 } from "../forms/902_5e.js"; -import { v1 as form_902_9e_v1 } from "../forms/902_9e.js"; -import { v1 as simplest } from "../forms/simplest.js"; -import { Pages } from "../pages.js"; -import { AmlExchangeBackend } from "../types.js"; import { useExchangeApiContext } from "../context/config.js"; -import { DefaultForm, FlexibleForm, useTranslationContext } from "@gnu-taler/web-util/browser"; +import { FormMetadata } from "../forms/index.js"; +import { Pages } from "../pages.js"; +import { AmlExchangeBackend } from "../utils/types.js"; export function AntiMoneyLaunderingForm({ account, formId, onSubmit }: { account: string, formId: string, onSubmit: (justification: Justification, state: AmlExchangeBackend.AmlState, threshold: AmountJson) => Promise; }) { const { i18n } = useTranslationContext() - const theForm = allForms.find((v) => v.id === formId) + const theForm = window.amlExchangeBackoffice!.forms(i18n).find((v) => v.id === formId) if (!theForm) { return
form with id {formId} not found
} @@ -66,24 +58,6 @@ export function AntiMoneyLaunderingForm({ account, formId, onSubmit }: { account ); } -export interface BaseForm { - state: AmlExchangeBackend.AmlState; - threshold: AmountJson; -} - -const DocumentDuplicateIcon = - - - - -export type FormMetadata = { - label: string, - id: string, - version: number, - icon: h.JSX.Element, - impl: (current: BaseForm) => FlexibleForm -} - export type Justification = { // form values value: T; @@ -155,68 +129,3 @@ export function parseJustification(s: string, listOfAllKnownForms: FormMetadata< } -export const allForms: Array> = [ - { - label: "Simple comment", - id: "simple_comment", - version: 1, - icon: DocumentDuplicateIcon, - impl: simplest, - }, - { - label: "Identification form", - id: "902.1e", - version: 1, - icon: DocumentDuplicateIcon, - impl: form_902_1e_v1, - }, - { - label: "Operational legal entity or partnership", - id: "902.11e", - version: 1, - icon: DocumentDuplicateIcon, - impl: form_902_11e_v1, - }, - { - label: "Foundations", - id: "902.12e", - version: 1, - icon: DocumentDuplicateIcon, - impl: form_902_12e_v1, - }, - { - label: "Declaration for trusts", - id: "902.13e", - version: 1, - icon: DocumentDuplicateIcon, - impl: form_902_13e_v1, - }, - { - label: "Information on life insurance policies", - id: "902.15e", - version: 1, - icon: DocumentDuplicateIcon, - impl: form_902_15e_v1, - }, - { - label: "Declaration of beneficial owner", - id: "902.9e", - version: 1, - icon: DocumentDuplicateIcon, - impl: form_902_9e_v1, - }, - { - label: "Customer profile", - id: "902.5e", - version: 1, - icon: DocumentDuplicateIcon, - impl: form_902_5e_v1, - }, - { - label: "Risk profile", - id: "902.4e", - version: 1, - icon: DocumentDuplicateIcon, - impl: form_902_4e_v1, - }, -]; diff --git a/packages/aml-backoffice-ui/src/pages/CaseDetails.tsx b/packages/aml-backoffice-ui/src/pages/CaseDetails.tsx index 0a2680b1b..409124121 100644 --- a/packages/aml-backoffice-ui/src/pages/CaseDetails.tsx +++ b/packages/aml-backoffice-ui/src/pages/CaseDetails.tsx @@ -6,15 +6,16 @@ import { TranslatedString, assertUnreachable } from "@gnu-taler/taler-util"; -import { DefaultForm, ErrorLoading, Loading, useTranslationContext } from "@gnu-taler/web-util/browser"; +import { DefaultForm, ErrorLoading, InternationalizationAPI, Loading, useTranslationContext } from "@gnu-taler/web-util/browser"; import { format } from "date-fns"; import { Fragment, VNode, h } from "preact"; import { useState } from "preact/hooks"; +import { FormMetadata } from "../forms/index.js"; import { useCaseDetails } from "../hooks/useCaseDetails.js"; import { Pages } from "../pages.js"; -import { AmlExchangeBackend } from "../types.js"; -import { FormMetadata, Justification, allForms, parseJustification } from "./AntiMoneyLaunderingForm.js"; +import { Justification, parseJustification } from "./AntiMoneyLaunderingForm.js"; import { ShowConsolidated } from "./ShowConsolidated.js"; +import { AmlExchangeBackend } from "../utils/types.js"; export type AmlEvent = AmlFormEvent | AmlFormEventError | KycCollectionEvent | KycExpirationEvent; type AmlFormEvent = { @@ -55,7 +56,7 @@ function selectSooner(a: WithTime, b: WithTime) { return AbsoluteTime.cmp(a.when, b.when); } -function titleForJustification(op: ReturnType): TranslatedString { +function titleForJustification(op: ReturnType, i18n: InternationalizationAPI): TranslatedString { if (op.type === "ok") { return op.body.justification.label as TranslatedString; } @@ -72,13 +73,15 @@ export function getEventsFromAmlHistory( aml: AmlExchangeBackend.AmlDecisionDetail[], kyc: AmlExchangeBackend.KycDetail[], ): AmlEvent[] { + const { i18n } = useTranslationContext() const ae: AmlEvent[] = aml.map((a) => { - const just = parseJustification(a.justification, allForms) + + const just = parseJustification(a.justification, window.amlExchangeBackoffice!.forms(i18n)) return { type: just.type === "ok" ? "aml-form" : "aml-form-error", state: a.new_state, threshold: Amounts.parseOrThrow(a.new_threshold), - title: titleForJustification(just), + title: titleForJustification(just, i18n), metadata: just.type === "ok" ? just.body.metadata : undefined, justification: just.type === "ok" ? just.body.justification : undefined, when: { @@ -92,14 +95,14 @@ export function getEventsFromAmlHistory( const ke = kyc.reduce((prev, k) => { prev.push({ type: "kyc-collection", - title: "collection" as TranslatedString, + title: i18n.str`collection`, when: AbsoluteTime.fromProtocolTimestamp(k.collection_time), values: !k.attributes ? {} : k.attributes, provider: k.provider_section, }); prev.push({ type: "kyc-expiration", - title: "expiration" as TranslatedString, + title: i18n.str`expiration`, when: AbsoluteTime.fromProtocolTimestamp(k.expiration_time), fields: !k.attributes ? [] : Object.keys(k.attributes), }); diff --git a/packages/aml-backoffice-ui/src/pages/Cases.stories.tsx b/packages/aml-backoffice-ui/src/pages/Cases.stories.tsx index 0355d5a31..3b9c8dacf 100644 --- a/packages/aml-backoffice-ui/src/pages/Cases.stories.tsx +++ b/packages/aml-backoffice-ui/src/pages/Cases.stories.tsx @@ -20,11 +20,11 @@ */ import * as tests from "@gnu-taler/web-util/testing"; -import { AmlExchangeBackend } from "../types.js"; import { CasesUI as TestedComponent, } from "./Cases.js"; import { AmountString } from "@gnu-taler/taler-util"; +import { AmlExchangeBackend } from "../utils/types.js"; export default { title: "cases", diff --git a/packages/aml-backoffice-ui/src/pages/Cases.tsx b/packages/aml-backoffice-ui/src/pages/Cases.tsx index 7161e4086..24f78f2d2 100644 --- a/packages/aml-backoffice-ui/src/pages/Cases.tsx +++ b/packages/aml-backoffice-ui/src/pages/Cases.tsx @@ -4,10 +4,10 @@ import { VNode, h } from "preact"; import { useState } from "preact/hooks"; import { useCases } from "../hooks/useCases.js"; import { Pages } from "../pages.js"; -import { AmlExchangeBackend } from "../types.js"; import { Officer } from "./Officer.js"; -import { amlStateConverter } from "./ShowConsolidated.js"; +import { amlStateConverter } from "../utils/converter.js"; +import { AmlExchangeBackend } from "../utils/types.js"; export function CasesUI({ records, filter, onChangeFilter, onFirstPage, onNext }: { onFirstPage?: () => void, onNext?: () => void, filter: AmlExchangeBackend.AmlState, onChangeFilter: (f: AmlExchangeBackend.AmlState) => void, records: TalerExchangeApi.AmlRecord[] }): VNode { const { i18n } = useTranslationContext(); @@ -42,15 +42,15 @@ export function CasesUI({ records, filter, onChangeFilter, onFirstPage, onNext } converter={amlStateConverter} choices={[ { - label: "Pending" as TranslatedString, + label: i18n.str`Pending`, value: AmlExchangeBackend.AmlState.pending, }, { - label: "Frozen" as TranslatedString, + label: i18n.str`Frozen`, value: AmlExchangeBackend.AmlState.frozen, }, { - label: "Normal" as TranslatedString, + label: i18n.str`Normal`, value: AmlExchangeBackend.AmlState.normal, }, ]} @@ -193,17 +193,6 @@ export const HomeIcon = () => - -export const ChevronRightIcon = () => - - - - -export const ArrowRightIcon = () => - - - - function Pagination({ onFirstPage, onNext }: { onFirstPage?: () => void, onNext?: () => void, }) { const { i18n } = useTranslationContext() return ( diff --git a/packages/aml-backoffice-ui/src/pages/CreateAccount.tsx b/packages/aml-backoffice-ui/src/pages/CreateAccount.tsx index cd4f2d923..603813f8e 100644 --- a/packages/aml-backoffice-ui/src/pages/CreateAccount.tsx +++ b/packages/aml-backoffice-ui/src/pages/CreateAccount.tsx @@ -60,7 +60,7 @@ export function CreateAccount({ const error = s?.password?.error ?? s?.repeat?.error; if (error) { notifyError( - "Can't create account" as TranslatedString, + i18n.str`Can't create account`, error as TranslatedString, ); } else { @@ -70,7 +70,7 @@ export function CreateAccount({ > 
New form for account: {account.substring(0, 16)}...
- {allForms.map((form, idx) => { + {window.amlExchangeBackoffice!.forms(i18n).map((form, idx) => { return ( = { @@ -32,32 +35,32 @@ export function ShowConsolidated({ }, design: [ { - title: "AML" as TranslatedString, + title: i18n.str`AML`, fields: [ { type: "amount", props: { - label: "Threshold" as TranslatedString, + label: i18n.str`Threshold`, name: "aml.threshold", }, }, { type: "choiceHorizontal", props: { - label: "State" as TranslatedString, + label: i18n.str`State`, name: "aml.state", converter: amlStateConverter, choices: [ { - label: "Frozen" as TranslatedString, + label: i18n.str`Frozen`, value: AmlExchangeBackend.AmlState.frozen, }, { - label: "Pending" as TranslatedString, + label: i18n.str`Pending`, value: AmlExchangeBackend.AmlState.pending, }, { - label: "Normal" as TranslatedString, + label: i18n.str`Normal`, value: AmlExchangeBackend.AmlState.normal, }, ], @@ -67,7 +70,7 @@ export function ShowConsolidated({ }, Object.entries(cons.kyc).length > 0 ? { - title: "KYC" as TranslatedString, + title: i18n.str`KYC`, fields: Object.entries(cons.kyc).map(([key, field]) => { const result: UIFormField = { type: "text", @@ -167,34 +170,4 @@ function getConsolidated( } return prev; }, initial); -} - -export const amlStateConverter = { - toStringUI: stringifyAmlState, - fromStringUI: parseAmlState, -}; - -function stringifyAmlState(s: AmlExchangeBackend.AmlState | undefined): string { - if (s === undefined) return ""; - switch (s) { - case AmlExchangeBackend.AmlState.normal: - return "normal"; - case AmlExchangeBackend.AmlState.pending: - return "pending"; - case AmlExchangeBackend.AmlState.frozen: - return "frozen"; - } -} - -function parseAmlState(s: string | undefined): AmlExchangeBackend.AmlState { - switch (s) { - case "normal": - return AmlExchangeBackend.AmlState.normal; - case "pending": - return AmlExchangeBackend.AmlState.pending; - case "frozen": - return AmlExchangeBackend.AmlState.frozen; - default: - throw Error(`unknown AML state: ${s}`); - } -} +} \ No newline at end of file diff --git a/packages/aml-backoffice-ui/src/pages/UnlockAccount.tsx b/packages/aml-backoffice-ui/src/pages/UnlockAccount.tsx index cd801256a..1b0342b12 100644 --- a/packages/aml-backoffice-ui/src/pages/UnlockAccount.tsx +++ b/packages/aml-backoffice-ui/src/pages/UnlockAccount.tsx @@ -32,7 +32,7 @@ export function UnlockAccount({ onSubmit={async (v) => { try { await onAccountUnlocked(v.password!); - notifyInfo("Account unlocked" as TranslatedString); + notifyInfo(i18n.str`Account unlocked`); } catch (e) { if (e instanceof UnwrapKeyError) { notifyError( @@ -47,7 +47,7 @@ export function UnlockAccount({ >