approver flow fix

Author: Mukul Tayal

src/components/EnvironmentOverride/DeploymentTemplateOverrideForm.tsx

@@ -2,12 +2,12 @@ import React, { useEffect, useMemo, useState } from 'react'
 import { useParams } from 'react-router-dom'
 import { toast } from 'react-toastify'
 import YAML from 'yaml'
-import { Progressing, showError } from '@devtron-labs/devtron-fe-common-lib'
+import { Progressing, getLockedJSON, getUnlockedJSON } from '@devtron-labs/devtron-fe-common-lib'
 import { FloatingVariablesSuggestions, importComponentFromFELibrary, useJsonYaml } from '../common'
 import { ConfigKeysWithLockType, DeploymentConfigStateActionTypes } from '../deploymentConfig/types'
 import { EDITOR_VIEW } from '../deploymentConfig/constants'
 import { DEPLOYMENT, ROLLOUT_DEPLOYMENT } from '../../config'
-import { createDeploymentTemplate, getLockedJsonPathArray, updateDeploymentTemplate } from './service'
+import { createDeploymentTemplate, updateDeploymentTemplate } from './service'
 import { ReactComponent as WarningIcon } from '../../assets/icons/ic-warning-y6.svg'
 import { ReactComponent as InfoIcon } from '../../assets/icons/ic-info-filled.svg'
 import DeploymentTemplateOptionsTab from '../deploymentConfig/DeploymentTemplateView/DeploymentTemplateOptionsTab'
@@ -27,8 +27,6 @@ import {
     validateBasicView,
 } from '../deploymentConfig/DeploymentConfig.utils'
 import CodeEditor from '../CodeEditor/CodeEditor'
-import { getUnlockedJSON } from '@devtron-labs/devtron-fe-common-lib'
-import { getLockedJSON } from '@devtron-labs/devtron-fe-common-lib'
 
 const ConfigToolbar = importComponentFromFELibrary('ConfigToolbar', DeploymentConfigToolbar)
 const SaveChangesModal = importComponentFromFELibrary('SaveChangesModal')
