diff options
author | Sebastian <sebasjm@gmail.com> | 2024-05-13 14:47:32 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2024-05-13 14:47:32 -0300 |
commit | d06accc782a4f2a8f3d84706f026e27fa51bc39a (patch) | |
tree | b0b25a843881e3b249df94346620927be54dfbad /packages/web-util/src/forms | |
parent | e9ba04deb3330208583f371e0bcac869e32e36bc (diff) | |
download | wallet-core-d06accc782a4f2a8f3d84706f026e27fa51bc39a.tar.xz |
fix some inputs
Diffstat (limited to 'packages/web-util/src/forms')
-rw-r--r-- | packages/web-util/src/forms/InputArray.tsx | 28 | ||||
-rw-r--r-- | packages/web-util/src/forms/InputChoiceHorizontal.tsx | 5 | ||||
-rw-r--r-- | packages/web-util/src/forms/converter.ts | 21 | ||||
-rw-r--r-- | packages/web-util/src/forms/forms.ts | 2 |
4 files changed, 45 insertions, 11 deletions
diff --git a/packages/web-util/src/forms/InputArray.tsx b/packages/web-util/src/forms/InputArray.tsx index 1ac96437c..d90028508 100644 --- a/packages/web-util/src/forms/InputArray.tsx +++ b/packages/web-util/src/forms/InputArray.tsx @@ -99,7 +99,7 @@ export function InputArray<T extends object, K extends keyof T>( const [selectedIndex, setSelected] = useState<number | undefined>(undefined); const selected = selectedIndex === undefined ? undefined : list[selectedIndex]; - + return ( <div class="sm:col-span-6"> <LabelWithTooltipMaybeRequired @@ -110,9 +110,10 @@ export function InputArray<T extends object, K extends keyof T>( <div class="-space-y-px rounded-md bg-white "> {list.map((v, idx) => { + const label = getValueDeeper(v, labelField.split(".")) return ( <Option - label={v[labelField] as TranslatedString} + label={label as TranslatedString} key={idx} isSelected={selectedIndex === idx} isLast={idx === list.length - 1} @@ -158,7 +159,7 @@ export function InputArray<T extends object, K extends keyof T>( // elements should be present in the state object since this is expected to be an array //@ts-ignore // return state.elements[selectedIndex]; - return {} + return {}; }} onSubmit={(v) => { const newValue = [...list]; @@ -202,3 +203,24 @@ export function InputArray<T extends object, K extends keyof T>( </div> ); } + + + +export function getValueDeeper( + object: Record<string, any>, + names: string[], +): string { + if (names.length === 0) { + return object as any as string; + } + const [head, ...rest] = names; + if (!head) { + return getValueDeeper(object, rest); + } + if (object === undefined) { + return "" + } + return getValueDeeper(object[head], rest); +} + + diff --git a/packages/web-util/src/forms/InputChoiceHorizontal.tsx b/packages/web-util/src/forms/InputChoiceHorizontal.tsx index d8361718d..86d3aa926 100644 --- a/packages/web-util/src/forms/InputChoiceHorizontal.tsx +++ b/packages/web-util/src/forms/InputChoiceHorizontal.tsx @@ -34,11 +34,12 @@ export function InputChoiceHorizontal<T extends object, K extends keyof T>( <fieldset class="mt-2"> <div class="isolate inline-flex rounded-md shadow-sm"> {choices.map((choice, idx) => { + const convertedValue = converter?.fromStringUI(choice.value as any) const isFirst = idx === 0; const isLast = idx === choices.length - 1; let clazz = "relative inline-flex items-center px-3 py-2 text-sm font-semibold text-gray-900 ring-1 ring-inset ring-gray-300 focus:z-10"; - if (converter?.fromStringUI(choice.value as any) === value) { + if (convertedValue !== undefined && convertedValue === value) { clazz += " text-white bg-indigo-600 hover:bg-indigo-500 ring-2 ring-indigo-600 hover:ring-indigo-500"; } else { @@ -61,7 +62,7 @@ export function InputChoiceHorizontal<T extends object, K extends keyof T>( class={clazz} onClick={(e) => { onChange( - (value === choice.value ? undefined : converter?.fromStringUI(choice.value as any)) as any, + (value === choice.value ? undefined : convertedValue) as any, ); }} > diff --git a/packages/web-util/src/forms/converter.ts b/packages/web-util/src/forms/converter.ts index 3a522bf7e..eee891776 100644 --- a/packages/web-util/src/forms/converter.ts +++ b/packages/web-util/src/forms/converter.ts @@ -53,6 +53,15 @@ function parseAmlState(s: string | undefined): TalerExchangeApi.AmlState { } } +const nullConverter: StringConverter<string> = { + fromStringUI(v: string | undefined): string { + return v ?? ""; + }, + toStringUI(v: unknown): string { + return v as string; + }, +}; + function amountConverter(config: any): StringConverter<AmountJson> { const currency = config["currency"]; if (!currency || typeof currency !== "string") { @@ -61,7 +70,9 @@ function amountConverter(config: any): StringConverter<AmountJson> { return { fromStringUI(v: string | undefined): AmountJson { // FIXME: requires currency - return Amounts.parse(`${currency}:${v}`) ?? Amounts.zeroOfCurrency(currency); + return ( + Amounts.parse(`${currency}:${v}`) ?? Amounts.zeroOfCurrency(currency) + ); }, toStringUI(v: unknown): string { return v === undefined ? "" : Amounts.stringifyValue(v as AmountJson); @@ -82,7 +93,7 @@ function absTimeConverter(config: any): StringConverter<AbsoluteTime> { try { const time = parse(v, pattern, new Date()); return AbsoluteTime.fromMilliseconds(time.getTime()); - } catch(e) { + } catch (e) { return AbsoluteTime.never(); } }, @@ -91,9 +102,9 @@ function absTimeConverter(config: any): StringConverter<AbsoluteTime> { const d = v as AbsoluteTime; if (d.t_ms === "never") return "never"; try { - return format(d.t_ms, pattern) + return format(d.t_ms, pattern); } catch (e) { - return "" + return ""; } }, }; @@ -115,5 +126,5 @@ export function getConverterById( // @ts-expect-error check this return amlStateConverter; } - return undefined!; + return nullConverter as StringConverter<unknown>; } diff --git a/packages/web-util/src/forms/forms.ts b/packages/web-util/src/forms/forms.ts index cb2ee0145..4c5050830 100644 --- a/packages/web-util/src/forms/forms.ts +++ b/packages/web-util/src/forms/forms.ts @@ -354,7 +354,7 @@ function converBaseFieldsProps( }; } -function getValueDeeper2( +export function getValueDeeper2( object: Record<string, any>, names: string[], ): UIFieldHandler { |