From bb95e5da52a3f16fce543bf9903cf9daa078f068 Mon Sep 17 00:00:00 2001 From: Jusheng Huang <117657272+viajes7@users.noreply.github.com> Date: Tue, 22 Oct 2024 23:12:12 +0800 Subject: [PATCH] [Index Management] Fix Flashing error banner in Index Template form (#196786) ## Summary Fixes #194751 In `EuiForm`, if the value of `isInvalid` is true, it will render addressFormErrors tip messages. And In `step_logistics.tsx`, `isInValid` is setted by `isInvalid={isSubmitted && !isFormValid}` But form `submit` method set `isSubmitted` to true first, then validate form. At this time, `isSubmitted is true` and `isFormValid is unedfined`. So addressFormErrors shows immediately. ![image](https://github.com/user-attachments/assets/687a359d-ed33-4860-8d96-4543f2ef4898) **So, maybe when `isSubmitting` is true, addressFormErrors should not be shown.** Co-authored-by: Elastic Machine (cherry picked from commit f629d96b85b222fbc3116e6a0a4308882d144aef) --- .../components/template_form/steps/step_logistics.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/x-pack/plugins/index_management/public/application/components/template_form/steps/step_logistics.tsx b/x-pack/plugins/index_management/public/application/components/template_form/steps/step_logistics.tsx index 84cb0fa027ad1..d73d95600e5b1 100644 --- a/x-pack/plugins/index_management/public/application/components/template_form/steps/step_logistics.tsx +++ b/x-pack/plugins/index_management/public/application/components/template_form/steps/step_logistics.tsx @@ -194,6 +194,7 @@ export const StepLogistics: React.FunctionComponent = React.memo( const { submit, isSubmitted, + isSubmitting, isValid: isFormValid, getErrors: getFormErrors, getFormData, @@ -275,7 +276,7 @@ export const StepLogistics: React.FunctionComponent = React.memo(