Merge pull request #1499 from devtron-labs/fix/retain-env-state

fix: env id issues on switching tabs on Applications page

Author: prajjwal-devtron

src/components/app/details/appDetails/AppDetails.tsx

@@ -57,6 +57,10 @@ import {
     getPodNameSuffix,
     processDeploymentStatusDetailsData,
     ValueContainer,
+    NoParamsNoEnvContext,
+    NoParamsWithEnvContext,
+    ParamsNoEnvContext,
+    ParamsAndEnvContext,
 } from './utils'
 import { AppMetrics } from './AppMetrics'
 import IndexStore from '../../../v2/appDetails/index.store'
@@ -120,30 +124,31 @@ export default function AppDetail({ filteredEnvIds }: { filteredEnvIds?: string
                     ?.sort((a, b) => (a.environmentName > b.environmentName ? 1 : -1)) || []
 
             if (_envList.length > 0) {
-                let _envId
-                if (!params.envId && _envList.length === 1) {
-                    _envId = _envList[0].environmentId
-                } else if (
-                    !params.envId &&
-                    environmentId &&
-                    _envList.map((env) => env.environmentId).includes(environmentId)
-                ) {
-                    _envId = environmentId
-                } else if (!_envList.map((env) => env.environmentId).includes(+params.envId)) {
-                    _envId = _envList[0].environmentId
+                let selector
+                if (!params.envId && !environmentId) {
+                    selector = new NoParamsNoEnvContext()
+                } else if (!params.envId && environmentId) {
+                    selector = new NoParamsWithEnvContext()
+                } else if (params.envId && !environmentId) {
+                    selector = new ParamsNoEnvContext()
+                } else if (params.envId && environmentId) {
+                    selector = new ParamsAndEnvContext()
                 }
-                if (_envId) {
-                    const newUrl = getAppDetailsURL(params.appId, _envId)
+
+                const selectedEnvId = selector.resolveEnvironmentId(params, environmentId, _envList, setEnvironmentId)
+
+                // Set the URL and push to navigation stack
+                if (selectedEnvId) {
+                    const newUrl = getAppDetailsURL(params.appId, selectedEnvId)
                     push(newUrl)
                 } else {
                     setEnvironmentId(null)
                 }
             } else {
                 setEnvironmentId(null)
             }
+            // Return the filtered and sorted environment list
             return _envList
-        } else {
-            setEnvironmentId(null)
         }
         return []
     }, [filteredEnvIds, otherEnvsResult])
@@ -561,7 +566,7 @@ export const Details: React.FC<DetailsType> = ({
     ) {
         return (
             <>
-            {environments?.length > 0 && (
+                {environments?.length > 0 && (
                     <div className="flex left ml-20 mt-16">
                         <EnvSelector
                             environments={environments}

src/components/app/details/appDetails/utils.tsx

@@ -711,3 +711,46 @@ export const validateMomentDate = (date: string, format: string): string => {
     if (!date || date === ZERO_TIME_STRING) return '--'
     return moment(date, format).fromNow()
 }
+
+class EnvironmentSelection {
+    resolveEnvironmentId(params, environmentId, _envList, setEnvironmentId) {
+        throw new Error('This method should be overridden by concrete classes.')
+    }
+}
+
+export class NoParamsNoEnvContext extends EnvironmentSelection {
+    resolveEnvironmentId(params, environmentId, _envList, setEnvironmentId) {
+        return _envList[0].environmentId
+    }
+}
+
+export class NoParamsWithEnvContext extends EnvironmentSelection {
+    resolveEnvironmentId(params, environmentId, _envList, setEnvironmentId) {
+        if (environmentId && _envList.map((env) => env.environmentId).includes(environmentId)) {
+            return environmentId
+        }
+        return _envList[0].environmentId
+    }
+}
+
+export class ParamsNoEnvContext extends EnvironmentSelection {
+    resolveEnvironmentId(params, environmentId, _envList, setEnvironmentId) {
+        if (params.envId && _envList.map((env) => env.environmentId).includes(+params.envId)) {
+            return +params.envId
+        }
+        return _envList[0].environmentId
+    }
+}
+
+export class ParamsAndEnvContext extends EnvironmentSelection {
+    resolveEnvironmentId(params, environmentId, _envList, setEnvironmentId) {
+        if (params.envId && _envList.map((env) => env.environmentId).includes(+params.envId)) {
+            // If environmentId is present and different from params.envContext, set environmentId
+            if (environmentId && +environmentId !== +params.envId) {
+                setEnvironmentId(+params.envId)
+            }
+            return +params.envId
+        }
+        return _envList[0].environmentId
+    }
+}