From e653fc6f58c26dbb4a10b5b89a24865dd814fe68 Mon Sep 17 00:00:00 2001 From: Sebastian Date: Mon, 24 Jan 2022 17:32:46 -0300 Subject: fix #7086 --- .../src/pages/home/AttributeEntryScreen.stories.tsx | 17 +++++++++++++++++ .../src/pages/home/AttributeEntryScreen.tsx | 17 ++++++++++++++++- 2 files changed, 33 insertions(+), 1 deletion(-) (limited to 'packages/anastasis-webui/src') diff --git a/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.stories.tsx b/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.stories.tsx index a2ecbd604..85dd836a6 100644 --- a/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.stories.tsx +++ b/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.stories.tsx @@ -133,3 +133,20 @@ export const WithAllPosibleWidget = createExample(TestedComponent, { widget: w, })), } as ReducerState); + +export const WithAutocompleteFeature = createExample(TestedComponent, { + ...reducerStatesExample.backupAttributeEditing, + required_attributes: [ + { + name: "ahv_number", + label: "AHV Number", + type: "string", + uuid: "asdasdsa1", + widget: "wid", + "validation-regex": + "^(756)\\.[0-9]{4}\\.[0-9]{4}\\.[0-9]{2}|(756)[0-9]{10}$", + "validation-logic": "CH_AHV_check", + autocomplete: "???.????.????.??", + }, + ], +} as ReducerState); diff --git a/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx b/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx index 9c1a93d8e..a1f384743 100644 --- a/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx +++ b/packages/anastasis-webui/src/pages/home/AttributeEntryScreen.tsx @@ -37,12 +37,27 @@ export function AttributeEntryScreen(): VNode { const fieldList: VNode[] = reqAttr.map((spec, i: number) => { const value = attrs[spec.name]; const error = checkIfValid(value, spec); + + function addAutocomplete(newValue: string): string { + const ac = spec.autocomplete; + if (!ac || ac.length < newValue.length || ac[newValue.length] === "?") + return newValue; + + if (!value || newValue.length < value.length) { + return newValue.slice(0, -1); + } + + return newValue + ac[newValue.length]; + } + hasErrors = hasErrors || error !== undefined; return ( setAttrs({ ...attrs, [spec.name]: v })} + setValue={(v: string) => + setAttrs({ ...attrs, [spec.name]: addAutocomplete(v) }) + } spec={spec} errorMessage={error} onConfirm={() => { -- cgit v1.2.3