diff options
Diffstat (limited to 'packages/kyc-ui/src')
| -rw-r--r-- | packages/kyc-ui/src/app.tsx | 8 | ||||
| -rw-r--r-- | packages/kyc-ui/src/context/ui-forms.ts | 76 | ||||
| -rw-r--r-- | packages/kyc-ui/src/forms.json | 215 | ||||
| -rw-r--r-- | packages/kyc-ui/src/pages/FillForm.tsx | 12 |
4 files changed, 308 insertions, 3 deletions
diff --git a/packages/kyc-ui/src/app.tsx b/packages/kyc-ui/src/app.tsx index e74249f73..27539ac44 100644 --- a/packages/kyc-ui/src/app.tsx +++ b/packages/kyc-ui/src/app.tsx @@ -28,6 +28,7 @@ import { Loading, TalerWalletIntegrationBrowserProvider, TranslationProvider, + UiForms, } from "@gnu-taler/web-util/browser"; import { VNode, h } from "preact"; import { useEffect, useState } from "preact/hooks"; @@ -38,15 +39,18 @@ import { strings } from "./i18n/strings.js"; import { Frame } from "./pages/Frame.js"; import { KycUiSettings, fetchSettings } from "./settings.js"; import { revalidateKycInfo } from "./hooks/kyc.js"; +import { fetchUiForms, UiFormsProvider } from "./context/ui-forms.js"; const WITH_LOCAL_STORAGE_CACHE = false; export function App(): VNode { const [settings, setSettings] = useState<KycUiSettings>(); + const [forms, setForms] = useState<UiForms>(); useEffect(() => { fetchSettings(setSettings); + fetchUiForms(setForms); }, []); - if (!settings) return <Loading />; + if (!settings || !forms) return <Loading />; const baseUrl = getInitialBackendBaseURL(settings.backendBaseURL); return ( @@ -95,7 +99,9 @@ export function App(): VNode { > <TalerWalletIntegrationBrowserProvider> <BrowserHashNavigationProvider> + <UiFormsProvider value={forms}> <Routing /> + </UiFormsProvider> </BrowserHashNavigationProvider> </TalerWalletIntegrationBrowserProvider> </SWRConfig> diff --git a/packages/kyc-ui/src/context/ui-forms.ts b/packages/kyc-ui/src/context/ui-forms.ts new file mode 100644 index 000000000..3a25234d2 --- /dev/null +++ b/packages/kyc-ui/src/context/ui-forms.ts @@ -0,0 +1,76 @@ +/* + This file is part of GNU Taler + (C) 2022-2024 Taler Systems S.A. + + GNU Taler is free software; you can redistribute it and/or modify it under the + terms of the GNU General Public License as published by the Free Software + Foundation; either version 3, or (at your option) any later version. + + GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY + WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR + A PARTICULAR PURPOSE. See the GNU General Public License for more details. + + You should have received a copy of the GNU General Public License along with + GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/> + */ + +import { codecForUIForms, UiForms } from "@gnu-taler/web-util/browser"; +import { ComponentChildren, createContext, h, VNode } from "preact"; +import { useContext } from "preact/hooks"; + +/** + * + * @author Sebastian Javier Marchano (sebasjm) + */ + +export type Type = UiForms; + +const defaultForms: UiForms = { + forms: [], +}; +const Context = createContext<Type>(defaultForms); + +export type BaseForm = Record<string, unknown>; + +export const useUiFormsContext = (): Type => useContext(Context); + +export const UiFormsProvider = ({ + children, + value, +}: { + value: UiForms; + children: ComponentChildren; +}): VNode => { + return h(Context.Provider, { + value, + children, + }); +}; + + + +function removeUndefineField<T extends object>(obj: T): T { + const keys = Object.keys(obj) as Array<keyof T>; + return keys.reduce((prev, cur) => { + if (typeof prev[cur] === "undefined") { + delete prev[cur]; + } + return prev; + }, obj); +} + +export function fetchUiForms(listener: (s: UiForms) => void): void { + fetch("./forms.json") + .then((resp) => resp.json()) + .then((json) => codecForUIForms().decode(json)) + .then((result) => + listener({ + ...defaultForms, + ...removeUndefineField(result), + }), + ) + .catch((e) => { + console.log("failed to fetch forms", e); + listener(defaultForms); + }); +} diff --git a/packages/kyc-ui/src/forms.json b/packages/kyc-ui/src/forms.json new file mode 100644 index 000000000..b0c198574 --- /dev/null +++ b/packages/kyc-ui/src/forms.json @@ -0,0 +1,215 @@ +{ + "forms": [ + { + "label": "VQF starting form", + "id": "vqf-type", + "version": 1, + "config": { + "type": "double-column", + "design": [ + { + "title": "Information on the beneficial owner of the assets and/or controlling person", + "description": "Establishment of the beneficial owner of the assets and/or controlling person", + "fields": [ + { + "type": "choiceStacked", + "id": "LEGAL_ENTITY_TYPE", + "label": "The customer is", + "required": true, + "choices": [ + { + "label": "a natural person and there are no doubts that this person is the sole beneficial owner of the assets", + "value": "natural" + }, + { + "label": "a foundation (or a similar construct; incl. underlying companies)", + "value": "foundation" + }, + { + "label": "an operation legal entity or partnership", + "value": "legal-entity" + }, + { + "label": "a trust (incl. underlying companies)", + "value": "trust" + }, + { + "label": "a life insurance policy with separately managed accounts/securities accounts", + "value": "insurance" + }, + { + "label": "all other cases", + "value": "other" + } + ] + } + ] + } + ] + } + }, + { + "label": "VQF natural person form", + "id": "vqf-natural", + "version": 1, + "config": { + "type": "double-column", + "design": [ + { + "title": "Natural person form", + "fields": [ + { + "type": "choiceStacked", + "id": "LEGAL_ENTITY_TYPE", + "label": "The customer is", + "required": true, + "choices": [ + { + "label": "natural", + "value": "natural" + } + ] + } + ] + } + ] + } + }, + { + "label": "VQF legal entity form", + "id": "vqf-legal-entity", + "version": 1, + "config": { + "type": "double-column", + "design": [ + { + "title": "Legal entity form", + "fields": [ + { + "type": "choiceStacked", + "id": "LEGAL_ENTITY_TYPE", + "label": "The customer is", + "required": true, + "choices": [ + { + "label": "legal entity", + "value": "natural" + } + ] + } + ] + } + ] + } + }, + { + "label": "VQF foundation form", + "id": "vqf-foundation", + "version": 1, + "config": { + "type": "double-column", + "design": [ + { + "title": "foundation form", + "fields": [ + { + "type": "choiceStacked", + "id": "LEGAL_ENTITY_TYPE", + "label": "The customer is", + "required": true, + "choices": [ + { + "label": "foundation", + "value": "natural" + } + ] + } + ] + } + ] + } + }, + { + "label": "VQF trust form", + "id": "vqf-trust", + "version": 1, + "config": { + "type": "double-column", + "design": [ + { + "title": "Natural trust form", + "fields": [ + { + "type": "choiceStacked", + "id": "LEGAL_ENTITY_TYPE", + "label": "The customer is", + "required": true, + "choices": [ + { + "label": "trust", + "value": "natural" + } + ] + } + ] + } + ] + } + }, + { + "label": "VQF insurance form", + "id": "vqf-insurance", + "version": 1, + "config": { + "type": "double-column", + "design": [ + { + "title": "insurance form", + "fields": [ + { + "type": "choiceStacked", + "id": "LEGAL_ENTITY_TYPE", + "label": "The customer is", + "required": true, + "choices": [ + { + "label": "insurance", + "value": "natural" + } + ] + } + ] + } + ] + } + }, + { + "label": "VQF other form", + "id": "vqf-other", + "version": 1, + "config": { + "type": "double-column", + "design": [ + { + "title": "other form", + "fields": [ + { + "type": "choiceStacked", + "id": "LEGAL_ENTITY_TYPE", + "label": "The customer is", + "required": true, + "choices": [ + { + "label": "other", + "value": "natural" + } + ] + } + ] + } + ] + } + } + ], + "not_yet_supported": [] +} diff --git a/packages/kyc-ui/src/pages/FillForm.tsx b/packages/kyc-ui/src/pages/FillForm.tsx index 0b691dc11..52b893e40 100644 --- a/packages/kyc-ui/src/pages/FillForm.tsx +++ b/packages/kyc-ui/src/pages/FillForm.tsx @@ -43,6 +43,7 @@ import { validateRequiredFields, } from "../hooks/form.js"; import { undefinedIfEmpty } from "./Start.js"; +import { useUiFormsContext } from "../context/ui-forms.js"; type Props = { token: AccessToken; @@ -80,14 +81,21 @@ export function FillForm({ const customForm = requirement.context && "form" in requirement.context ? ({ - id: "by-context", + id: (requirement.context.form as any).id, config: requirement.context.form, label: "Officer defined form", version: 1, } as FormMetadata) : undefined; - const theForm = searchForm(i18n, customForm ? [customForm] : [], formId, requirement.context); + const { forms } = useUiFormsContext(); + const allForms = customForm ? [...forms, customForm] : forms + const theForm = searchForm( + i18n, + allForms, + formId, + requirement.context, + ); if (!theForm) { return <div>form with id {formId} not found</div>; } |