@@ -218,13 +216,9 @@ export default function DeploymentTemplateOverrideForm({
                 //loading state for checking locked changes
                 dispatch({ type: DeploymentConfigStateActionTypes.lockChangesLoading, payload: true })
             }
-            const [lockedJSONPathResp, deploymentTemplateResp] = await Promise.all([
-                getLockedJsonPathArray(),
-                isConfigProtectionEnabled
-                    ? checkForProtectedLockedChanges()
-                    : api(+appId, +envId, prepareDataToSave(envOverrideValuesWithBasic, false)),
-            ])
-            setLockedConfigKeysWithLockType(lockedJSONPathResp.result)
+            const deploymentTemplateResp = isConfigProtectionEnabled
+                ? await checkForProtectedLockedChanges()
+                : await api(+appId, +envId, prepareDataToSave(envOverrideValuesWithBasic, false))
             if (deploymentTemplateResp.result.isLockConfigError && !saveEligibleChanges) {
                 //checking if any locked changes and opening drawer to show eligible and locked ones
                 setLockedOverride(deploymentTemplateResp.result?.lockedOverride)
@@ -748,6 +742,7 @@ export default function DeploymentTemplateOverrideForm({
                     lockedOverride={lockedOverride}
                     lockedConfigKeysWithLockType={lockedConfigKeysWithLockType}
                     disableSaveEligibleChanges={disableSaveEligibleChanges}
+                    setLockedConfigKeysWithLockType={setLockedConfigKeysWithLockType}
                 />
             )}
         </DeploymentConfigContext.Provider>

src/components/EnvironmentOverride/service.ts

@@ -5,7 +5,6 @@ export function getDeploymentTemplate(appId, envId, chartId){
     return get(`app/env/${appId}/${envId}/${chartId}`)
 }
 
-export const getLockedJsonPathArray = () => get('config/lock')
 
 export function updateDeploymentTemplate(appId, envId, payload){
     return put(`app/env`, payload)

src/components/deploymentConfig/DeploymentConfig.tsx

@@ -12,7 +12,14 @@ import {
 } from './service'
 import { getChartReferences } from '../../services/service'
 import { useJsonYaml, importComponentFromFELibrary, FloatingVariablesSuggestions } from '../common'
-import { showError, useEffectAfterMount, useAsync, Progressing } from '@devtron-labs/devtron-fe-common-lib'
+import {
+    showError,
+    useEffectAfterMount,
+    useAsync,
+    Progressing,
+    getLockedJSON,
+    getUnlockedJSON,
+} from '@devtron-labs/devtron-fe-common-lib'
 import {
     ConfigKeysWithLockType,
     DeploymentConfigContextType,
@@ -46,10 +53,6 @@ import { SaveConfirmationDialog, SuccessToastBody } from './DeploymentTemplateVi
 import { deploymentConfigReducer, initDeploymentConfigState } from './DeploymentConfigReducer'
 import DeploymentTemplateReadOnlyEditorView from './DeploymentTemplateView/DeploymentTemplateReadOnlyEditorView'
 import CodeEditor from '../CodeEditor/CodeEditor'
-import { getUnlockedJSON } from '@devtron-labs/devtron-fe-common-lib'
-import { getLockedJSON } from '@devtron-labs/devtron-fe-common-lib'
-import { getLockedJsonPathArray } from '../EnvironmentOverride/service'
-
 const DeploymentTemplateLockedDiff = importComponentFromFELibrary('DeploymentTemplateLockedDiff')
 const ConfigToolbar = importComponentFromFELibrary('ConfigToolbar', DeploymentConfigToolbar)
 const SaveChangesModal = importComponentFromFELibrary('SaveChangesModal')
@@ -488,11 +491,9 @@ export default function DeploymentConfig({
         })
         try {
             const requestBody = prepareDataToSave(true)
-            const [lockedJSONPathResp, deploymentTemplateResp] = await Promise.all([
-                getLockedJsonPathArray(),
-                isProtected ? checkForProtectedLockedChanges() : getIfLockedConfigNonProtected(requestBody),
-            ])
-            setLockedConfigKeysWithLockType(lockedJSONPathResp.result)
+            const deploymentTemplateResp = isProtected
+                ? await checkForProtectedLockedChanges()
+                : await getIfLockedConfigNonProtected(requestBody)
             if (deploymentTemplateResp.result.isLockConfigError) {
                 setDisableSaveEligibleChanges(deploymentTemplateResp.result?.disableSaveEligibleChanges)
                 setLockedOverride(deploymentTemplateResp.result?.lockedOverride)
@@ -539,11 +540,7 @@ export default function DeploymentConfig({
         try {
             const requestBody = prepareDataToSave(true)
             const api = state.chartConfig.id ? updateDeploymentTemplate : saveDeploymentTemplate
-            const [lockedJSONPathResp, deploymentTemplateResp] = await Promise.all([
-                getLockedJsonPathArray(),
-                api(requestBody, baseDeploymentAbortController.signal),
-            ])
-            setLockedConfigKeysWithLockType(lockedJSONPathResp.result)
+            const deploymentTemplateResp = await api(requestBody, baseDeploymentAbortController.signal)
             if (deploymentTemplateResp.result.isLockConfigError) {
                 setDisableSaveEligibleChanges(deploymentTemplateResp.result?.disableSaveEligibleChanges)
                 setLockedOverride(deploymentTemplateResp.result?.lockedOverride)
@@ -578,6 +575,7 @@ export default function DeploymentConfig({
                 payload: false,
             })
             saveEligibleChangesCb && closeLockedDiffDrawerWithChildModal()
+            state.showConfirmation && handleConfirmationDialog(false)
         }
     }
 
@@ -980,6 +978,7 @@ export default function DeploymentConfig({
                             lockedConfigKeysWithLockType={lockedConfigKeysWithLockType}
                             lockedOverride={lockedOverride}
                             disableSaveEligibleChanges={disableSaveEligibleChanges}
+                            setLockedConfigKeysWithLockType={setLockedConfigKeysWithLockType}
                         />
                     )}
                     {SaveChangesModal && state.showSaveChangesModal && (

src/components/deploymentConfig/DeploymentTemplateView/DeploymentConfigFormCTA.tsx

@@ -62,19 +62,20 @@ export default function DeploymentConfigFormCTA({
     }
 
     const checkForLockedChangesForApproval = async () => {
-        setApproveChangesClicked(true)
+        //setting approveChangesClicked to true only is approve changes button
         if (isApprovalPending && !approveDisabled && !isSuperAdmin) {
+            setApproveChangesClicked(true)
             try {
                 dispatch({
                     type: DeploymentConfigStateActionTypes.lockChangesLoading,
                     payload: true,
                 })
-                const res = await checkForProtectedLockedChanges()
-                if (res.result.isLockConfigError) {
+                const deploymentTemplateResp = await checkForProtectedLockedChanges()
+                if (deploymentTemplateResp.result.isLockConfigError) {
                     setShowLockedDiffForApproval(true)
-                    setLockedOverride(res.result.lockedOverride)
+                    setLockedOverride(deploymentTemplateResp.result.lockedOverride)
                     handleLockedDiffDrawer(true)
-                }
+                } else setShowLockedDiffForApproval(false)
             } catch (err) {
                 showError(err)
             } finally {
@@ -83,6 +84,8 @@ export default function DeploymentConfigFormCTA({
                     payload: false,
                 })
             }
+        } else if (isApprovalPending) {
+            setApproveChangesClicked(true)
         }
     }
 
@@ -232,6 +235,7 @@ export default function DeploymentConfigFormCTA({
                 draftVersionId={state.latestDraft.draftVersionId}
                 resourceName="deployment template"
                 reload={reload}
+                onClose={() => setApproveChangesClicked(false)}
             >
                 <span>{children}</span>
             </ApproveRequestTippy>