Merge branch 'fix/rb-table' into feat/rb-table

Author: Elessar1802

.github/workflows/ci.yml

@@ -25,7 +25,7 @@ jobs:
         cache: 'yarn'
 
     - name: Install dependencies
-      run: yarn install --frozen-lockfile
+      run: yarn install --immutable
 
     - name: Check linting issues
       run: yarn lint

.nvmrc

@@ -1 +1 @@
-v20.11.0
+v22

.yarn/releases/yarn-4.9.2.cjs

@@ -0,0 +1,3 @@
+nodeLinker: node-modules
+
+yarnPath: .yarn/releases/yarn-4.9.2.cjs

.yarnrc.yml

@@ -1,11 +1,17 @@
-FROM node:20-alpine AS builder
+FROM node:22-alpine AS builder
 
 WORKDIR /app
 
-COPY package.json yarn.lock .
+RUN corepack enable yarn && \
+    yarn set version 4.9.2
+
+COPY package.json .
+COPY yarn.lock .
+COPY .yarn/ .yarn/
+COPY .yarnrc.yml ./
 
 RUN apk add --no-cache git
-RUN yarn install --frozen-lockfile --network-timeout 600000
+RUN yarn install --immutable --network-timeout 600000
 
 COPY . .
 

Dockerfile

@@ -4,7 +4,7 @@
     "private": true,
     "homepage": "/dashboard",
     "dependencies": {
-        "@devtron-labs/devtron-fe-common-lib": "1.15.1-pre-5",
+        "@devtron-labs/devtron-fe-common-lib": "1.15.3-beta-4",
         "@esbuild-plugins/node-globals-polyfill": "0.2.3",
         "@rjsf/core": "^5.13.3",
         "@rjsf/utils": "^5.13.3",
@@ -14,7 +14,6 @@
         "@sentry/tracing": "7.50.0",
         "@tippyjs/react": "4.2.6",
         "@typeform/embed-react": "2.20.0",
-        "@vitejs/plugin-react": "4.3.1",
         "command-line-parser": "^0.2.10",
         "compute-histogram": "^0.9.11",
         "dayjs": "^1.11.8",
@@ -39,9 +38,6 @@
         "rxjs": "^7.5.4",
         "sockjs-client": "1.6.1",
         "tippy.js": "^6.3.7",
-        "vite": "5.4.19",
-        "vite-plugin-require-transform": "1.0.21",
-        "vite-plugin-svgr": "^2.4.0",
         "xterm": "^4.19.0",
         "xterm-addon-fit": "^0.5.0",
         "xterm-addon-search": "^0.9.0",
@@ -87,6 +83,7 @@
         "@types/recompose": "^0.30.10",
         "@typescript-eslint/eslint-plugin": "8.3.0",
         "@typescript-eslint/parser": "8.3.0",
+        "@vitejs/plugin-react": "4.5.2",
         "env-cmd": "10.1.0",
         "eslint": "^8.57.1",
         "eslint-config-airbnb": "^19.0.4",
@@ -115,9 +112,11 @@
         "ts-jest": "29.2.5",
         "ts-node": "10.9.2",
         "typescript": "5.5.4",
-        "vite-plugin-compression2": "^1.3.3",
-        "vite-plugin-image-optimizer": "^1.1.8",
+        "vite": "6.3.5",
+        "vite-plugin-compression2": "2.0.1",
         "vite-plugin-pwa": "^0.21.1",
+        "vite-plugin-require-transform": "1.0.21",
+        "vite-plugin-svgr": "^2.4.0",
         "vite-tsconfig-paths": "5.0.1"
     },
     "jest": {
@@ -139,5 +138,6 @@
         "rollup": "^4.22.4",
         "path-to-regexp": "^1.9.0",
         "cross-spawn": "^7.0.5"
-    }
+    },
+    "packageManager": "[email protected]"
 }

package.json

