diff --git a/frontend/src/lib/components/apps/components/buttons/AppForm.svelte b/frontend/src/lib/components/apps/components/buttons/AppForm.svelte index b7ae3b4709..b9c8e6fba9 100644 --- a/frontend/src/lib/components/apps/components/buttons/AppForm.svelte +++ b/frontend/src/lib/components/apps/components/buttons/AppForm.svelte @@ -111,6 +111,10 @@ {id} doOnSuccess={resolvedConfig.onSuccess} doOnError={resolvedConfig.onError} + clearFormInputs={{ + selected: resolvedConfig.clearFormInputs.selected, + onClear: () => runnableComponent?.setArgs({}) + }} {errorHandledByComponent} {extraQueryParams} autoRefresh={false} diff --git a/frontend/src/lib/components/apps/components/buttons/AppFormButton.svelte b/frontend/src/lib/components/apps/components/buttons/AppFormButton.svelte index 0717a8e3a6..7df3a76da4 100644 --- a/frontend/src/lib/components/apps/components/buttons/AppFormButton.svelte +++ b/frontend/src/lib/components/apps/components/buttons/AppFormButton.svelte @@ -123,6 +123,10 @@ {outputs} doOnSuccess={resolvedConfig.onSuccess} doOnError={resolvedConfig.onError} + clearFormInputs={{ + selected: resolvedConfig.clearFormInputs.selected, + onClear: () => runnableComponent?.setArgs({}) + }} {errorHandledByComponent} > {#if noInputs} diff --git a/frontend/src/lib/components/apps/components/helpers/RunnableWrapper.svelte b/frontend/src/lib/components/apps/components/helpers/RunnableWrapper.svelte index 9553655799..0f4de82042 100644 --- a/frontend/src/lib/components/apps/components/helpers/RunnableWrapper.svelte +++ b/frontend/src/lib/components/apps/components/helpers/RunnableWrapper.svelte @@ -78,6 +78,10 @@ doOnSuccess?: SideEffectAction doOnSubmit?: SideEffectAction doOnError?: SideEffectAction + clearFormInputs?: { + selected: 'never' | 'onSuccess' | 'onSubmit' | 'onError' + onClear: () => void + } render: boolean recomputeIds?: string[] outputs: { @@ -115,6 +119,7 @@ doOnSuccess = undefined, doOnSubmit = undefined, doOnError = undefined, + clearFormInputs, render, recomputeIds = [], outputs, @@ -194,6 +199,10 @@ } async function handleSubmitSideEffect() { + if (clearFormInputs) { + if (clearFormInputs.selected === 'onSubmit') clearFormInputs.onClear() + } + if (!doOnSubmit) return if (doOnSubmit.selected == 'none') return @@ -202,6 +211,10 @@ } export async function handleSideEffect(success: boolean, errorMessage?: string) { + if (clearFormInputs) { + if (!success && clearFormInputs.selected === 'onError') clearFormInputs.onClear() + if (success && clearFormInputs.selected === 'onSuccess') clearFormInputs.onClear() + } const sideEffect = success ? doOnSuccess : doOnError if (recomputeIds && success) { @@ -214,7 +227,11 @@ await executeSideEffect(sideEffect, success, errorMessage) } - async function executeSideEffect(sideEffect: SideEffectAction, success: boolean = true, errorMessage?: string) { + async function executeSideEffect( + sideEffect: SideEffectAction, + success: boolean = true, + errorMessage?: string + ) { if (!sideEffect) return switch (sideEffect.selected) { diff --git a/frontend/src/lib/components/apps/editor/component/components.ts b/frontend/src/lib/components/apps/editor/component/components.ts index 5a159072b8..0d11e5286d 100644 --- a/frontend/src/lib/components/apps/editor/component/components.ts +++ b/frontend/src/lib/components/apps/editor/component/components.ts @@ -820,6 +820,24 @@ const onErrorClick = { } } as const +const clearFormInputs = { + type: 'oneOf', + tooltip: 'When to clear the form inputs', + selected: 'never', + labels: { + never: 'Never', + onSuccess: 'On success', + onSubmit: 'On submit', + onError: 'On error' + }, + configuration: { + never: {}, + onSuccess: {}, + onSubmit: {}, + onError: {} + } +} as const + const paginationOneOf = { type: 'oneOf', selected: 'auto', @@ -1728,7 +1746,8 @@ export const components = { }, onSuccess: onSuccessClick, onSubmit: onSubmitClick, - onError: onErrorClick + onError: onErrorClick, + clearFormInputs } } }, @@ -1779,6 +1798,7 @@ export const components = { onSuccess: onSuccessClick, onSubmit: onSubmitClick, onError: onErrorClick, + clearFormInputs, disabled: { fieldType: 'boolean', type: 'static',