Merge pull request #267 from devtron-labs/release-candidate-v0.17.0

feat: Release candidate v0.17.0

Author: vivek-devtron

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "0.2.6-patch-1",
+    "version": "0.2.17",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",
@@ -23,12 +23,12 @@
     ],
     "scripts": {
         "prepare": "node -e \"try { require('husky').install() } catch (e) {}\"",
-        "lint": "tsc --noEmit && NODE_OPTIONS=--max_old_space_size=8192 eslint 'src/**/*.{js,jsx,ts,tsx}' --max-warnings 0",
+        "lint": "tsc --noEmit && NODE_OPTIONS=--max_old_space_size=3072 eslint 'src/**/*.{js,jsx,ts,tsx}' --max-warnings 0",
         "lint-fix": "eslint 'src/**/*.{js,jsx,ts,tsx}' --fix",
         "test": "exit 0",
-        "dev": "NODE_OPTIONS=--max_old_space_size=8192 vite",
-        "build": "NODE_OPTIONS=--max_old_space_size=8192 vite build --sourcemap",
-        "build-watch": "NODE_OPTIONS=--max_old_space_size=8192 vite build --sourcemap --watch",
+        "dev": "NODE_OPTIONS=--max_old_space_size=3072 vite",
+        "build": "NODE_OPTIONS=--max_old_space_size=3072 vite build --sourcemap",
+        "build-watch": "NODE_OPTIONS=--max_old_space_size=3072 vite build --sourcemap --watch",
         "build-lib": "vite build",
         "preview": "vite preview",
         "lint-staged": "lint-staged"

package.json

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { TIMELINE_STATUS } from "../../Shared/constants"
+import { TIMELINE_STATUS } from '../../Shared/constants'
 
 export const triggerStatus = (triggerDetailStatus: string): string => {
     const triggerStatus = triggerDetailStatus?.toUpperCase()

src/Assets/Icon/ic-aborted.svg

@@ -21,14 +21,12 @@ import ReactGA from 'react-ga4'
 import * as monaco from 'monaco-editor/esm/vs/editor/editor.api'
 import { configureMonacoYaml } from 'monaco-yaml'
 
-import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker'
 import { ReactComponent as Info } from '../../Assets/Icon/ic-info-filled.svg'
 import { ReactComponent as ErrorIcon } from '../../Assets/Icon/ic-error-exclamation.svg'
 import { ReactComponent as WarningIcon } from '../../Assets/Icon/ic-warning.svg'
 import './codeEditor.scss'
 import 'monaco-editor'
 
-import YamlWorker from '../../yaml.worker.js?worker'
 import { YAMLStringify, cleanKubeManifest, useJsonYaml } from '../Helper'
 import { useWindowSize } from '../Hooks'
 import Select from '../Select/Select'
@@ -46,15 +44,6 @@ import {
 import { CodeEditorReducer, initialState } from './CodeEditor.reducer'
 import { MODES } from '../Constants'
 
-self.MonacoEnvironment = {
-    getWorker(_, label) {
-        if (label === MODES.YAML) {
-            return new YamlWorker()
-        }
-        return new editorWorker()
-    },
-}
-
 const CodeEditorContext = React.createContext(null)
 
 function useCodeEditorContext() {
@@ -70,7 +59,7 @@ function useCodeEditorContext() {
  * see: https://github.com/react-monaco-editor/react-monaco-editor/pull/955
  * */
 const _onChange = {
-    onChange: null
+    onChange: null,
 }
 
 const CodeEditor: React.FC<CodeEditorInterface> & CodeEditorComposition = React.memo(
@@ -98,7 +87,7 @@ const CodeEditor: React.FC<CodeEditorInterface> & CodeEditorComposition = React.
         cleanData = false,
         onBlur,
         onFocus,
-        adjustEditorHeightToContent,
+        adjustEditorHeightToContent = false,
     }) => {
         if (cleanData) {
             value = cleanKubeManifest(value)
@@ -125,6 +114,18 @@ const CodeEditor: React.FC<CodeEditorInterface> & CodeEditorComposition = React.
             },
         })
 
+        monaco.editor.defineTheme(CodeEditorThemesKeys.networkStatusInterface, {
+            base: 'vs-dark',
+            inherit: true,
+            rules: [
+                // @ts-ignore
+                { background: '#1A1A1A' },
+            ],
+            colors: {
+                'editor.background': '#1A1A1A',
+            },
+        })
+
         monaco.editor.defineTheme(CodeEditorThemesKeys.deleteDraft, {
             base: 'vs',
             inherit: true,

src/Assets/Icon/ic-diff-file-updated.svg

@@ -25,7 +25,7 @@
         overflow: hidden;
     }
 
-    .radio-group input[type=checkbox]:checked+.radio__item-label {
+    .radio-group input[type='checkbox']:checked + .radio__item-label {
         background: var(--N700);
         border-radius: 0;
         color: var(--white);
@@ -165,3 +165,9 @@
 .monaco-editor-hover {
     margin-left: 40px;
 }
+
+.monaco-scrollable-element {
+    & > .visible {
+        z-index: 9;
+    }
+}

src/Assets/Icon/ic-expand.svg

@@ -22,7 +22,7 @@ export interface InformationBarProps {
     children?: React.ReactNode
 }
 
-export interface CodeEditorInterface {
+interface CodeEditorBaseInterface {
     value?: string
     lineDecorationsWidth?: number
     responseType?: string
@@ -36,7 +36,6 @@ export interface CodeEditorInterface {
     readOnly?: boolean
     noParsing?: boolean
     inline?: boolean
-    height?: number | string
     shebang?: string | JSX.Element
     diffView?: boolean
     loading?: boolean
@@ -48,9 +47,20 @@ export interface CodeEditorInterface {
     isKubernetes?: boolean
     cleanData?: boolean
     chartVersion?: any
-    adjustEditorHeightToContent?: boolean
 }
 
+export type CodeEditorInterface = CodeEditorBaseInterface &
+    (
+        | {
+              adjustEditorHeightToContent?: boolean
+              height?: never
+          }
+        | {
+              adjustEditorHeightToContent?: never
+              height?: number | string
+          }
+    )
+
 export interface CodeEditorHeaderInterface {
     children?: any
     className?: string
@@ -85,6 +95,7 @@ export enum CodeEditorThemesKeys {
     deleteDraft = 'delete-draft',
     unpublished = 'unpublished',
     vs = 'vs',
+    networkStatusInterface = 'network-status-interface',
 }
 
 export interface CodeEditorInitialValueType {

src/Assets/Icon/ic-filter-applied.svg

@@ -63,6 +63,7 @@ export const URLS = {
     DEPLOYMENT_HISTORY_CONFIGURATIONS: '/configuration',
     GLOBAL_CONFIG_SCOPED_VARIABLES: '/global-config/scoped-variables',
     GLOBAL_CONFIG_DEPLOYMENT_CHARTS_LIST: '/global-config/deployment-charts',
+    NETWORK_STATUS_INTERFACE: '/network-status-interface',
 }
 
 export const ROUTES = {
@@ -97,12 +98,16 @@ export const ROUTES = {
     CONFIG_CD_PIPELINE: 'config/cd-pipeline',
     MODULE_CONFIGURED: 'module/config',
     RESOURCE_HISTORY_DEPLOYMENT: 'resource/history/deployment',
+    ATTRIBUTES: 'attributes',
+    ATTRIBUTES_CREATE: 'attributes/create',
+    ATTRIBUTES_UPDATE: 'attributes/update',
     APP_LIST_MIN: 'app/min',
     CLUSTER_LIST_MIN: 'cluster/autocomplete',
     PLUGIN_GLOBAL_LIST_DETAIL_V2: 'plugin/global/list/detail/v2',
     PLUGIN_GLOBAL_LIST_V2: 'plugin/global/list/v2',
     PLUGIN_GLOBAL_LIST_TAGS: 'plugin/global/list/tags',
     DEPLOYMENT_CHARTS_LIST: 'deployment/template/fetch',
+    CONFIG_DATA: 'config/data',
 }
 
 export enum KEY_VALUE {
@@ -523,3 +528,11 @@ export const DATE_TIME_FORMATS = {
     DD_MMM_YYYY_HH_MM: 'DD MMM YYYY, hh:mm',
     DD_MMM_YYYY: 'DD MMM YYYY',
 }
+
+export const VULNERABILITIES_SORT_PRIORITY = {
+    critical: 1,
+    high: 2,
+    medium: 3,
+    low: 4,
+    unknown: 5,
+}

src/Assets/Icon/ic-filter.svg

@@ -135,7 +135,7 @@ export const CustomInput = ({
 
             {getInputError()}
             {helperText && (
-                 <div className="flex left top dc__gap-4 fs-11 lh-16 cn-7">
+                 <div className="flex left top dc__gap-4 fs-11 lh-16 cn-7 mt-4">
                  <Info className="icon-dim-16" />
                  <div>{helperText}</div>
                 </div>

src/Assets/Icon/ic-lines.svg

@@ -30,6 +30,7 @@ export const TagDetails = ({
     removeTag,
     tabIndex = 1,
     suggestedTagsOptions,
+    hidePropagateTag,
 }: TagDetailType) => {
     const keyRef = useRef(null)
     const valueRef = useRef(null)
@@ -56,13 +57,15 @@ export const TagDetails = ({
     }
     return (
         <div className="flexbox mb-8">
-            <div
-                className={`dc__border h-30 pl-4 pr-4 br-4 mr-8 pointer ${tagData.propagate ? 'bcn-7' : ''} ${tagData.key.startsWith('devtron.ai/') ? 'cursor-not-allowed bcn-1' : ''}`}
-                onClick={propagateTagToResource}
-                data-testid={`propagate-tag-${index}`}
-            >
-                <InjectTag className={`icon-dim-20 mt-4 ${tagData.propagate ? 'scn-0' : ''}`} />
-            </div>
+            {!hidePropagateTag && (
+                <div
+                    className={`dc__border h-30 pl-4 pr-4 br-4 mr-8 pointer ${tagData.propagate ? 'bcn-7' : ''} ${tagData.key.startsWith('devtron.ai/') ? 'cursor-not-allowed bcn-1' : ''}`}
+                    onClick={propagateTagToResource}
+                    data-testid={`propagate-tag-${index}`}
+                >
+                    <InjectTag className={`icon-dim-20 mt-4 ${tagData.propagate ? 'scn-0' : ''}`} />
+                </div>
+            )}
             <TagLabelValueSelector
                 selectedTagIndex={index}
                 tagData={tagData}