@@ -47,15 +47,17 @@ export const AppCloneList = ({ handleCloneAppClick, isJobView, handleCreationMet
             <div className="flexbox-col dc__gap-12 pt-20 px-20">
                 <h2 className="m-0 fs-15 lh-1-5 fw-6 cn-9">Choose {isJobView ? 'a job' : 'an application'} to clone</h2>
 
-                <SearchBar
-                    dataTestId="template-list-search"
-                    initialSearchText={searchKey}
-                    size={ComponentSizeType.medium}
-                    handleEnter={handleSearch}
-                    inputProps={{
-                        placeholder: `Search ${isJobView ? 'job' : 'application'}`,
-                    }}
-                />
+                {!!list.length && !listError && (
+                    <SearchBar
+                        dataTestId="template-list-search"
+                        initialSearchText={searchKey}
+                        size={ComponentSizeType.medium}
+                        handleEnter={handleSearch}
+                        inputProps={{
+                            placeholder: `Search ${isJobView ? 'job' : 'application'}`,
+                        }}
+                    />
+                )}
             </div>
             <div className="flex-grow-1 flexbox-col dc__gap-12 p-20 dc__overflow-auto">
                 <GenericInfoCardListing

src/Pages/App/CreateAppModal/AppClone/AppCloneList.tsx

@@ -21,14 +21,17 @@ import {
     Button,
     ButtonComponentType,
     ComponentSizeType,
+    Drawer,
     ErrorScreenNotAuthorized,
     FeatureTitleWithInfo,
+    GenericEmptyState,
     Icon,
     Progressing,
     Reload,
     showError,
     sortCallback,
-    URLS as CommonURLS,
+    stopPropagation,
+    URLS as COMMON_URLS,
 } from '@devtron-labs/devtron-fe-common-lib'
 
 import { importComponentFromFELibrary } from '@Components/common'
@@ -42,9 +45,13 @@ import { getClusterList, getEnvironmentList } from './cluster.service'
 import { ClusterMetadataTypes, ClusterProps } from './cluster.type'
 import { getSelectParsedCategory } from './cluster.util'
 import { ClusterList } from './ClusterList'
+import EditClusterDrawerContent from './EditClusterDrawerContent'
 
 const ManageCategories = importComponentFromFELibrary('ManageCategories', null, 'function')
 const ManageCategoryButton = importComponentFromFELibrary('ManageCategoryButton', null, 'function')
+const PodSpreadModal = importComponentFromFELibrary('PodSpreadModal', null, 'function')
+const HibernationRulesModal = importComponentFromFELibrary('HibernationRulesModal', null, 'function')
+const VirtualClusterForm = importComponentFromFELibrary('VirtualClusterForm', null, 'function')
 
 const ClusterComponents = ({ isSuperAdmin }: ClusterProps) => {
     const [view, setView] = useState(ViewType.LOADING)
@@ -138,22 +145,15 @@ const ClusterComponents = ({ isSuperAdmin }: ClusterProps) => {
                     clusterName={cluster.cluster_name}
                     isVirtualCluster={cluster.isVirtualCluster}
                     environments={cluster.environments}
-                    sshTunnelConfig={cluster.sshTunnelConfig}
                     isProd={cluster.isProd}
                     serverURL={cluster.server_url}
-                    prometheusURL={cluster.prometheus_url}
-                    prometheusAuth={cluster.prometheusAuth}
-                    proxyUrl={cluster.proxyUrl}
-                    insecureSkipTlsVerify={cluster.insecureSkipTlsVerify}
-                    installationId={cluster.installationId}
                     category={cluster.category}
-                    toConnectWithSSHTunnel={cluster.toConnectWithSSHTunnel}
                     clusterId={cluster.id}
                 />
             ))}
 
             {ManageCategories && (
-                <Route path={CommonURLS.GLOBAL_CONFIG_MANAGE_CATEGORIES}>
+                <Route path={COMMON_URLS.GLOBAL_CONFIG_MANAGE_CATEGORIES}>
                     <ManageCategories />
                 </Route>
             )}
@@ -162,6 +162,83 @@ const ClusterComponents = ({ isSuperAdmin }: ClusterProps) => {
                 <CreateCluster handleReloadClusterList={initialize} />
             </Route>
 
+            <Route
+                path={COMMON_URLS.GLOBAL_CONFIG_EDIT_CLUSTER}
+                render={(props) => {
+                    const { clusterId } = props.match.params
+                    const cluster: ClusterMetadataTypes = clusters.find((c) => c.id === +clusterId)
+
+                    if (!cluster || !cluster.isVirtualCluster) {
+                        return (
+                            <Drawer position="right" width="1000px" onClose={handleRedirectToClusterList}>
+                                <div className="h-100 bg__primary" onClick={stopPropagation}>
+                                    {!cluster ? (
+                                        <GenericEmptyState
+                                            title="Cluster not found"
+                                            subTitle="The cluster that you are looking is not available."
+                                        />
+                                    ) : (
+                                        <EditClusterDrawerContent
+                                            handleModalClose={handleRedirectToClusterList}
+                                            sshTunnelConfig={cluster.sshTunnelConfig}
+                                            clusterId={cluster.id}
+                                            clusterName={cluster.cluster_name}
+                                            serverURL={cluster.server_url}
+                                            reload={initialize}
+                                            prometheusURL={cluster.prometheus_url}
+                                            proxyUrl={cluster.proxyUrl}
+                                            toConnectWithSSHTunnel={cluster.toConnectWithSSHTunnel}
+                                            isProd={cluster.isProd}
+                                            installationId={cluster.installationId}
+                                            category={cluster.category}
+                                            insecureSkipTlsVerify={cluster.insecureSkipTlsVerify}
+                                        />
+                                    )}
+                                </div>
+                            </Drawer>
+                        )
+                    }
+
+                    return (
+                        <VirtualClusterForm
+                            id={+cluster.id}
+                            clusterName={cluster.cluster_name}
+                            handleModalClose={handleRedirectToClusterList}
+                            reload={initialize}
+                            category={cluster.category}
+                        />
+                    )
+                }}
+            />
+
+            {PodSpreadModal && (
+                <Route
+                    path={`${URLS.GLOBAL_CONFIG_CLUSTER}/:clusterName/${URLS.POD_SPREAD}`}
+                    render={(props) => {
+                        const { clusterName } = props.match.params
+                        const foundCluster: ClusterMetadataTypes | { id?: number } =
+                            clusters.find((c) => c.cluster_name === clusterName) || {}
+                        const { id: clusterId } = foundCluster
+
+                        return <PodSpreadModal clusterId={clusterId} handleClose={handleRedirectToClusterList} />
+                    }}
+                />
+            )}
+
+            {HibernationRulesModal && (
+                <Route
+                    path={`${URLS.GLOBAL_CONFIG_CLUSTER}/:clusterName/${URLS.HIBERNATION_RULES}`}
+                    render={(props) => {
+                        const { clusterName } = props.match.params
+                        const foundCluster: ClusterMetadataTypes | { id?: number } =
+                            clusters.find((c) => c.cluster_name === clusterName) || {}
+                        const { id: clusterId } = foundCluster
+
+                        return <HibernationRulesModal clusterId={clusterId} handleClose={handleRedirectToClusterList} />
+                    }}
+                />
+            )}
+
             <Route
                 path={`${URLS.GLOBAL_CONFIG_CLUSTER}/:clusterName${URLS.CREATE_ENVIRONMENT}`}
                 render={(props) => {