diff options
author | Sebastian <sebasjm@gmail.com> | 2024-05-03 18:23:01 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2024-05-03 18:23:01 -0300 |
commit | 35fee72ef3d75b7a9681353ab7a1ca5bacff150e (patch) | |
tree | ab5fd0588c50d389a24651a18ca8756b39cd7772 /packages/aml-backoffice-ui/src/pages | |
parent | 5db79542f34477911f14f2e454925368c0d2c33f (diff) | |
download | wallet-core-35fee72ef3d75b7a9681353ab7a1ca5bacff150e.tar.xz |
form implemented, moving functions to web-utils some final testing still pedning
Diffstat (limited to 'packages/aml-backoffice-ui/src/pages')
6 files changed, 38 insertions, 193 deletions
diff --git a/packages/aml-backoffice-ui/src/pages/CaseDetails.tsx b/packages/aml-backoffice-ui/src/pages/CaseDetails.tsx index 11b6d053e..bb936cebf 100644 --- a/packages/aml-backoffice-ui/src/pages/CaseDetails.tsx +++ b/packages/aml-backoffice-ui/src/pages/CaseDetails.tsx @@ -34,24 +34,26 @@ import { import { DefaultForm, ErrorLoading, + FormMetadata, InternationalizationAPI, Loading, - useTranslationContext + useTranslationContext, } from "@gnu-taler/web-util/browser"; import { format } from "date-fns"; import { VNode, h } from "preact"; import { useState } from "preact/hooks"; import { privatePages } from "../Routing.js"; -import { FormMetadata, useUiFormsContext } from "../context/ui-forms.js"; +import { useUiFormsContext } from "../context/ui-forms.js"; +import { preloadedForms } from "../forms/index.js"; import { useCaseDetails } from "../hooks/useCaseDetails.js"; import { ShowConsolidated } from "./ShowConsolidated.js"; -import { preloadedForms } from "../forms/index.js"; export type AmlEvent = | AmlFormEvent | AmlFormEventError | KycCollectionEvent | KycExpirationEvent; + type AmlFormEvent = { type: "aml-form"; when: AbsoluteTime; @@ -163,9 +165,9 @@ export function CaseDetails({ account }: { account: string }) { const { i18n } = useTranslationContext(); const details = useCaseDetails(account); - const {forms} = useUiFormsContext() + const { forms } = useUiFormsContext(); - const allForms = [...forms, ...preloadedForms(i18n)] + const allForms = [...forms, ...preloadedForms(i18n)]; if (!details) { return <Loading />; } @@ -185,7 +187,12 @@ export function CaseDetails({ account }: { account: string }) { } const { aml_history, kyc_attributes } = details.body; - const events = getEventsFromAmlHistory(aml_history, kyc_attributes, i18n, allForms); + const events = getEventsFromAmlHistory( + aml_history, + kyc_attributes, + i18n, + allForms, + ); if (showForm !== undefined) { return ( diff --git a/packages/aml-backoffice-ui/src/pages/CaseUpdate.tsx b/packages/aml-backoffice-ui/src/pages/CaseUpdate.tsx index bbfa65ca7..2f3ee054d 100644 --- a/packages/aml-backoffice-ui/src/pages/CaseUpdate.tsx +++ b/packages/aml-backoffice-ui/src/pages/CaseUpdate.tsx @@ -23,35 +23,27 @@ import { assertUnreachable, } from "@gnu-taler/taler-util"; import { - Addon, Button, + FormMetadata, InternationalizationAPI, LocalNotificationBanner, RenderAllFieldsByUiConfig, - StringConverter, - UIFieldHandler, - UIFormField, + UIHandlerId, useExchangeApiContext, useLocalNotificationHandler, - useTranslationContext, + useTranslationContext } from "@gnu-taler/web-util/browser"; import { Fragment, VNode, h } from "preact"; import { privatePages } from "../Routing.js"; import { - FormMetadata, - UIFieldBaseDescription, - UIFormFieldBaseConfig, - UIFormFieldConfig, - UIHandlerId, - useUiFormsContext, + useUiFormsContext } from "../context/ui-forms.js"; import { preloadedForms } from "../forms/index.js"; -import { FormErrors, FormHandler, useFormState } from "../hooks/form.js"; +import { FormErrors, convertUiField, useFormState } from "../hooks/form.js"; import { useOfficer } from "../hooks/officer.js"; import { Justification } from "./CaseDetails.js"; -import { HandleAccountNotReady } from "./HandleAccountNotReady.js"; import { undefinedIfEmpty } from "./CreateAccount.js"; -import { getConverterById } from "../utils/converter.js"; +import { HandleAccountNotReady } from "./HandleAccountNotReady.js"; function searchForm( i18n: InternationalizationAPI, @@ -112,16 +104,18 @@ export function CaseUpdate({ theForm.config.design.forEach((section) => { section.fields.forEach((field) => { if ("id" in field.properties) { + //FIXME: this should be a validation + if (shape.indexOf(field.properties.id) !== -1) { + throw Error(`already present: ${field.properties.id}`) + } shape.push(field.properties.id); - // const path = field.properties.id.split("."); - // defaultValue = setValueDeeper(defaultValue, path, undefined); } }); }); const [form, state] = useFormState<FormType>(shape, initial, (st) => { const errors = undefinedIfEmpty<FormErrors<FormType>>({ - state: !st.state ? i18n.str`required` : undefined, + state: st.state === undefined ? i18n.str`required` : undefined, threshold: !st.threshold ? i18n.str`required` : undefined, when: !st.when ? i18n.str`required` : undefined, comment: !st.comment ? i18n.str`required` : undefined, @@ -140,8 +134,6 @@ export function CaseUpdate({ }; }); - console.log("NOW FORM", form); - const validatedForm = state.status !== "ok" ? undefined : state.result; const submitHandler = @@ -249,7 +241,6 @@ export function SelectForm({ account }: { account: string }) { const { i18n } = useTranslationContext(); const { forms } = useUiFormsContext(); const pf = preloadedForms(i18n); - return ( <div> <pre>New form for account: {account.substring(0, 16)}...</pre> @@ -279,147 +270,3 @@ export function SelectForm({ account }: { account: string }) { ); } -function getValueDeeper( - object: Record<string, any>, - names: string[], -): UIFieldHandler { - if (names.length === 0) return object as UIFieldHandler; - const [head, ...rest] = names; - if (!head) { - return getValueDeeper(object, rest); - } - if (object === undefined) { - throw Error("handler not found"); - } - return getValueDeeper(object[head], rest); -} - -function setValueDeeper(object: any, names: string[], value: any): any { - if (names.length === 0) return value; - const [head, ...rest] = names; - if (!head) { - return setValueDeeper(object, rest, value); - } - if (object === undefined) { - return { [head]: setValueDeeper({}, rest, value) }; - } - return { ...object, [head]: setValueDeeper(object[head] ?? {}, rest, value) }; -} - -function getAddonById(_id: string | undefined): Addon { - return undefined!; -} - - -function converInputFieldsProps( - form: FormHandler<unknown>, - p: UIFormFieldBaseConfig, -) { - return { - converter: getConverterById(p.converterId), - handler: getValueDeeper(form, p.id.split(".")), - }; -} - -function converBaseFieldsProps( - i18n_: InternationalizationAPI, - p: UIFieldBaseDescription, -) { - return { - after: getAddonById(p.addonAfterId), - before: getAddonById(p.addonBeforeId), - hidden: p.hidden, - name: p.name, - help: i18n_.str`${p.help}`, - label: i18n_.str`${p.label}`, - tooltip: i18n_.str`${p.tooltip}`, - }; -} - -function convertUiField( - i18n_: InternationalizationAPI, - fieldConfig: UIFormFieldConfig[], - form: FormHandler<unknown>, -): UIFormField[] { - return fieldConfig.map((config) => { - // NON input fields - switch (config.type) { - case "caption": { - const resp: UIFormField = { - type: config.type, - properties: converBaseFieldsProps(i18n_, config.properties), - }; - return resp; - } - case "group": { - const resp: UIFormField = { - type: config.type, - properties: { - ...converBaseFieldsProps(i18n_, config.properties), - fields: convertUiField(i18n_, config.properties.fields, form), - }, - }; - return resp; - } - } - // Input Fields - switch (config.type) { - case "absoluteTime": { - return undefined!; - } - case "amount": { - return { - type: "amount", - properties: { - ...converBaseFieldsProps(i18n_, config.properties), - ...converInputFieldsProps(form, config.properties), - }, - } as UIFormField; - } - case "array": { - return undefined!; - } - case "choiceHorizontal": { - return { - type: "choiceHorizontal", - properties: { - ...converBaseFieldsProps(i18n_, config.properties), - ...converInputFieldsProps(form, config.properties), - choices: config.properties.choices, - }, - } as UIFormField; - } - case "choiceStacked": - case "file": - case "integer": - case "selectMultiple": - case "selectOne": { - return undefined!; - } - case "text": { - return { - type: "text", - properties: { - ...converBaseFieldsProps(i18n_, config.properties), - ...converInputFieldsProps(form, config.properties), - }, - } as UIFormField; - } - case "textArea": { - return { - type: "text", - properties: { - ...converBaseFieldsProps(i18n_, config.properties), - ...converInputFieldsProps(form, config.properties), - }, - } as UIFormField; - } - case "toggle": { - return undefined!; - } - default: { - assertUnreachable(config); - } - } - }); -} diff --git a/packages/aml-backoffice-ui/src/pages/Cases.tsx b/packages/aml-backoffice-ui/src/pages/Cases.tsx index 3860bcd98..7b848487a 100644 --- a/packages/aml-backoffice-ui/src/pages/Cases.tsx +++ b/packages/aml-backoffice-ui/src/pages/Cases.tsx @@ -24,6 +24,7 @@ import { ErrorLoading, InputChoiceHorizontal, Loading, + UIHandlerId, useTranslationContext, } from "@gnu-taler/web-util/browser"; import { Fragment, VNode, h } from "preact"; @@ -34,7 +35,6 @@ import { privatePages } from "../Routing.js"; import { FormErrors, RecursivePartial, useFormState } from "../hooks/form.js"; import { undefinedIfEmpty } from "./CreateAccount.js"; import { Officer } from "./Officer.js"; -import { UIHandlerId } from "../context/ui-forms.js"; import { amlStateConverter } from "../utils/converter.js"; type FormType = { diff --git a/packages/aml-backoffice-ui/src/pages/CreateAccount.tsx b/packages/aml-backoffice-ui/src/pages/CreateAccount.tsx index 98160fb3a..f4904933b 100644 --- a/packages/aml-backoffice-ui/src/pages/CreateAccount.tsx +++ b/packages/aml-backoffice-ui/src/pages/CreateAccount.tsx @@ -18,6 +18,7 @@ import { InputLine, InternationalizationAPI, LocalNotificationBanner, + UIHandlerId, useLocalNotificationHandler, useTranslationContext, } from "@gnu-taler/web-util/browser"; @@ -31,7 +32,6 @@ import { } from "../hooks/form.js"; import { useOfficer } from "../hooks/officer.js"; import { usePreferences } from "../hooks/preferences.js"; -import { UIHandlerId } from "../context/ui-forms.js"; type FormType = { password: string; diff --git a/packages/aml-backoffice-ui/src/pages/ShowConsolidated.tsx b/packages/aml-backoffice-ui/src/pages/ShowConsolidated.tsx index 0978d8bcc..3c0301e9f 100644 --- a/packages/aml-backoffice-ui/src/pages/ShowConsolidated.tsx +++ b/packages/aml-backoffice-ui/src/pages/ShowConsolidated.tsx @@ -23,6 +23,8 @@ import { DefaultForm, FlexibleForm, UIFormField, + UIFormFieldConfig, + UIHandlerId, useTranslationContext, } from "@gnu-taler/web-util/browser"; import { format } from "date-fns"; @@ -40,22 +42,8 @@ export function ShowConsolidated({ const cons = getConsolidated(history, until); - const form: FlexibleForm<Consolidated> = { - behavior: (form) => { - return { - aml: { - threshold: { - hidden: !form.aml, - }, - since: { - hidden: !form.aml, - }, - state: { - hidden: !form.aml, - }, - }, - }; - }, + const form: FlexibleForm = { + type: "double-column", design: [ { title: i18n.str`AML`, @@ -63,6 +51,8 @@ export function ShowConsolidated({ { type: "amount", properties: { + id: ".aml.threshold" as UIHandlerId, + currency: "NETZBON", label: i18n.str`Threshold`, name: "aml.threshold", }, @@ -72,7 +62,7 @@ export function ShowConsolidated({ properties: { label: i18n.str`State`, name: "aml.state", - + id: ".aml.state" as UIHandlerId, choices: [ { label: i18n.str`Frozen`, @@ -95,10 +85,11 @@ export function ShowConsolidated({ ? { title: i18n.str`KYC`, fields: Object.entries(cons.kyc).map(([key, field]) => { - const result: UIFormField = { + const result: UIFormFieldConfig = { type: "text", properties: { label: key as TranslatedString, + id: `kyc.${key}.value` as UIHandlerId, name: `kyc.${key}.value`, help: `${field.provider} since ${ field.since.t_ms === "never" @@ -110,7 +101,7 @@ export function ShowConsolidated({ return result; }), } - : undefined, + : undefined!, ], }; return ( @@ -123,7 +114,7 @@ export function ShowConsolidated({ </h1> <DefaultForm key={`${String(Date.now())}`} - form={form} + form={form as any} initial={cons} readOnly onUpdate={() => {}} diff --git a/packages/aml-backoffice-ui/src/pages/UnlockAccount.tsx b/packages/aml-backoffice-ui/src/pages/UnlockAccount.tsx index b81e66468..084e639bf 100644 --- a/packages/aml-backoffice-ui/src/pages/UnlockAccount.tsx +++ b/packages/aml-backoffice-ui/src/pages/UnlockAccount.tsx @@ -17,6 +17,7 @@ import { Button, InputLine, LocalNotificationBanner, + UIHandlerId, useLocalNotificationHandler, useTranslationContext } from "@gnu-taler/web-util/browser"; @@ -24,7 +25,6 @@ import { VNode, h } from "preact"; import { FormErrors, useFormState } from "../hooks/form.js"; import { useOfficer } from "../hooks/officer.js"; import { undefinedIfEmpty } from "./CreateAccount.js"; -import { UIHandlerId } from "../context/ui-forms.js"; type FormType = { password: string; |