From 46f19c120d9f0bacff4312e27f19288c611ff3dc Mon Sep 17 00:00:00 2001 From: Thomas Camlong Date: Fri, 29 May 2026 12:06:46 +0200 Subject: [PATCH] fix(widgets): refresh app data after embedded app edit Invalidate app queries on update so board widgets reflect changes. Sync AppForm with refetched initialValues and reset after submit. --- .../forms-collection/src/new-app/_form.tsx | 33 +++++++++++++++---- .../src/modals/embedded-app-edit-form.tsx | 4 ++- 2 files changed, 29 insertions(+), 8 deletions(-) diff --git a/packages/forms-collection/src/new-app/_form.tsx b/packages/forms-collection/src/new-app/_form.tsx index c812831c3..2bce21034 100644 --- a/packages/forms-collection/src/new-app/_form.tsx +++ b/packages/forms-collection/src/new-app/_form.tsx @@ -17,6 +17,14 @@ import { findBestIconMatch } from "./icon-matcher"; type FormType = z.infer; +const toFormValues = (values: FormType | undefined): FormType => ({ + name: values?.name ?? "", + description: values?.description ?? "", + iconUrl: values?.iconUrl ?? "", + href: values?.href ?? "", + pingUrl: values?.pingUrl ?? "", +}); + export interface AppFormHandle { submit: () => Promise; isDirty: () => boolean; @@ -47,15 +55,25 @@ export const AppForm = ({ const t = useI18n(); const form = useZodForm(appManageSchema, { - initialValues: { - name: initialValues?.name ?? "", - description: initialValues?.description ?? "", - iconUrl: initialValues?.iconUrl ?? "", - href: initialValues?.href ?? "", - pingUrl: initialValues?.pingUrl ?? "", - }, + initialValues: toFormValues(initialValues), }); + const initialValuesKey = [ + initialValues?.name, + initialValues?.description, + initialValues?.iconUrl, + initialValues?.href, + initialValues?.pingUrl, + ].join("\0"); + + useEffect(() => { + if (!initialValues || form.isDirty()) { + return; + } + + form.initialize(toFormValues(initialValues)); + }, [initialValuesKey, form, initialValues]); + // Debounce the name value with 200ms delay const [debouncedName] = useDebouncedValue(form.values.name, 200); @@ -80,6 +98,7 @@ export const AppForm = ({ async (values) => { try { await Promise.resolve(handleSubmit(values)); + form.initialize(values); resolve(true); } catch { resolve(false); diff --git a/packages/widgets/src/modals/embedded-app-edit-form.tsx b/packages/widgets/src/modals/embedded-app-edit-form.tsx index fe6129e1d..81b336869 100644 --- a/packages/widgets/src/modals/embedded-app-edit-form.tsx +++ b/packages/widgets/src/modals/embedded-app-edit-form.tsx @@ -21,11 +21,13 @@ interface EmbeddedAppEditFormProps { export const EmbeddedAppEditForm = ({ appId, handleRef }: EmbeddedAppEditFormProps) => { const t = useI18n(); + const utils = clientApi.useUtils(); const appFormRef = useRef(null); const { data: app, isPending: isLoadingApp, isError, refetch } = clientApi.app.byId.useQuery({ id: appId }); const { mutateAsync, isPending: isMutating } = clientApi.app.update.useMutation({ - onSuccess: () => { + onSuccess: async () => { + await utils.app.invalidate(); showSuccessNotification({ title: t("app.page.edit.notification.success.title"), message: t("app.page.edit.notification.success.message"),