revert: Config drift modal to state

Author: vivek-devtron

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "1.7.0-beta-2",
+    "version": "1.7.0-beta-3",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",

package.json

@@ -80,6 +80,7 @@ export const URLS = {
     NETWORK_STATUS_INTERFACE: '/network-status-interface',
     RESOURCE_BROWSER: '/resource-browser',
     COMPARE_CLUSTERS: '/compare-clusters',
+    CONFIG_DRIFT: 'config-drift',
 }
 
 export const ROUTES = {

src/Common/Constants.ts

@@ -16,6 +16,8 @@
 
 import { useEffect, useMemo, useState } from 'react'
 import Tippy from '@tippyjs/react'
+import { useHistory } from 'react-router-dom'
+import { URLS } from '@Common/Constants'
 import { ReactComponent as InfoIcon } from '../../../Assets/Icon/ic-info-filled.svg'
 import { ReactComponent as Chat } from '../../../Assets/Icon/ic-chat-circle-dots.svg'
 import { AppStatusDetailsChartType, AggregatedNodes, STATUS_SORTING_ORDER, NodeFilters } from './types'
@@ -28,9 +30,10 @@ import { Button, ButtonStyleType, ButtonVariantType } from '../Button'
 const AppStatusDetailsChart = ({
     filterRemoveHealth = false,
     showFooter,
-    handleOpenConfigDriftModal,
+    showConfigDriftInfo = false,
     onClose,
 }: AppStatusDetailsChartType) => {
+    const history = useHistory()
     const _appDetails = IndexStore.getAppDetails()
     const [currentFilter, setCurrentFilter] = useState<string>(ALL_RESOURCE_KIND_FILTER)
     const [flattenedNodes, setFlattenedNodes] = useState([])
@@ -39,7 +42,7 @@ const AppStatusDetailsChart = ({
 
     const handleCompareDesiredManifest = () => {
         onClose()
-        handleOpenConfigDriftModal()
+        history.push(`${URLS.APP}/${appId}${URLS.DETAILS}/${envId}/${URLS.APP_DETAILS_K8}/${URLS.CONFIG_DRIFT}`)
     }
 
     const nodes: AggregatedNodes = useMemo(
@@ -148,7 +151,7 @@ const AppStatusDetailsChart = ({
                                         {nodeDetails.status ? nodeDetails.status : nodeDetails.health.status}
                                     </div>
                                     <div className="flexbox-col dc__gap-4">
-                                        {handleOpenConfigDriftModal && nodeDetails.hasDrift && (
+                                        {showConfigDriftInfo && nodeDetails.hasDrift && (
                                             <div className="flexbox dc__gap-8 dc__align-items-center">
                                                 <span className="fs-13 fw-4 lh-20 cy-7">Config drift detected</span>
                                                 {onClose && appId && envId && (

src/Shared/Components/CICDHistory/AppStatusDetailsChart.tsx

@@ -631,7 +631,7 @@ export interface DeploymentHistorySidebarType {
 export interface AppStatusDetailsChartType {
     filterRemoveHealth?: boolean
     showFooter: boolean
-    handleOpenConfigDriftModal?: () => void
+    showConfigDriftInfo?: boolean
     onClose?: () => void
 }