diff --git a/app/(gcforms)/[locale]/(form administration)/form-builder/[id]/edit/components/elements/sub-elements/SubElementModal.tsx b/app/(gcforms)/[locale]/(form administration)/form-builder/[id]/edit/components/elements/sub-elements/SubElementModal.tsx index f2b3ac2ac4..debcbd42cd 100644 --- a/app/(gcforms)/[locale]/(form administration)/form-builder/[id]/edit/components/elements/sub-elements/SubElementModal.tsx +++ b/app/(gcforms)/[locale]/(form administration)/form-builder/[id]/edit/components/elements/sub-elements/SubElementModal.tsx @@ -24,10 +24,15 @@ export const SubElementModal = ({ const { t } = useTranslation("form-builder"); const { modals, updateModalProperties, unsetModalField } = useModalStore(); - const { updateField } = useTemplateStore((s) => ({ + const { updateField, setChangeKey } = useTemplateStore((s) => ({ updateField: s.updateField, + setChangeKey: s.setChangeKey, })); + const forceRefresh = () => { + setChangeKey(String(new Date().getTime())); //Force a re-render + }; + useEffect(() => { if (item.type != "richText") { updateModalProperties(item.index, item.properties); @@ -45,11 +50,14 @@ export const SubElementModal = ({ }) => { return (e: React.MouseEvent) => { e.preventDefault(); + // replace all of "properties" with the new properties set in the ModalForm updateField( `form.elements[${elIndex}].properties.subElements[${subIndex}].properties`, properties ); + + forceRefresh(); }; };