Merge pull request #2076 from devtron-labs/fix/create-app-redirect

fix: redirect on previous url on closing create devtron app modal

Author: arunjaindev

package.json

@@ -4,7 +4,7 @@
     "private": true,
     "homepage": "/dashboard",
     "dependencies": {
-        "@devtron-labs/devtron-fe-common-lib": "0.3.10",
+        "@devtron-labs/devtron-fe-common-lib": "0.3.11",
         "@esbuild-plugins/node-globals-polyfill": "0.2.3",
         "@rjsf/core": "^5.13.3",
         "@rjsf/utils": "^5.13.3",

src/components/app/list-new/AppList.tsx

@@ -16,7 +16,7 @@
  */
 
 import React, { useState, useEffect, useMemo } from 'react'
-import { Switch, Route, useLocation, useHistory, useParams } from 'react-router-dom'
+import { Switch, Route, useHistory, useParams, useRouteMatch, useLocation } from 'react-router-dom'
 import {
     Progressing,
     stopPropagation,
@@ -36,13 +36,13 @@ import {
 import { getCommonAppFilters } from '@Services/service'
 import { Cluster } from '@Services/service.types'
 import { useAppContext } from '../../common'
-import { SERVER_MODE, DOCUMENTATION, URLS } from '../../../config'
+import { SERVER_MODE, DOCUMENTATION } from '../../../config'
 import HelmAppList from './HelmAppList'
 import { AppListPropType } from '../list/types'
 import { AddNewApp } from '../create/CreateApp'
 import '../list/list.scss'
 import EAEmptyState, { EAEmptyStateType } from '../../common/eaEmptyState/EAEmptyState'
-import { FLUX_CD_HELM_RELEASE_LABEL } from './Constants'
+import { APP_LISTING_URLS, FLUX_CD_HELM_RELEASE_LABEL } from './Constants'
 import { getModuleInfo } from '../../v2/devtronStackManager/DevtronStackManager.service'
 import {
     getAppStatusFormattedValue,
@@ -64,8 +64,9 @@ import AppListFilters from './AppListFilters'
 let interval
 
 const AppList = ({ isArgoInstalled }: AppListPropType) => {
-    const location = useLocation()
     const history = useHistory()
+    const location = useLocation()
+    const { url } = useRouteMatch()
     const params = useParams<{ appType: string }>()
     const { serverMode } = useMainContext()
     const { setCurrentAppName } = useAppContext()
@@ -396,36 +397,26 @@ const AppList = ({ isArgoInstalled }: AppListPropType) => {
 
     const closeDevtronAppCreateModal = (e) => {
         stopPropagation(e)
-        const _urlPrefix =
-            params.appType === AppListConstants.AppType.DEVTRON_APPS ? URLS.DEVTRON_APP_LIST : URLS.HELM_APP_LIST
-        history.push(`${_urlPrefix}${location.search}`)
+        history.push(`${url}${location.search}`)
     }
 
     function renderAppCreateRouter() {
         return (
             <Switch>
-                <Route
-                    path={`${URLS.DEVTRON_APP_LIST}/${AppListConstants.CREATE_DEVTRON_APP_URL}`}
-                    render={(props) => (
-                        <AddNewApp
-                            close={closeDevtronAppCreateModal}
-                            match={props.match}
-                            location={props.location}
-                            history={props.history}
-                        />
-                    )}
-                />
-                <Route
-                    path={`${URLS.HELM_APP_LIST}/${AppListConstants.CREATE_DEVTRON_APP_URL}`}
-                    render={(props) => (
-                        <AddNewApp
-                            close={closeDevtronAppCreateModal}
-                            match={props.match}
-                            location={props.location}
-                            history={props.history}
-                        />
-                    )}
-                />
+                {APP_LISTING_URLS.map((currentUrl) => (
+                    <Route
+                        path={`${currentUrl}/${AppListConstants.CREATE_DEVTRON_APP_URL}`}
+                        key={currentUrl}
+                        render={(props) => (
+                            <AddNewApp
+                                close={closeDevtronAppCreateModal}
+                                match={props.match}
+                                location={props.location}
+                                history={props.history}
+                            />
+                        )}
+                    />
+                ))}
             </Switch>
         )
     }

src/components/app/list-new/Constants.ts

@@ -15,6 +15,7 @@
  */
 
 import { OptionType, SelectPickerOptionType } from '@devtron-labs/devtron-fe-common-lib'
+import { URLS } from '@Config/routes'
 import { AppStatuses, AppStatusesDTO, FluxCDTemplateType } from './AppListType'
 
 export const APP_LIST_HEADERS = {
@@ -95,3 +96,5 @@ export const APPS_WITH_NO_PROJECT_OPTION: OptionType = {
     label: 'Apps with no project',
     value: '0',
 }
+
+export const APP_LISTING_URLS = [URLS.DEVTRON_APP_LIST, URLS.HELM_APP_LIST, URLS.ARGO_APP_LIST, URLS.FLUX_APP_LIST]

src/components/app/list-new/list.utils.ts

@@ -117,7 +117,7 @@ export const useFilterOptions = ({
 
     const clusterGroupedEnvOptions: GroupedOptionsType[] = useMemo(
         () =>
-            appListFiltersResponse?.appListFilters.result.environments.reduce((prev, curr) => {
+            appListFiltersResponse?.appListFilters?.result.environments.reduce((prev, curr) => {
                 if (!prev.find((clusterItem) => clusterItem.label === curr.cluster_id)) {
                     prev.push({ label: curr.cluster_id, options: [] })
                 }
@@ -159,7 +159,7 @@ export const useFilterOptions = ({
             appListFiltersResponse?.isFullMode
                 ? getClusterOptions(appListFiltersResponse?.appListFilters.result.clusters)
                 : getClusterOptions(appListFiltersResponse?.clusterList.result),
-        [appListFiltersResponse],
+        [appListFiltersResponse, isExternalArgo, isExternalFlux],
     )
 
     const namespaceOptions: GroupedOptionsType[] = useMemo(

src/components/v2/appDetails/k8Resource/nodeDetail/NodeDetailTabs/Manifest.component.tsx

@@ -486,7 +486,7 @@ const ManifestComponent = ({
                             cleanData={showManifestCompareView}
                             diffView={showManifestCompareView}
                             theme="vs-dark--dt"
-                            height={isResourceBrowserView ? 'calc(100vh - 151px)' : 'calc(100vh - 77px)'}
+                            height={isResourceBrowserView ? 'calc(100vh - 119px)' : 'calc(100vh - 77px)'}
                             value={trimedManifestEditorData}
                             mode={MODES.YAML}
                             readOnly={showManifestCompareView || !isEditMode}

yarn.lock

@@ -1369,10 +1369,10 @@
   dependencies:
     "@jridgewell/trace-mapping" "0.3.9"
 
-"@devtron-labs/[email protected].10":
-  version "0.3.10"
-  resolved "https://registry.yarnpkg.com/@devtron-labs/devtron-fe-common-lib/-/devtron-fe-common-lib-0.3.10.tgz#30c12adc09ae91f836730889f45382d7a7281d34"
-  integrity sha512-3HCfN2BGd2sQIaWNqV4Tb9uK22zgIQjvTX6MWEZoSFxscj4KvIwheIm9b9uMiC9uz64ztf8Rab/JL6CeYmWw4Q==
+"@devtron-labs/[email protected].11":
+  version "0.3.11"
+  resolved "https://registry.yarnpkg.com/@devtron-labs/devtron-fe-common-lib/-/devtron-fe-common-lib-0.3.11.tgz#3e5ecf873210376dc46f60739753b7cd2788ff87"
+  integrity sha512-PxGZC7QvWGcV8lO73usoFB/AGjJJ/xLGJG4AnuruEE7zgHPHlcQoLS+hcUOtJatlIpyQ5hn+fD+zlovHT3MxoA==
   dependencies:
     "@types/react-dates" "^21.8.6"
     ansi_up "^5.2.1"