From 532c2f57a19a4c5d1d36671e7de24e7811942391 Mon Sep 17 00:00:00 2001 From: Anik Dhabal Babu <81948346+anikdhabal@users.noreply.github.com> Date: Mon, 25 Aug 2025 17:36:33 +0530 Subject: [PATCH] fix: show correct input type for location (#23228) --- .../features/form-builder/FormBuilder.tsx | 34 +++++++++++++------ 1 file changed, 23 insertions(+), 11 deletions(-) diff --git a/packages/features/form-builder/FormBuilder.tsx b/packages/features/form-builder/FormBuilder.tsx index 447c7c43cd..3677f3d97a 100644 --- a/packages/features/form-builder/FormBuilder.tsx +++ b/packages/features/form-builder/FormBuilder.tsx @@ -42,10 +42,30 @@ type RhfFormFields = RhfForm["fields"]; type RhfFormField = RhfFormFields[number]; +type DataStore = { + options: Record< + string, + { + source: { label: string }; + value: { label: string; value: string; inputPlaceholder?: string }[]; + } + >; +}; + function getCurrentFieldType(fieldForm: UseFormReturn) { return fieldTypesConfigMap[fieldForm.watch("type") || "text"]; } +const getLocationFieldType = (field: RhfFormField) => { + const baseFieldType = fieldTypesConfigMap[field.type]; + + if (field.name === "location") { + return { ...baseFieldType, label: "Location" }; + } + + return baseFieldType; +}; + /** * It works with a react-hook-form only. * `formProp` specifies the name of the property in the react-hook-form that has the fields. This is where fields would be updated. @@ -71,15 +91,7 @@ export const FormBuilder = function FormBuilder({ /** * A readonly dataStore that is used to lookup the options for the fields. It works in conjunction with the field.getOptionAt property which acts as the key in options */ - dataStore: { - options: Record< - string, - { - source: { label: string }; - value: { label: string; value: string; inputPlaceholder?: string }[]; - } - >; - }; + dataStore: DataStore; /** * This is kind of a hack to allow certain fields to be just shown as required when they might not be required in a strict sense * e.g. Location field has a default value at backend so API can send no location but formBuilder in UI doesn't allow it. @@ -226,7 +238,7 @@ export const FormBuilder = function FormBuilder({ return null; } - const fieldType = fieldTypesConfigMap[field.type]; + const fieldType = getLocationFieldType(field); const isFieldEditableSystemButOptional = field.editable === "system-but-optional"; const isFieldEditableSystemButHidden = field.editable === "system-but-hidden"; const isFieldEditableSystem = field.editable === "system"; @@ -565,7 +577,7 @@ function FieldEditDialog({ } fieldForm.setValue("type", value, { shouldDirty: true }); }} - value={fieldTypesConfigMap[formFieldType]} + value={dialog.data ? getLocationFieldType(dialog.data) : fieldTypesConfigMap[formFieldType]} options={fieldTypes.filter((f) => !f.systemOnly)} label={t("input_type")} />