Merge branch 'develop' of https://github.com/devtron-labs/dashboard into feat/security-summary-card

Author: arunjaindev

.storybook/preview.tsx

@@ -12,6 +12,19 @@ const preview: Preview = {
                 date: /Date$/i,
             },
         },
+        backgrounds: {
+            values: [
+                {
+                    name: 'Light',
+                    value: 'var(--N0)',
+                },
+                {
+                    name: 'Dark',
+                    value: 'var(--N700)',
+                },
+            ],
+            default: 'Light',
+        },
     },
     tags: ['autodocs'],
     decorators: (Story) => (

package.json

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

src/App.tsx

@@ -16,7 +16,7 @@
 
 import { lazy, Suspense, useRef, useState, useEffect } from 'react'
 import { Route, Switch, Redirect, useHistory, useLocation } from 'react-router-dom'
-import './css/application.scss';
+import './css/application.scss'
 import {
     showError,
     BreadcrumbStore,
@@ -26,9 +26,10 @@ import {
     useUserEmail,
     URLS as CommonURLS,
     ToastManager,
-    ToastVariantType
+    ToastVariantType,
 } from '@devtron-labs/devtron-fe-common-lib'
 import { ReactComponent as ICSparkles } from '@Icons/ic-sparkles.svg'
+import { ReactComponent as ICArrowClockwise } from '@Icons/ic-arrow-clockwise.svg'
 import { useRegisterSW } from 'virtual:pwa-register/react'
 import {
     useOnline,
@@ -78,19 +79,22 @@ export default function App() {
     useEffect(() => {
         if (didMountRef.current) {
             if (!isOnline) {
+                onlineToast(
+                    {
+                        variant: ToastVariantType.error,
+                        title: 'You are offline!',
+                        description: 'You are not seeing real-time data and any changes you make will not be saved.',
+                    },
+                    {
+                        autoClose: false,
+                    },
+                )
+            } else {
                 onlineToast({
-                    variant: ToastVariantType.error,
-                    title: 'You are offline!',
-                    description: 'You are not seeing real-time data and any changes you make will not be saved.',
-                }, {
-                    autoClose: false
+                    variant: ToastVariantType.success,
+                    title: 'Connected!',
+                    description: "You're back online.",
                 })
-            } else {
-                 onlineToast({
-                     variant: ToastVariantType.success,
-                     title: 'Connected!',
-                     description: "You're back online.",
-                 })
             }
         } else {
             didMountRef.current = true
@@ -245,6 +249,7 @@ export default function App() {
                     text: 'Reload',
                     dataTestId: 'reload-btn',
                     onClick: update,
+                    startIcon: <ICArrowClockwise />,
                 },
                 icon: <ICSparkles />,
                 progressBarBg: UPDATE_AVAILABLE_TOAST_PROGRESS_BG,
@@ -281,6 +286,7 @@ export default function App() {
                     text: 'Reload',
                     dataTestId: 'reload-btn',
                     onClick: reloadLocation,
+                    startIcon: <ICArrowClockwise />,
                 },
                 icon: <ICSparkles />,
                 progressBarBg: UPDATE_AVAILABLE_TOAST_PROGRESS_BG,

src/Pages/Applications/DevtronApps/Details/AppConfigurations/AppConfig.types.ts

@@ -241,6 +241,7 @@ export interface ExtendedCollapsibleListItem
     configState: ResourceConfigState
 }
 
+// DEPLOYMENT CONFIG COMPARE INTERFACES & TYPES ------- START
 export interface DeploymentConfigParams {
     appId: string
     envId: string
@@ -276,6 +277,8 @@ export enum AppEnvDeploymentConfigQueryParams {
     COMPARE_WITH_IDENTIFIER_ID = 'compareWithIdentifierId',
     COMPARE_WITH_PIPELINE_ID = 'compareWithPipelineId',
     CHART_REF_ID = 'chartRefId',
+    MANIFEST_CHART_REF_ID = 'manifestChartRefId',
+    COMPARE_WITH_MANIFEST_CHART_REF_ID = 'compareWithManifestChartRefId',
 }
 
 export interface AppEnvDeploymentConfigQueryParamsType {
@@ -287,4 +290,29 @@ export interface AppEnvDeploymentConfigQueryParamsType {
     compareWithIdentifierId?: number
     compareWithPipelineId?: number
     chartRefId?: number
+    manifestChartRefId?: number
+    compareWithManifestChartRefId?: number
 }
+
+export type GetConfigDiffDataProps = Required<
+    Pick<DeploymentConfigCompareProps, 'appName' | 'envName' | 'type'> & {
+        configType: AppEnvDeploymentConfigType
+        compareName: string
+        identifierId: number
+        pipelineId: number
+    }
+>
+
+export type GetDeploymentTemplateDataProps = Omit<GetConfigDiffDataProps, 'identifierId' | 'pipelineId'>
+
+export type GetManifestDataProps = Pick<DeploymentConfigCompareProps, 'type' | 'environments'> & {
+    appId: string
+    envId: string
+    configType: AppEnvDeploymentConfigType
+    compareName: string
+    values: string
+    identifierId: number
+    pipelineId: number
+    manifestChartRefId: number
+}
+// DEPLOYMENT CONFIG COMPARE INTERFACES & TYPES ------- END

src/Pages/Applications/DevtronApps/Details/AppConfigurations/MainContent/AppComposeRouter.tsx

@@ -302,7 +302,10 @@ const AppComposeRouter = () => {
                                   const envOverridePath = match.params.envId
                                       ? `/${URLS.APP_ENV_OVERRIDE_CONFIG}/${match.params.envId}`
                                       : ''
-                                  const resourceTypePath = `/${match.params.resourceType}`
+                                  // Set the resourceTypePath based on the resourceType from the URL parameters.
+                                  // If the resourceType is 'Manifest', use 'deployment-template' as the back URL.
+                                  // Otherwise, use the actual resourceType from the URL, which could be 'deployment-template', 'configmap', or 'secrets'.
+                                  const resourceTypePath = `/${match.params.resourceType === EnvResourceType.Manifest ? EnvResourceType.DeploymentTemplate : match.params.resourceType}`
                                   const resourceNamePath = match.params.resourceName
                                       ? `/${match.params.resourceName}`
                                       : ''