diff --git a/apps/web/components/eventtype/Locations.tsx b/apps/web/components/eventtype/Locations.tsx index eebf5302e0..0225cc3fa0 100644 --- a/apps/web/components/eventtype/Locations.tsx +++ b/apps/web/components/eventtype/Locations.tsx @@ -268,23 +268,6 @@ const Locations: React.FC = ({ }); showToast(t("location_already_exists"), "warning"); } - // Whenever location changes, we need to reset the locations item in booking questions list else it overflows - // previously added values resulting in wrong behaviour - const existingBookingFields = getValues("bookingFields"); - const findLocation = existingBookingFields.findIndex( - (field) => field.name === "location" - ); - if (findLocation >= 0) { - existingBookingFields[findLocation] = { - ...existingBookingFields[findLocation], - type: "radioInput", - label: "", - placeholder: "", - }; - setValue("bookingFields", existingBookingFields, { - shouldDirty: true, - }); - } } }} /> diff --git a/packages/features/form-builder/Components.tsx b/packages/features/form-builder/Components.tsx index 021f54325f..b2b430bb4a 100644 --- a/packages/features/form-builder/Components.tsx +++ b/packages/features/form-builder/Components.tsx @@ -71,6 +71,7 @@ type Component = } & { name?: string; required?: boolean; + translatedDefaultLabel?: string; } >( props: TProps @@ -386,7 +387,16 @@ export const Components: Record = { }, radioInput: { propsType: propsTypes.radioInput, - factory: function RadioInputWithLabel({ name, options, optionsInputs, value, setValue, readOnly }) { + factory: function RadioInputWithLabel({ + name, + label, + options, + optionsInputs, + value, + setValue, + readOnly, + translatedDefaultLabel, + }) { useEffect(() => { if (!value) { setValue({ @@ -398,17 +408,24 @@ export const Components: Record = { const { t } = useLocale(); - const getCleanLabel = (option: { label: string; value: string }): string | JSX.Element => { - if (!option.label) { + const didUserProvideLabel = ( + label: string | undefined, + translatedDefaultLabel: string | undefined + ): label is string => { + return label && translatedDefaultLabel ? translatedDefaultLabel !== label : false; + }; + + const getCleanLabel = (label: string): string | JSX.Element => { + if (!label) { return ""; } - return option.label.search(/^https?:\/\//) !== -1 ? ( - - {option.label} + return label.search(/^https?:\/\//) !== -1 ? ( + + {label} ) : ( - option.label + label ); }; @@ -434,7 +451,9 @@ export const Components: Record = { }} checked={value?.value === option.value} /> - {getCleanLabel(option) ?? ""} + + {getCleanLabel(option.label) ?? ""} + {option.value === "phone" && ( @@ -444,10 +463,13 @@ export const Components: Record = { ); }) ) : ( - // Show option itself as label because there is just one option + // Use the only option itself to determine if the field is required or not. <>