refactor: ConfigMapSecret -update form submission handlers and improv…

…e error handling in dry run
devtron-labs · Jan 10, 2025 · b4f7721 · b4f7721
1 parent 770557c
commit b4f7721
Show file tree

Hide file tree

Showing 5 changed files with 24 additions and 21 deletions.
diff --git a/src/Pages/Shared/ConfigMapSecret/ConfigMapSecretContainer.tsx b/src/Pages/Shared/ConfigMapSecret/ConfigMapSecretContainer.tsx
@@ -26,6 +26,8 @@ import {
     usePrompt,
     checkIfPathIsMatching,
     useUrlFilters,
+    UseFormErrorHandler,
+    UseFormSubmitHandler,
 } from '@devtron-labs/devtron-fe-common-lib'
 
 import { URLS } from '@Config/routes'
@@ -682,7 +684,7 @@ export const ConfigMapSecretContainer = ({
         }
     }
 
-    const onSubmit: ConfigMapSecretFormProps['onSubmit'] = async (data) => {
+    const onSubmit: UseFormSubmitHandler<ConfigMapSecretUseFormProps> = async (data) => {
         const payloadData = getConfigMapSecretPayload(data)
 
         if (isApprovalPolicyConfigured) {
@@ -739,7 +741,7 @@ export const ConfigMapSecretContainer = ({
         }
     }
 
-    const onError: ConfigMapSecretFormProps['onError'] = (errors) => {
+    const onError: UseFormErrorHandler<ConfigMapSecretUseFormProps> = (errors) => {
         if (errors.currentData?.[0] === CONFIG_MAP_SECRET_NO_DATA_ERROR) {
             ToastManager.showToast({
                 variant: ToastVariantType.error,
@@ -755,6 +757,19 @@ export const ConfigMapSecretContainer = ({
         }
     }
 
+    const onDryRunError: UseFormErrorHandler<ConfigMapSecretUseFormProps> = (errors) => {
+        const hasErrors = Object.keys(errors).some((key) => !!errors[key])
+        if (hasErrors) {
+            ToastManager.showToast({
+                variant: ToastVariantType.error,
+                description: 'Please resolve form errors before saving.',
+            })
+        }
+    }
+
+    const formSubmitHandler = handleSubmit(onSubmit, onError)
+    const dryRunSubmitHandler = handleSubmit(onSubmit, onDryRunError)
+
     // CONFIG TOOLBAR POPUP MENU
     const toolbarPopupConfig: ConfigToolbarProps['popupConfig'] = {
         menuConfig: getConfigToolbarPopupConfig({
@@ -802,8 +817,7 @@ export const ConfigMapSecretContainer = ({
                 draftData={resolvedDraftData ?? draftData}
                 inheritedConfigMapSecretData={resolvedInheritedConfigMapSecretData ?? inheritedConfigMapSecretData}
                 id={id}
-                onError={onError}
-                onSubmit={onSubmit}
+                onSubmit={formSubmitHandler}
                 selectedProtectionViewTab={selectedProtectionViewTab}
                 updateCMSecret={updateCMSecret}
                 componentType={componentType}
@@ -826,8 +840,7 @@ export const ConfigMapSecretContainer = ({
                 isApprovalPolicyConfigured={isApprovalPolicyConfigured}
                 isSubmitting={isSubmitting}
                 disableDataTypeChange={isDeleteDisabled}
-                onSubmit={onSubmit}
-                onError={onError}
+                onSubmit={formSubmitHandler}
                 onCancel={onCancel}
                 areScopeVariablesResolving={resolvedScopeVariablesResLoading}
                 appChartRef={appChartRef}
@@ -886,7 +899,7 @@ export const ConfigMapSecretContainer = ({
                         handleChangeDryRunEditorMode={setDryRunEditorMode}
                         showCrudButtons={!showNoOverride}
                         isSubmitting={isSubmitting}
-                        onSubmit={onSubmit}
+                        onSubmit={dryRunSubmitHandler}
                         parentName={parentName}
                         updateCMSecret={updateCMSecret}
                         formData={resolvedFormData ?? formData}

diff --git a/src/Pages/Shared/ConfigMapSecret/ConfigMapSecretDryRun.tsx b/src/Pages/Shared/ConfigMapSecret/ConfigMapSecretDryRun.tsx
@@ -144,9 +144,6 @@ export const ConfigMapSecretDryRun = ({
         isDryRunDataPresent && !hideManifest,
     )
 
-    // METHODS
-    const handleSubmit = () => onSubmit(formData)
-
     // RENDERERS
     const renderLHSContent = () => {
         if (publishedVersionDoesNotExist) {
@@ -264,7 +261,7 @@ export const ConfigMapSecretDryRun = ({
                     dataTestId="cm-secret-form-submit-btn"
                     text={`Save${!isCreateView ? ' Changes' : ''}${isApprovalPolicyConfigured ? '...' : ''}`}
                     size={ComponentSizeType.medium}
-                    onClick={handleSubmit}
+                    onClick={onSubmit}
                     isLoading={isSubmitting}
                     disabled={isSaveButtonDisabled}
                 />

diff --git a/src/Pages/Shared/ConfigMapSecret/ConfigMapSecretForm.tsx b/src/Pages/Shared/ConfigMapSecret/ConfigMapSecretForm.tsx
@@ -65,14 +65,13 @@ export const ConfigMapSecretForm = ({
     areScopeVariablesResolving,
     useFormProps,
     onSubmit,
-    onError,
     onCancel,
 }: ConfigMapSecretFormProps) => {
     // HOOKS
     const location = useLocation()
 
     // FORM PROPS
-    const { data, errors, formState, setValue, register, handleSubmit } = useFormProps
+    const { data, errors, formState, setValue, register } = useFormProps
 
     // CONSTANTS
     const isCreateView = id === null
@@ -329,7 +328,7 @@ export const ConfigMapSecretForm = ({
                 dataTestId="cm-secret-form-submit-btn"
                 text={`Save${!isCreateView ? ' Changes' : ''}${isApprovalPolicyConfigured ? '...' : ''}`}
                 size={ComponentSizeType.medium}
-                onClick={handleSubmit(onSubmit, onError)}
+                onClick={onSubmit}
                 isLoading={isSubmitting}
                 disabled={isSubmitting || areScopeVariablesResolving || isFormDisabled}
             />

diff --git a/src/Pages/Shared/ConfigMapSecret/ConfigMapSecretProtected.tsx b/src/Pages/Shared/ConfigMapSecret/ConfigMapSecretProtected.tsx
@@ -38,7 +38,6 @@ export const ConfigMapSecretProtected = ({
     parentName,
     inheritedConfigMapSecretData,
     areScopeVariablesResolving,
-    onError,
     onSubmit,
     updateCMSecret,
     shouldMergeTemplateWithPatches,
@@ -222,7 +221,6 @@ export const ConfigMapSecretProtected = ({
             disableDataTypeChange={disableDataTypeChange}
             isSubmitting={false}
             onCancel={noop}
-            onError={onError}
             onSubmit={onSubmit}
             areScopeVariablesResolving={areScopeVariablesResolving}
             useFormProps={useFormProps}

diff --git a/src/Pages/Shared/ConfigMapSecret/types.ts b/src/Pages/Shared/ConfigMapSecret/types.ts
@@ -8,8 +8,6 @@ import {
     ProtectConfigTabsType,
     SelectPickerOptionType,
     useForm,
-    UseFormErrorHandler,
-    UseFormSubmitHandler,
     AppEnvDeploymentConfigDTO,
     DryRunEditorMode,
     ConfigHeaderTabType,
@@ -156,8 +154,7 @@ export interface ConfigMapSecretFormProps
     areScopeVariablesResolving: boolean
     isDraft?: boolean
     disableDataTypeChange: boolean
-    onSubmit: UseFormSubmitHandler<ConfigMapSecretUseFormProps>
-    onError: UseFormErrorHandler<ConfigMapSecretUseFormProps>
+    onSubmit: () => void
     onCancel: () => void
     useFormProps: ReturnType<typeof useForm<ConfigMapSecretUseFormProps>>
 }
@@ -217,7 +214,6 @@ export type ConfigMapSecretProtectedProps = Pick<ConfigMapSecretContainerProps,
         | 'isJob'
         | 'disableDataTypeChange'
         | 'id'
-        | 'onError'
         | 'onSubmit'
         | 'areScopeVariablesResolving'
         | 'appChartRef'