diff options
Diffstat (limited to 'packages/bank-ui/src/hooks/form.ts')
-rw-r--r-- | packages/bank-ui/src/hooks/form.ts | 125 |
1 files changed, 70 insertions, 55 deletions
diff --git a/packages/bank-ui/src/hooks/form.ts b/packages/bank-ui/src/hooks/form.ts index 26354b108..afa4912eb 100644 --- a/packages/bank-ui/src/hooks/form.ts +++ b/packages/bank-ui/src/hooks/form.ts @@ -14,87 +14,102 @@ GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/> */ -import { AmountJson, TalerBankConversionApi, TranslatedString } from "@gnu-taler/taler-util"; +import { AmountJson, TranslatedString } from "@gnu-taler/taler-util"; import { useState } from "preact/hooks"; export type UIField = { value: string | undefined; onUpdate: (s: string) => void; error: TranslatedString | undefined; -} +}; type FormHandler<T> = { - [k in keyof T]?: - T[k] extends string ? UIField : - T[k] extends AmountJson ? UIField : - FormHandler<T[k]>; -} + [k in keyof T]?: T[k] extends string + ? UIField + : T[k] extends AmountJson + ? UIField + : FormHandler<T[k]>; +}; export type FormValues<T> = { - [k in keyof T]: - T[k] extends string ? (string | undefined) : - T[k] extends AmountJson ? (string | undefined) : - FormValues<T[k]>; -} + [k in keyof T]: T[k] extends string + ? string | undefined + : T[k] extends AmountJson + ? string | undefined + : FormValues<T[k]>; +}; export type RecursivePartial<T> = { - [k in keyof T]?: - T[k] extends string ? (string) : - T[k] extends AmountJson ? (AmountJson) : - RecursivePartial<T[k]>; -} + [k in keyof T]?: T[k] extends string + ? string + : T[k] extends AmountJson + ? AmountJson + : RecursivePartial<T[k]>; +}; export type FormErrors<T> = { - [k in keyof T]?: - T[k] extends string ? (TranslatedString) : - T[k] extends AmountJson ? (TranslatedString) : - FormErrors<T[k]>; -} - -export type FormStatus<T> = { - status: "ok", - result: T, - errors: undefined, -} | { - status: "fail", - result: RecursivePartial<T>, - errors: FormErrors<T>, -} - - -function constructFormHandler<T>(form: FormValues<T>, updateForm: (d: FormValues<T>) => void, errors: FormErrors<T> | undefined): FormHandler<T> { - const keys = (Object.keys(form) as Array<keyof T>) + [k in keyof T]?: T[k] extends string + ? TranslatedString + : T[k] extends AmountJson + ? TranslatedString + : FormErrors<T[k]>; +}; + +export type FormStatus<T> = + | { + status: "ok"; + result: T; + errors: undefined; + } + | { + status: "fail"; + result: RecursivePartial<T>; + errors: FormErrors<T>; + }; + +function constructFormHandler<T>( + form: FormValues<T>, + updateForm: (d: FormValues<T>) => void, + errors: FormErrors<T> | undefined, +): FormHandler<T> { + const keys = Object.keys(form) as Array<keyof T>; const handler = keys.reduce((prev, fieldName) => { - const currentValue: any = form[fieldName]; - const currentError: any = errors ? errors[fieldName] : undefined; - function updater(newValue: any) { - updateForm({ ...form, [fieldName]: newValue }) + const currentValue: unknown = form[fieldName]; + const currentError: unknown = errors ? errors[fieldName] : undefined; + function updater(newValue: unknown) { + updateForm({ ...form, [fieldName]: newValue }); } if (typeof currentValue === "object") { - const group = constructFormHandler(currentValue, updater, currentError) - // @ts-expect-error asdasd - prev[fieldName] = group + // @ts-expect-error FIXME better typing + const group = constructFormHandler(currentValue, updater, currentError); + // @ts-expect-error FIXME better typing + prev[fieldName] = group; return prev; } const field: UIField = { + // @ts-expect-error FIXME better typing error: currentError, + // @ts-expect-error FIXME better typing value: currentValue, - onUpdate: updater - } - // @ts-expect-error asdasd - prev[fieldName] = field - return prev - }, {} as FormHandler<T>) + onUpdate: updater, + }; + // @ts-expect-error FIXME better typing + prev[fieldName] = field; + return prev; + }, {} as FormHandler<T>); return handler; } -export function useFormState<T>(defaultValue: FormValues<T>, check: (f: FormValues<T>) => FormStatus<T>): [FormHandler<T>, FormStatus<T>] { - const [form, updateForm] = useState<FormValues<T>>(defaultValue) +export function useFormState<T>( + defaultValue: FormValues<T>, + check: (f: FormValues<T>) => FormStatus<T>, +): [FormHandler<T>, FormStatus<T>] { + const [form, updateForm] = useState<FormValues<T>>(defaultValue); - const status = check(form) - const handler = constructFormHandler(form, updateForm, status.errors) + const status = check(form); + const handler = constructFormHandler(form, updateForm, status.errors); - return [handler, status] -}
\ No newline at end of file + return [handler, status]; +} |