From 327e056a2d09a579639c62ed3d0df4f49e86922f Mon Sep 17 00:00:00 2001 From: Mahmoud Mortada Date: Fri, 7 Jul 2023 12:23:21 +0300 Subject: [PATCH 01/26] fix: cluster left menu --- package-lock.json | 8 ++-- package.json | 2 +- .../organisms/DashboardPane/DashboardPane.tsx | 9 ++++ .../PaneManager/PaneManagerLeftMenu.tsx | 6 +++ .../organisms/PaneManager/activities.tsx | 45 +++++++++++++++++-- src/shared/models/ui.ts | 3 ++ 6 files changed, 65 insertions(+), 8 deletions(-) diff --git a/package-lock.json b/package-lock.json index 92124b7cbb..0fa24ff943 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,7 +13,7 @@ "@dnd-kit/core": "6.0.8", "@dnd-kit/sortable": "7.0.2", "@kubernetes/client-node": "0.18.1", - "@monokle/components": "^1.6.1", + "@monokle/components": "1.6.4", "@monokle/validation": "0.23.3", "@open-policy-agent/opa-wasm": "1.8.0", "@reduxjs/toolkit": "1.9.5", @@ -5016,9 +5016,9 @@ } }, "node_modules/@monokle/components": { - "version": "1.6.1", - "resolved": "https://registry.npmjs.org/@monokle/components/-/components-1.6.1.tgz", - "integrity": "sha512-5oPiIwwBjECTFvPXjKR/YdHzb+wFJkeSBMVaJ0jnF5VD3O/oh/uwin0e5x/XUYlqzNeirhNCFlj6X1hjYtMaXw==", + "version": "1.6.4", + "resolved": "https://registry.npmjs.org/@monokle/components/-/components-1.6.4.tgz", + "integrity": "sha512-OmfVvUQKHXfAS4Pv8TzeklOcZWjYcLh2DlVbgIK+oyuELGXhMAZj47r/xz7JftJ1KuZ2Z0W50y59GEtmT+RdCA==", "dependencies": { "react-fast-compare": "^3.2.1" }, diff --git a/package.json b/package.json index 92c3ddc2f3..62c67fad53 100644 --- a/package.json +++ b/package.json @@ -100,7 +100,7 @@ "@dnd-kit/core": "6.0.8", "@dnd-kit/sortable": "7.0.2", "@kubernetes/client-node": "0.18.1", - "@monokle/components": "^1.6.1", + "@monokle/components": "1.6.4", "@monokle/validation": "0.23.3", "@open-policy-agent/opa-wasm": "1.8.0", "@reduxjs/toolkit": "1.9.5", diff --git a/src/components/organisms/DashboardPane/DashboardPane.tsx b/src/components/organisms/DashboardPane/DashboardPane.tsx index 1c9017dd60..17a4bb9912 100644 --- a/src/components/organisms/DashboardPane/DashboardPane.tsx +++ b/src/components/organisms/DashboardPane/DashboardPane.tsx @@ -1,3 +1,5 @@ +import {useEffect} from 'react'; + import {setDashboardActiveAccordion} from '@redux/dashboard'; import {useAppDispatch, useAppSelector} from '@redux/hooks'; @@ -13,6 +15,13 @@ const accordionsKeys = ['cluster-resources', 'helm-releases', 'images'] as Dashb const DashboardPane = () => { const dispatch = useAppDispatch(); const activeKey = useAppSelector(state => state.dashboard.ui.activeAccordion); + const leftMenuSelection = useAppSelector(state => state.ui.leftMenu.selection); + + useEffect(() => { + if (leftMenuSelection === 'helm-releases') { + dispatch(setDashboardActiveAccordion('helm-releases')); + } + }, [dispatch, leftMenuSelection]); return ( diff --git a/src/components/organisms/PaneManager/PaneManagerLeftMenu.tsx b/src/components/organisms/PaneManager/PaneManagerLeftMenu.tsx index 1e62f0ddf8..a31aa77cbd 100644 --- a/src/components/organisms/PaneManager/PaneManagerLeftMenu.tsx +++ b/src/components/organisms/PaneManager/PaneManagerLeftMenu.tsx @@ -3,6 +3,7 @@ import {useMemo} from 'react'; import {activeProjectSelector} from '@redux/appConfig'; import {useAppDispatch, useAppSelector} from '@redux/hooks'; import {setLeftBottomMenuSelection, setLeftMenuIsActive, setLeftMenuSelection} from '@redux/reducers/ui'; +import {stopClusterConnection} from '@redux/thunks/cluster'; import {ActivityBar} from '@monokle/components'; import {Colors} from '@shared/styles'; @@ -40,6 +41,11 @@ const PaneManagerLeftMenu: React.FC = () => { return; } + if (activityName === 'close') { + dispatch(stopClusterConnection()); + dispatch(setLeftMenuSelection('dashboard')); + } + dispatch(setLeftMenuSelection(activityName)); trackEvent('left-menu/activity-changed', {activity: activityName}); }} diff --git a/src/components/organisms/PaneManager/activities.tsx b/src/components/organisms/PaneManager/activities.tsx index bf75dcac39..e1370dd726 100644 --- a/src/components/organisms/PaneManager/activities.tsx +++ b/src/components/organisms/PaneManager/activities.tsx @@ -1,5 +1,5 @@ /* eslint-disable react-hooks/rules-of-hooks */ -import {SettingOutlined} from '@ant-design/icons'; +import {CloseOutlined, SettingOutlined} from '@ant-design/icons'; import {size} from 'lodash'; @@ -50,7 +50,7 @@ export const activities: ActivityType[] = [ const problemsCount = useValidationSelector(state => size(problemsSelector(state))); return {count: problemsCount, size: 'small'}; }, - isVisible: () => Boolean(useAppSelector(activeProjectSelector)) || Boolean(useAppSelector(isInClusterModeSelector)), + isVisible: () => Boolean(useAppSelector(activeProjectSelector)), }, { type: 'fullscreen', @@ -59,6 +59,7 @@ export const activities: ActivityType[] = [ icon: () => , component: , useBadge: () => undefined, + isVisible: () => Boolean(useAppSelector(isInClusterModeSelector)) === false, }, { type: 'panel', @@ -85,14 +86,52 @@ export const activities: ActivityType[] = [ component: , useBadge: () => undefined, }, + { + type: 'panel', + name: 'cluster-validation', + tooltip: 'View validation errors', + icon: () => , + component: , + useBadge: () => { + const problemsCount = useValidationSelector(state => size(problemsSelector(state))); + return {count: problemsCount, size: 'small'}; + }, + isVisible: () => Boolean(useAppSelector(isInClusterModeSelector)), + }, + { + type: 'panel', + name: 'helm-releases', + tooltip: 'View helm releases', + icon: () => , + component: , + useBadge: () => undefined, + isVisible: () => Boolean(useAppSelector(isInClusterModeSelector)), + }, { type: 'fullscreen', name: 'settings', tooltip: , - icon: () => , + icon: () => { + const isClusterConnected = useAppSelector(isInClusterModeSelector); + + return isClusterConnected ? ( + + ) : ( + + ); + }, component: , useBadge: () => undefined, }, + { + type: 'fullscreen', + name: 'close', + tooltip: 'Close', + icon: () => , + component: <>, + useBadge: () => undefined, + isVisible: () => useAppSelector(isInClusterModeSelector), + }, ]; export const extraActivities: ActivityType[] = [ diff --git a/src/shared/models/ui.ts b/src/shared/models/ui.ts index 768bc9b4f0..0c9edbbf7f 100644 --- a/src/shared/models/ui.ts +++ b/src/shared/models/ui.ts @@ -70,6 +70,9 @@ export const LeftMenuSelectionOptions = [ 'settings', 'dashboard', 'helm', + 'helm-releases', + 'cluster-validation', + 'close', ] as const; type LeftMenuSelectionType = (typeof LeftMenuSelectionOptions)[number]; From de270147c6e39fcfe2d199a6ca59d3ca4310e74a Mon Sep 17 00:00:00 2001 From: Mahmoud Mortada Date: Fri, 7 Jul 2023 12:28:45 +0300 Subject: [PATCH 02/26] fix: hide project left icons on connection --- src/components/organisms/PaneManager/activities.tsx | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/src/components/organisms/PaneManager/activities.tsx b/src/components/organisms/PaneManager/activities.tsx index e1370dd726..34f76061f2 100644 --- a/src/components/organisms/PaneManager/activities.tsx +++ b/src/components/organisms/PaneManager/activities.tsx @@ -29,7 +29,8 @@ export const activities: ActivityType[] = [ icon: () => , component: , useBadge: () => undefined, - isVisible: () => Boolean(useAppSelector(activeProjectSelector)), + isVisible: () => + Boolean(useAppSelector(activeProjectSelector)) && Boolean(useAppSelector(isInClusterModeSelector)) === false, }, { type: 'fullscreen', @@ -38,7 +39,8 @@ export const activities: ActivityType[] = [ icon: () => , component: , useBadge: () => undefined, - isVisible: () => Boolean(useAppSelector(activeProjectSelector)), + isVisible: () => + Boolean(useAppSelector(activeProjectSelector)) && Boolean(useAppSelector(isInClusterModeSelector)) === false, }, { type: 'panel', @@ -50,7 +52,8 @@ export const activities: ActivityType[] = [ const problemsCount = useValidationSelector(state => size(problemsSelector(state))); return {count: problemsCount, size: 'small'}; }, - isVisible: () => Boolean(useAppSelector(activeProjectSelector)), + isVisible: () => + Boolean(useAppSelector(activeProjectSelector)) && Boolean(useAppSelector(isInClusterModeSelector)) === false, }, { type: 'fullscreen', From 43547b96dd0fce10abbd05a277ea7e775a10954b Mon Sep 17 00:00:00 2001 From: Mahmoud Mortada Date: Fri, 7 Jul 2023 12:32:59 +0300 Subject: [PATCH 03/26] fix: update connection icon --- .../organisms/PageHeader/ClusterControl/ContextSelect.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/organisms/PageHeader/ClusterControl/ContextSelect.tsx b/src/components/organisms/PageHeader/ClusterControl/ContextSelect.tsx index 8e10cde075..398138bde0 100644 --- a/src/components/organisms/PageHeader/ClusterControl/ContextSelect.tsx +++ b/src/components/organisms/PageHeader/ClusterControl/ContextSelect.tsx @@ -40,7 +40,7 @@ export function ContextSelect() { >
} + icon={} value={kubeconfig.currentContext} />
From fd4b486af2b668c9ab2eee7b542698917e05c7f0 Mon Sep 17 00:00:00 2001 From: Mahmoud Mortada Date: Fri, 7 Jul 2023 12:36:42 +0300 Subject: [PATCH 04/26] fix: reset icon --- .../organisms/PageHeader/ClusterControl/ContextSelect.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/organisms/PageHeader/ClusterControl/ContextSelect.tsx b/src/components/organisms/PageHeader/ClusterControl/ContextSelect.tsx index 398138bde0..8e10cde075 100644 --- a/src/components/organisms/PageHeader/ClusterControl/ContextSelect.tsx +++ b/src/components/organisms/PageHeader/ClusterControl/ContextSelect.tsx @@ -40,7 +40,7 @@ export function ContextSelect() { >
} + icon={} value={kubeconfig.currentContext} />
From b62a0ec27d3febd3c60b17983657d5e73a9e3d1c Mon Sep 17 00:00:00 2001 From: Mahmoud Mortada Date: Fri, 7 Jul 2023 14:33:42 +0300 Subject: [PATCH 05/26] fix: add cluster-connected icon --- package-lock.json | 8 ++++---- package.json | 2 +- .../organisms/PageHeader/ClusterControl/ContextSelect.tsx | 8 +++++++- 3 files changed, 12 insertions(+), 6 deletions(-) diff --git a/package-lock.json b/package-lock.json index 0fa24ff943..6fb081211c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,7 +13,7 @@ "@dnd-kit/core": "6.0.8", "@dnd-kit/sortable": "7.0.2", "@kubernetes/client-node": "0.18.1", - "@monokle/components": "1.6.4", + "@monokle/components": "1.6.5", "@monokle/validation": "0.23.3", "@open-policy-agent/opa-wasm": "1.8.0", "@reduxjs/toolkit": "1.9.5", @@ -5016,9 +5016,9 @@ } }, "node_modules/@monokle/components": { - "version": "1.6.4", - "resolved": "https://registry.npmjs.org/@monokle/components/-/components-1.6.4.tgz", - "integrity": "sha512-OmfVvUQKHXfAS4Pv8TzeklOcZWjYcLh2DlVbgIK+oyuELGXhMAZj47r/xz7JftJ1KuZ2Z0W50y59GEtmT+RdCA==", + "version": "1.6.5", + "resolved": "https://registry.npmjs.org/@monokle/components/-/components-1.6.5.tgz", + "integrity": "sha512-+eKkTljoQFt1wLbAVt9QxpJGSZqfNi9pAhwXwDkIc2HH1FvRafzxsdqsiBMVyjKHOkU61osTXn08SkHvBN4bSg==", "dependencies": { "react-fast-compare": "^3.2.1" }, diff --git a/package.json b/package.json index 62c67fad53..ae2cd391f4 100644 --- a/package.json +++ b/package.json @@ -100,7 +100,7 @@ "@dnd-kit/core": "6.0.8", "@dnd-kit/sortable": "7.0.2", "@kubernetes/client-node": "0.18.1", - "@monokle/components": "1.6.4", + "@monokle/components": "1.6.5", "@monokle/validation": "0.23.3", "@open-policy-agent/opa-wasm": "1.8.0", "@reduxjs/toolkit": "1.9.5", diff --git a/src/components/organisms/PageHeader/ClusterControl/ContextSelect.tsx b/src/components/organisms/PageHeader/ClusterControl/ContextSelect.tsx index 8e10cde075..ecdcd95550 100644 --- a/src/components/organisms/PageHeader/ClusterControl/ContextSelect.tsx +++ b/src/components/organisms/PageHeader/ClusterControl/ContextSelect.tsx @@ -18,6 +18,7 @@ import {ClusterSelectionTable} from '../ClusterSelectionTable'; export function ContextSelect() { const kubeconfig = useAppSelector(selectKubeconfig); + const isInClusterMode = useAppSelector(isInClusterModeSelector); if (!kubeconfig?.isValid) { return ; @@ -40,7 +41,12 @@ export function ContextSelect() { >
} + icon={ + + } value={kubeconfig.currentContext} />
From 40a0a4aa26c7995bc140241048c4bc7a54880416 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Fri, 7 Jul 2023 22:34:09 +0000 Subject: [PATCH 06/26] chore(deps-dev): bump stylelint from 15.6.2 to 15.10.1 Bumps [stylelint](https://github.com/stylelint/stylelint) from 15.6.2 to 15.10.1. - [Release notes](https://github.com/stylelint/stylelint/releases) - [Changelog](https://github.com/stylelint/stylelint/blob/main/CHANGELOG.md) - [Commits](https://github.com/stylelint/stylelint/compare/15.6.2...15.10.1) --- updated-dependencies: - dependency-name: stylelint dependency-type: direct:development ... Signed-off-by: dependabot[bot] --- package-lock.json | 246 ++++++++++++++++++++++++++++++++++++---------- package.json | 2 +- 2 files changed, 194 insertions(+), 54 deletions(-) diff --git a/package-lock.json b/package-lock.json index 4ae46f4bf1..d6d37a54f3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -156,7 +156,7 @@ "react-app-alias-ex": "2.1.0", "react-scripts": "5.0.1", "standard-version": "9.5.0", - "stylelint": "15.6.2", + "stylelint": "15.10.1", "stylelint-config-recommended": "12.0.0", "stylelint-config-standard": "33.0.0", "stylelint-config-styled-components": "0.1.1", @@ -3244,9 +3244,9 @@ } }, "node_modules/@csstools/css-parser-algorithms": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.2.0.tgz", - "integrity": "sha512-9BoQ/jSrPq4vv3b9jjLW+PNNv56KlDH5JMx5yASSNrCtvq70FCNZUjXRvbCeR9hYj9ZyhURtqpU/RFIgg6kiOw==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.3.0.tgz", + "integrity": "sha512-dTKSIHHWc0zPvcS5cqGP+/TPFUJB0ekJ9dGKvMAFoNuBFhDPBt9OMGNZiIA5vTiNdGHHBeScYPXIGBMnVOahsA==", "dev": true, "funding": [ { @@ -3279,9 +3279,9 @@ } }, "node_modules/@csstools/media-query-list-parser": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.0.tgz", - "integrity": "sha512-MXkR+TeaS2q9IkpyO6jVCdtA/bfpABJxIrfkLswThFN8EZZgI2RfAHhm6sDNDuYV25d5+b8Lj1fpTccIcSLPsQ==", + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.2.tgz", + "integrity": "sha512-M8cFGGwl866o6++vIY7j1AKuq9v57cf+dGepScwCcbut9ypJNr4Cj+LLTWligYUZ0uyhEoJDKt5lvyBfh2L3ZQ==", "dev": true, "funding": [ { @@ -3297,7 +3297,7 @@ "node": "^14 || ^16 || >=18" }, "peerDependencies": { - "@csstools/css-parser-algorithms": "^2.1.1", + "@csstools/css-parser-algorithms": "^2.3.0", "@csstools/css-tokenizer": "^2.1.1" } }, @@ -13971,9 +13971,9 @@ "dev": true }, "node_modules/fast-glob": { - "version": "3.2.12", - "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.12.tgz", - "integrity": "sha512-DVj4CQIYYow0BlaelwK1pHl5n5cRSJfM60UA0zK891sVInoPri2Ekj7+e1CT3/3qxXenpI+nBBmQAcJPJgaj4w==", + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.0.tgz", + "integrity": "sha512-ChDuvbOypPuNjO8yIDf36x7BlZX1smcUMTTcyoIjycexOxd6DFsKsg21qVBzEmr3G7fUKIRy2/psii+CIUt7FA==", "dev": true, "dependencies": { "@nodelib/fs.stat": "^2.0.2", @@ -23508,12 +23508,6 @@ "postcss": "^8.1.0" } }, - "node_modules/postcss-media-query-parser": { - "version": "0.2.3", - "resolved": "https://registry.npmjs.org/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz", - "integrity": "sha512-3sOlxmbKcSHMjlUXQZKQ06jOswE7oVkXPxmZdoB1r5l0q6gTFTQSHxNxOrCccElbW7dxNytifNEo8qidX2Vsig==", - "dev": true - }, "node_modules/postcss-merge-longhand": { "version": "5.1.7", "resolved": "https://registry.npmjs.org/postcss-merge-longhand/-/postcss-merge-longhand-5.1.7.tgz", @@ -27925,22 +27919,22 @@ } }, "node_modules/stylelint": { - "version": "15.6.2", - "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-15.6.2.tgz", - "integrity": "sha512-fjQWwcdUye4DU+0oIxNGwawIPC5DvG5kdObY5Sg4rc87untze3gC/5g/ikePqVjrAsBUZjwMN+pZsAYbDO6ArQ==", + "version": "15.10.1", + "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-15.10.1.tgz", + "integrity": "sha512-CYkzYrCFfA/gnOR+u9kJ1PpzwG10WLVnoxHDuBA/JiwGqdM9+yx9+ou6SE/y9YHtfv1mcLo06fdadHTOx4gBZQ==", "dev": true, "dependencies": { - "@csstools/css-parser-algorithms": "^2.1.1", + "@csstools/css-parser-algorithms": "^2.3.0", "@csstools/css-tokenizer": "^2.1.1", - "@csstools/media-query-list-parser": "^2.0.4", - "@csstools/selector-specificity": "^2.2.0", + "@csstools/media-query-list-parser": "^2.1.2", + "@csstools/selector-specificity": "^3.0.0", "balanced-match": "^2.0.0", "colord": "^2.9.3", - "cosmiconfig": "^8.1.3", + "cosmiconfig": "^8.2.0", "css-functions-list": "^3.1.0", "css-tree": "^2.3.1", "debug": "^4.3.4", - "fast-glob": "^3.2.12", + "fast-glob": "^3.3.0", "fastest-levenshtein": "^1.0.16", "file-entry-cache": "^6.0.1", "global-modules": "^2.0.0", @@ -27953,15 +27947,14 @@ "is-plain-object": "^5.0.0", "known-css-properties": "^0.27.0", "mathml-tag-names": "^2.1.3", - "meow": "^9.0.0", + "meow": "^10.1.5", "micromatch": "^4.0.5", "normalize-path": "^3.0.0", "picocolors": "^1.0.0", - "postcss": "^8.4.23", - "postcss-media-query-parser": "^0.2.3", + "postcss": "^8.4.24", "postcss-resolve-nested-selector": "^0.1.1", "postcss-safe-parser": "^6.0.0", - "postcss-selector-parser": "^6.0.12", + "postcss-selector-parser": "^6.0.13", "postcss-value-parser": "^4.2.0", "resolve-from": "^5.0.0", "string-width": "^4.2.3", @@ -27970,11 +27963,10 @@ "supports-hyperlinks": "^3.0.0", "svg-tags": "^1.0.0", "table": "^6.8.1", - "v8-compile-cache": "^2.3.0", "write-file-atomic": "^5.0.1" }, "bin": { - "stylelint": "bin/stylelint.js" + "stylelint": "bin/stylelint.mjs" }, "engines": { "node": "^14.13.1 || >=16.0.0" @@ -28055,12 +28047,64 @@ "node": ">=0.10.0" } }, + "node_modules/stylelint/node_modules/@csstools/selector-specificity": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/@csstools/selector-specificity/-/selector-specificity-3.0.0.tgz", + "integrity": "sha512-hBI9tfBtuPIi885ZsZ32IMEU/5nlZH/KOVYJCOh7gyMxaVLGmLedYqFN6Ui1LXkI8JlC8IsuC0rF0btcRZKd5g==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "engines": { + "node": "^14 || ^16 || >=18" + }, + "peerDependencies": { + "postcss-selector-parser": "^6.0.13" + } + }, "node_modules/stylelint/node_modules/balanced-match": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-2.0.0.tgz", "integrity": "sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==", "dev": true }, + "node_modules/stylelint/node_modules/camelcase": { + "version": "6.3.0", + "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-6.3.0.tgz", + "integrity": "sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==", + "dev": true, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/stylelint/node_modules/camelcase-keys": { + "version": "7.0.2", + "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-7.0.2.tgz", + "integrity": "sha512-Rjs1H+A9R+Ig+4E/9oyB66UC5Mj9Xq3N//vcLf2WzgdTi/3gUu3Z9KoqmlrEG4VuuLK8wJHofxzdQXz/knhiYg==", + "dev": true, + "dependencies": { + "camelcase": "^6.3.0", + "map-obj": "^4.1.0", + "quick-lru": "^5.1.1", + "type-fest": "^1.2.1" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/stylelint/node_modules/css-tree": { "version": "2.3.1", "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.3.1.tgz", @@ -28074,6 +28118,30 @@ "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0" } }, + "node_modules/stylelint/node_modules/decamelize": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-5.0.1.tgz", + "integrity": "sha512-VfxadyCECXgQlkoEAjeghAr5gY3Hf+IKjKb+X8tGVDtveCjN+USwprd2q3QXBR9T1+x2DG0XZF5/w+7HAtSaXA==", + "dev": true, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/stylelint/node_modules/indent-string": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-5.0.0.tgz", + "integrity": "sha512-m6FAo/spmsW2Ab2fU35JTYwtOKa2yAwXSwgjSv1TJzh4Mh7mC3lzAOVLBprb72XsTrgkEIsl7YrFNAiDiRhIGg==", + "dev": true, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/stylelint/node_modules/mdn-data": { "version": "2.0.30", "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.30.tgz", @@ -28081,26 +28149,77 @@ "dev": true }, "node_modules/stylelint/node_modules/meow": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/meow/-/meow-9.0.0.tgz", - "integrity": "sha512-+obSblOQmRhcyBt62furQqRAQpNyWXo8BuQ5bN7dG8wmwQ+vwHKp/rCFD4CrTP8CsDQD1sjoZ94K417XEUk8IQ==", + "version": "10.1.5", + "resolved": "https://registry.npmjs.org/meow/-/meow-10.1.5.tgz", + "integrity": "sha512-/d+PQ4GKmGvM9Bee/DPa8z3mXs/pkvJE2KEThngVNOqtmljC6K7NMPxtc2JeZYTmpWb9k/TmxjeL18ez3h7vCw==", "dev": true, "dependencies": { - "@types/minimist": "^1.2.0", - "camelcase-keys": "^6.2.2", - "decamelize": "^1.2.0", + "@types/minimist": "^1.2.2", + "camelcase-keys": "^7.0.0", + "decamelize": "^5.0.0", "decamelize-keys": "^1.1.0", "hard-rejection": "^2.1.0", "minimist-options": "4.1.0", - "normalize-package-data": "^3.0.0", - "read-pkg-up": "^7.0.1", - "redent": "^3.0.0", - "trim-newlines": "^3.0.0", - "type-fest": "^0.18.0", - "yargs-parser": "^20.2.3" + "normalize-package-data": "^3.0.2", + "read-pkg-up": "^8.0.0", + "redent": "^4.0.0", + "trim-newlines": "^4.0.2", + "type-fest": "^1.2.2", + "yargs-parser": "^20.2.9" }, "engines": { - "node": ">=10" + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/stylelint/node_modules/read-pkg": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-6.0.0.tgz", + "integrity": "sha512-X1Fu3dPuk/8ZLsMhEj5f4wFAF0DWoK7qhGJvgaijocXxBmSToKfbFtqbxMO7bVjNA1dmE5huAzjXj/ey86iw9Q==", + "dev": true, + "dependencies": { + "@types/normalize-package-data": "^2.4.0", + "normalize-package-data": "^3.0.2", + "parse-json": "^5.2.0", + "type-fest": "^1.0.1" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/stylelint/node_modules/read-pkg-up": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-8.0.0.tgz", + "integrity": "sha512-snVCqPczksT0HS2EC+SxUndvSzn6LRCwpfSvLrIfR5BKDQQZMaI6jPRC9dYvYFDRAuFEAnkwww8kBBNE/3VvzQ==", + "dev": true, + "dependencies": { + "find-up": "^5.0.0", + "read-pkg": "^6.0.0", + "type-fest": "^1.0.1" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/stylelint/node_modules/redent": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/redent/-/redent-4.0.0.tgz", + "integrity": "sha512-tYkDkVVtYkSVhuQ4zBgfvciymHaeuel+zFKXShfDnFP5SyVEP7qo70Rf1jTOTCx3vGNAbnEi/xFkcfQVMIBWag==", + "dev": true, + "dependencies": { + "indent-string": "^5.0.0", + "strip-indent": "^4.0.0" + }, + "engines": { + "node": ">=12" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" @@ -28118,10 +28237,37 @@ "url": "https://github.com/sponsors/isaacs" } }, + "node_modules/stylelint/node_modules/strip-indent": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-4.0.0.tgz", + "integrity": "sha512-mnVSV2l+Zv6BLpSD/8V87CW/y9EmmbYzGCIavsnsI6/nwn26DwffM/yztm30Z/I2DY9wdS3vXVCMnHDgZaVNoA==", + "dev": true, + "dependencies": { + "min-indent": "^1.0.1" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/stylelint/node_modules/trim-newlines": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-4.1.1.tgz", + "integrity": "sha512-jRKj0n0jXWo6kh62nA5TEh3+4igKDXLvzBJcPpiizP7oOolUrYIxmVBG9TOtHYFHoddUk6YvAkGeGoSVTXfQXQ==", + "dev": true, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/stylelint/node_modules/type-fest": { - "version": "0.18.1", - "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.18.1.tgz", - "integrity": "sha512-OIAYXk8+ISY+qTOwkHtKqzAuxchoMiD9Udx+FSGQDuiRR+PJKJHc2NJAXlbhkGwTt/4/nKZxELY1w3ReWOL8mw==", + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-1.4.0.tgz", + "integrity": "sha512-yGSza74xk0UG8k+pLh5oeoYirvIiWo5t0/o3zHHAO2tRDiZcxWP7fywNlXhqb6/r6sWvwi+RsyQMWhVLe4BVuA==", "dev": true, "engines": { "node": ">=10" @@ -29781,12 +29927,6 @@ "node": ">=6" } }, - "node_modules/v8-compile-cache": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz", - "integrity": "sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==", - "dev": true - }, "node_modules/v8-compile-cache-lib": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz", diff --git a/package.json b/package.json index 3e0abfe806..b20bc159c3 100644 --- a/package.json +++ b/package.json @@ -85,7 +85,7 @@ "react-app-alias-ex": "2.1.0", "react-scripts": "5.0.1", "standard-version": "9.5.0", - "stylelint": "15.6.2", + "stylelint": "15.10.1", "stylelint-config-recommended": "12.0.0", "stylelint-config-standard": "33.0.0", "stylelint-config-styled-components": "0.1.1", From e7c58d095efd3975f8d87c22322be7c0e9eefbd0 Mon Sep 17 00:00:00 2001 From: Mahmoud Mortada Date: Tue, 11 Jul 2023 14:44:59 +0300 Subject: [PATCH 07/26] fix: project summary overview --- .../organisms/ActionsPane/ActionsPane.tsx | 13 +- .../ProjectOverview/ProjectOverview.tsx | 192 ++++++++++++++++++ .../ActionsPane/ProjectOverview/index.ts | 1 + .../ActionsPane/ProjectOverview/styled.tsx | 155 ++++++++++++++ src/redux/selectors.tsx | 7 + 5 files changed, 365 insertions(+), 3 deletions(-) create mode 100644 src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx create mode 100644 src/components/organisms/ActionsPane/ProjectOverview/index.ts create mode 100644 src/components/organisms/ActionsPane/ProjectOverview/styled.tsx diff --git a/src/components/organisms/ActionsPane/ActionsPane.tsx b/src/components/organisms/ActionsPane/ActionsPane.tsx index 23047e26fc..da39a461c3 100644 --- a/src/components/organisms/ActionsPane/ActionsPane.tsx +++ b/src/components/organisms/ActionsPane/ActionsPane.tsx @@ -47,8 +47,6 @@ import { import {TabHeader} from '@atoms'; -import {MonacoPlaceholder} from '@components/molecules/MonacoPlaceholder/MonacoPlaceholder'; - import {usePaneHeight} from '@hooks/usePaneHeight'; import {useRefSelector, useSelectorWithRef} from '@utils/hooks'; @@ -67,6 +65,7 @@ import {openExternalResourceKindDocumentation} from '@shared/utils/shell'; import * as S from './ActionsPane.styled'; import ActionsPaneHeader from './ActionsPaneHeader'; +import {ProjectOverview} from './ProjectOverview'; // TODO: we should also check if the selectedFile entry has only one resource and if so, to set the selectedResource to be that for this component const ActionsPane: React.FC = () => { @@ -400,6 +399,14 @@ const ActionsPane: React.FC = () => { ] ); + if (isFolderLoading) { + return ; + } + + if (!selection) { + return ; + } + return ( { } /> ) : ( - !settings.hideEditorPlaceholder && (isFolderLoading ? : ) + !settings.hideEditorPlaceholder && (isFolderLoading ? : ) )} {isApplyModalVisible && ( diff --git a/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx b/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx new file mode 100644 index 0000000000..9f8f60f43f --- /dev/null +++ b/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx @@ -0,0 +1,192 @@ +import {MouseEvent} from 'react'; + +import {SettingOutlined} from '@ant-design/icons'; + +import {useAppDispatch, useAppSelector} from '@redux/hooks'; +import { + openNewAiResourceWizard, + openNewResourceWizard, + openTemplateExplorer, + setExplorerSelectedSection, + setLeftMenuSelection, +} from '@redux/reducers/ui'; +import {helmChartsCountSelector, kustomizationResourcesCountSelector} from '@redux/selectors'; +import {navigatorResourcesCountSelector} from '@redux/selectors/resourceSelectors'; +import { + errorsByResourcesFilterCountSelector, + warningsByResourcesFilterCountSelector, +} from '@redux/validation/validation.selectors'; +import {setValidationFilters} from '@redux/validation/validation.slice'; + +import {useRefSelector} from '@utils/hooks'; + +import {openDocumentation} from '@shared/utils'; + +import * as S from './styled'; + +const ProjectOverview = () => { + const dispatch = useAppDispatch(); + const currentFilters = useRefSelector(state => state.validation.validationOverview.filters); + + const filesCount = useAppSelector(state => Object.values(state.main.fileMap).filter(f => !f.children).length); + const resourcesCount = useAppSelector(navigatorResourcesCountSelector); + + const kustomizationsResourcesCount = useAppSelector(kustomizationResourcesCountSelector); + const helmChartsCount = useAppSelector(helmChartsCountSelector); + const errorsCount = useAppSelector(errorsByResourcesFilterCountSelector); + const warningsCount = useAppSelector(warningsByResourcesFilterCountSelector); + + const onClickValidationSettingsHandler = (e: MouseEvent) => { + e.stopPropagation(); + dispatch(setLeftMenuSelection('settings')); + }; + + const onClickErrorsCountHandler = () => { + dispatch(setValidationFilters({...currentFilters.current, type: 'error'})); + dispatch(setLeftMenuSelection('validation')); + }; + + const onClickWarningsCountHandler = () => { + dispatch(setValidationFilters({...currentFilters.current, type: 'warning'})); + dispatch(setLeftMenuSelection('validation')); + }; + + const onClickCompareHandler = () => { + dispatch(setLeftMenuSelection('compare')); + }; + + const onClickNewAIResourceHandler = () => { + dispatch(openNewAiResourceWizard()); + }; + + const onClickNewResourcesTemplateHandler = () => { + dispatch(openTemplateExplorer()); + }; + + const onClickNewResourceHandler = () => { + dispatch(openNewResourceWizard()); + }; + + return ( + + Overview + + + Files & Resources + + +
+
+ {filesCount} + Files +
+ + {resourcesCount} + Resources + +
+ + + {resourcesCount === 0 ? ( + + Create your first resource: manually,{' '} + from advanced template or{' '} + from AI + + ) : ( + + dispatch(setExplorerSelectedSection('files'))}>Check out files and + resources in the left to see relations, edit and fix errors. + + )} + + + + + Misconfigurations + + +
+ {errorsCount} + errors +
+ + + + +
+ {warningsCount} + warnings +
+ + + + + + + + + Helm + + +
+ {helmChartsCount} + Helm Charts +
+ + + {helmChartsCount === 0 ? ( + dispatch(setLeftMenuSelection('helm'))}> + Browse Helm Charts to download / install Add Helm repository + + ) : ( + + dispatch(setExplorerSelectedSection('helm'))}>Check out Helm Charts + found on your files. You can dry-run them and + add new Helm Charts. + + )} + + + + + Kustomize + + +
+ {kustomizationsResourcesCount} + Kustomize overlays +
+ + + + dispatch(setExplorerSelectedSection('kustomize'))}> + Check out Kustimize overlays{' '} + + found on your files. You can dry-run them. + + + + + + + + More actions + + Compare to cluster + + New resource from AI + + New resource from advanced template + + New resource manually + + openDocumentation()}>Documentation + + + + + ); +}; + +export default ProjectOverview; diff --git a/src/components/organisms/ActionsPane/ProjectOverview/index.ts b/src/components/organisms/ActionsPane/ProjectOverview/index.ts new file mode 100644 index 0000000000..3b05af0fb8 --- /dev/null +++ b/src/components/organisms/ActionsPane/ProjectOverview/index.ts @@ -0,0 +1 @@ +export {default as ProjectOverview} from './ProjectOverview'; diff --git a/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx b/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx new file mode 100644 index 0000000000..43077579d1 --- /dev/null +++ b/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx @@ -0,0 +1,155 @@ +import {Typography} from 'antd'; + +import styled from 'styled-components'; + +import {Colors} from '@shared/styles'; + +export const Container = styled.div` + padding: 16px; + display: grid; + grid-template-columns: 1fr; + gap: 16px; +`; + +export const Title = styled(Typography.Title)` + background-color: ${Colors.grey3b}; + padding: 16px; + + &.ant-typography { + font-size: 16px; + font-style: normal; + font-weight: 700; + line-height: 22px; + color: ${Colors.whitePure}; + margin-bottom: 0; + } +`; + +export const CardContainer = styled.div` + display: flex; + gap: 16px; + width: 100%; + > * { + flex: 1; + } +`; + +export const Card = styled.div` + display: flex; + flex-direction: column; +`; + +export const CardTitle = styled(Typography.Title)` + background-color: ${Colors.grey10}; + padding: 4px 12px; + + &.ant-typography { + font-size: 14px; + font-weight: 600; + line-height: 22px; + color: ${Colors.grey9}; + margin-bottom: 0; + } +`; + +export const CardContent = styled.div` + display: flex; + flex-direction: column; + background-color: #191f21b2; + padding: 24px; + padding-bottom: 16px; + height: 100%; +`; + +export const Text = styled(Typography.Text)` + cursor: ${({onClick}) => (onClick ? 'pointer' : 'default')}; + + &.ant-typography { + font-size: 12px; + font-style: normal; + font-weight: 400; + line-height: 20px; + color: ${Colors.grey9}; + } +`; + +export const GreyText = styled(Typography.Text)` + &.ant-typography { + font-size: 12px; + font-style: normal; + font-weight: 400; + line-height: 20px; + color: ${Colors.grey7}; + } +`; + +export const SmallText = styled(Typography.Text)` + &.ant-typography { + font-size: 12px; + line-height: 18px; + } +`; + +export const CountChip = styled.span<{$type: 'error' | 'warning' | 'resource'}>` + display: flex; + align-items: center; + border-radius: 4px; + margin-bottom: 8px; + justify-content: space-between; + width: 100%; + height: ${props => (props.$type === 'resource' ? '90px' : '67px')}; + padding: 8px 10px; + cursor: ${({onClick}) => (onClick ? 'pointer' : 'default')}; + + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + min-width: 0; + + ${props => + `border-left: 4px solid ${ + (props.$type === 'warning' && Colors.yellow12) || + (props.$type === 'error' && Colors.red7) || + (props.$type === 'resource' && Colors.grey5000) + }; + background-color: ${ + (props.$type === 'warning' && 'rgba(232, 179, 57, 0.1)') || + (props.$type === 'error' && 'rgba(232, 71, 73, 0.1)') || + (props.$type === 'resource' && 'rgba(82, 115, 224, 0.1)') + }; + color: ${ + (props.$type === 'warning' && Colors.yellow12) || + (props.$type === 'error' && Colors.red7) || + (props.$type === 'resource' && Colors.geekblue7) + } ; + `} + + & .ant-typography { + color: ${props => + (props.$type === 'warning' && Colors.yellow12) || + (props.$type === 'error' && Colors.red7) || + (props.$type === 'resource' && Colors.geekblue7)}; + } +`; + +export const ResourcesContainer = styled.div<{$hasResources: boolean}>` + & .ant-typography { + color: ${props => (props.$hasResources ? Colors.geekblue7 : Colors.red7)}; + } +`; + +export const Count = styled(Typography.Text)` + display: flex; + gap: 4px; + + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + min-width: 0; + + &.ant-typography { + display: flex; + font-size: 32px; + line-height: 24px; + } +`; diff --git a/src/redux/selectors.tsx b/src/redux/selectors.tsx index 4647a5015e..df3bb45637 100644 --- a/src/redux/selectors.tsx +++ b/src/redux/selectors.tsx @@ -192,3 +192,10 @@ export const projectFileTreeSelector = createSelector( export const helmChartsCountSelector = createSelector([(state: RootState) => state.main.helmChartMap], helmChartMap => { return size(helmChartMap); }); + +export const kustomizationResourcesCountSelector = createSelector( + [kustomizationResourcesSelectors], + kustomizationResources => { + return size(kustomizationResources); + } +); From 0fcbd362d184259d4aeb7b58a35bcfd9921b09f5 Mon Sep 17 00:00:00 2001 From: Mahmoud Mortada Date: Wed, 12 Jul 2023 12:22:16 +0300 Subject: [PATCH 08/26] fix: text navigation --- .../organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx b/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx index 9f8f60f43f..0d0d5b2c92 100644 --- a/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx +++ b/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx @@ -143,7 +143,7 @@ const ProjectOverview = () => { dispatch(setExplorerSelectedSection('helm'))}>Check out Helm Charts found on your files. You can dry-run them and - add new Helm Charts. + dispatch(setLeftMenuSelection('helm'))}> add new Helm Charts. )} From 48f461eb85347c5085eaa140815ff31b7d99f901 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 12 Jul 2023 23:27:46 +0000 Subject: [PATCH 09/26] chore(deps): bump semver from 5.7.1 to 5.7.2 in /docs Bumps [semver](https://github.com/npm/node-semver) from 5.7.1 to 5.7.2. - [Release notes](https://github.com/npm/node-semver/releases) - [Changelog](https://github.com/npm/node-semver/blob/v5.7.2/CHANGELOG.md) - [Commits](https://github.com/npm/node-semver/compare/v5.7.1...v5.7.2) --- updated-dependencies: - dependency-name: semver dependency-type: indirect ... Signed-off-by: dependabot[bot] --- docs/package-lock.json | 144 ++++++++++++++++++++--------------------- 1 file changed, 72 insertions(+), 72 deletions(-) diff --git a/docs/package-lock.json b/docs/package-lock.json index 21d503c5de..ed4a5c3132 100644 --- a/docs/package-lock.json +++ b/docs/package-lock.json @@ -231,9 +231,9 @@ } }, "node_modules/@babel/core/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "bin": { "semver": "bin/semver.js" } @@ -306,9 +306,9 @@ } }, "node_modules/@babel/helper-compilation-targets/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "bin": { "semver": "bin/semver.js" } @@ -366,9 +366,9 @@ } }, "node_modules/@babel/helper-define-polyfill-provider/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "bin": { "semver": "bin/semver.js" } @@ -1618,9 +1618,9 @@ } }, "node_modules/@babel/plugin-transform-runtime/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "bin": { "semver": "bin/semver.js" } @@ -1830,9 +1830,9 @@ } }, "node_modules/@babel/preset-env/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "bin": { "semver": "bin/semver.js" } @@ -2757,9 +2757,9 @@ } }, "node_modules/@mdx-js/mdx/node_modules/semver": { - "version": "5.7.1", - "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz", - "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==", + "version": "5.7.2", + "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz", + "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==", "bin": { "semver": "bin/semver" } @@ -3975,9 +3975,9 @@ } }, "node_modules/babel-plugin-polyfill-corejs2/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "bin": { "semver": "bin/semver.js" } @@ -7666,9 +7666,9 @@ } }, "node_modules/make-dir/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "bin": { "semver": "bin/semver.js" } @@ -8283,9 +8283,9 @@ } }, "node_modules/package-json/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "bin": { "semver": "bin/semver.js" } @@ -9846,9 +9846,9 @@ } }, "node_modules/remark-mdx/node_modules/semver": { - "version": "5.7.1", - "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz", - "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==", + "version": "5.7.2", + "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz", + "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==", "bin": { "semver": "bin/semver" } @@ -10297,9 +10297,9 @@ } }, "node_modules/semver": { - "version": "7.3.8", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz", - "integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==", + "version": "7.5.4", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", + "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", "dependencies": { "lru-cache": "^6.0.0" }, @@ -10322,9 +10322,9 @@ } }, "node_modules/semver-diff/node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "bin": { "semver": "bin/semver.js" } @@ -12651,9 +12651,9 @@ }, "dependencies": { "semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==" + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==" } } }, @@ -12709,9 +12709,9 @@ }, "dependencies": { "semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==" + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==" } } }, @@ -12753,9 +12753,9 @@ }, "dependencies": { "semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==" + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==" } } }, @@ -13565,9 +13565,9 @@ }, "dependencies": { "semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==" + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==" } } }, @@ -13722,9 +13722,9 @@ }, "dependencies": { "semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==" + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==" } } }, @@ -14423,9 +14423,9 @@ } }, "semver": { - "version": "5.7.1", - "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz", - "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==" + "version": "5.7.2", + "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz", + "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==" }, "source-map": { "version": "0.5.7", @@ -15364,9 +15364,9 @@ }, "dependencies": { "semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==" + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==" } } }, @@ -18013,9 +18013,9 @@ }, "dependencies": { "semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==" + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==" } } }, @@ -18438,9 +18438,9 @@ }, "dependencies": { "semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==" + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==" } } }, @@ -19526,9 +19526,9 @@ } }, "semver": { - "version": "5.7.1", - "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz", - "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==" + "version": "5.7.2", + "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz", + "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==" }, "source-map": { "version": "0.5.7", @@ -19841,9 +19841,9 @@ } }, "semver": { - "version": "7.3.8", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz", - "integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==", + "version": "7.5.4", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz", + "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==", "requires": { "lru-cache": "^6.0.0" }, @@ -19872,9 +19872,9 @@ }, "dependencies": { "semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==" + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==" } } }, From 7295a0f8aa337ea4402afee8cd8c8be654b7f556 Mon Sep 17 00:00:00 2001 From: Dev Catalin <20538711+devcatalin@users.noreply.github.com> Date: Thu, 13 Jul 2023 14:00:06 +0300 Subject: [PATCH 10/26] feat: getProxyPort method --- electron/app/services/cluster/handlers/debugProxy.ts | 2 ++ electron/app/services/cluster/ipc.ts | 3 ++- electron/kubernetes/ProxyService.ts | 4 ++++ src/redux/cluster/service/kube-control.ts | 1 + 4 files changed, 9 insertions(+), 1 deletion(-) diff --git a/electron/app/services/cluster/handlers/debugProxy.ts b/electron/app/services/cluster/handlers/debugProxy.ts index 6349d218c5..c689509e0e 100644 --- a/electron/app/services/cluster/handlers/debugProxy.ts +++ b/electron/app/services/cluster/handlers/debugProxy.ts @@ -28,3 +28,5 @@ export async function debugProxy({context, kubeconfig}: DebugProxyArgs): Promise }; } } + +export const getProxyPort = (context: string) => PROXY_SERVICE.find(context)?.port; diff --git a/electron/app/services/cluster/ipc.ts b/electron/app/services/cluster/ipc.ts index 4d523e84cf..fc6882443a 100644 --- a/electron/app/services/cluster/ipc.ts +++ b/electron/app/services/cluster/ipc.ts @@ -1,9 +1,10 @@ import {handleIpc} from '../../utils/ipc'; -import {debugProxy, getKubeConfig, setup, stopWatchingKubeconfig, watchKubeconfig} from './handlers'; +import {debugProxy, getKubeConfig, getProxyPort, setup, stopWatchingKubeconfig, watchKubeconfig} from './handlers'; // Cluster & Proxy management handleIpc('cluster:setup', setup); handleIpc('cluster:debug-proxy', debugProxy); +handleIpc('cluster:get-proxy-port', getProxyPort); // Kubeconfig management handleIpc('kubeconfig:get', getKubeConfig); diff --git a/electron/kubernetes/ProxyService.ts b/electron/kubernetes/ProxyService.ts index bf21fe70ca..2acd9ed1bd 100644 --- a/electron/kubernetes/ProxyService.ts +++ b/electron/kubernetes/ProxyService.ts @@ -21,6 +21,10 @@ export class ProxyService { return this.start(context, kubeconfig); } + find(context: string) { + return this.proxies.find(p => p.context === context); + } + private async start(context: string, kubeconfig?: string): Promise { let attempt = 0; // eslint-disable-next-line no-constant-condition diff --git a/src/redux/cluster/service/kube-control.ts b/src/redux/cluster/service/kube-control.ts index b1b5ba4a9a..aa1ceb7d59 100644 --- a/src/redux/cluster/service/kube-control.ts +++ b/src/redux/cluster/service/kube-control.ts @@ -12,6 +12,7 @@ import {runCommandInMainThread} from '@shared/utils/commands'; */ export const setup = invokeIpc('cluster:setup'); export const debugProxy = invokeIpc('cluster:debug-proxy'); +export const getProxyPort = invokeIpc('cluster:get-proxy-port'); export const getKubeconfig = invokeIpc<{path: string | undefined}, ModernKubeConfig>('kubeconfig:get'); export const watchKubeconfig = invokeIpc<{kubeconfigs: string[]}, void>('kubeconfig:watch'); export const stopWatchKubeconfig = invokeIpc('kubeconfig:watch:stop'); From 61a3ec26f1749e21f5886474089ccbc821206d07 Mon Sep 17 00:00:00 2001 From: Dev Catalin <20538711+devcatalin@users.noreply.github.com> Date: Thu, 13 Jul 2023 14:02:47 +0300 Subject: [PATCH 11/26] chore: remove unused code --- src/redux/appConfig/appConfig.slice.ts | 4 ---- src/redux/thunks/cluster/stopClusterConnection.ts | 5 +---- src/shared/models/config.ts | 2 -- 3 files changed, 1 insertion(+), 10 deletions(-) diff --git a/src/redux/appConfig/appConfig.slice.ts b/src/redux/appConfig/appConfig.slice.ts index 848a2c0adc..eb0de14705 100644 --- a/src/redux/appConfig/appConfig.slice.ts +++ b/src/redux/appConfig/appConfig.slice.ts @@ -388,9 +388,6 @@ export const configSlice = createSlice({ log.warn("Couldn't initialize Sentry."); } }, - setClusterProxyPort: (state: Draft, action: PayloadAction) => { - state.clusterProxyPort = action.payload; - }, setUserApiKey: (state: Draft, action: PayloadAction<{vendor: ApiKeyVendor; apiKey: string}>) => { state.userApiKeys[action.payload.vendor] = action.payload.apiKey; electronStore.set('appConfig.userApiKeys', state.userApiKeys); @@ -455,7 +452,6 @@ export const { updateTelemetry, updateTextSize, updateTheme, - setClusterProxyPort, setUserApiKey, } = configSlice.actions; export default configSlice.reducer; diff --git a/src/redux/thunks/cluster/stopClusterConnection.ts b/src/redux/thunks/cluster/stopClusterConnection.ts index fc2b72ca52..611096d270 100644 --- a/src/redux/thunks/cluster/stopClusterConnection.ts +++ b/src/redux/thunks/cluster/stopClusterConnection.ts @@ -1,6 +1,5 @@ import {createAsyncThunk} from '@reduxjs/toolkit'; -import {setClusterProxyPort} from '@redux/appConfig'; import {disconnectFromCluster} from '@redux/services/clusterResourceWatcher'; import {AppDispatch} from '@shared/models/appDispatch'; @@ -8,9 +7,7 @@ import {RootState} from '@shared/models/rootState'; export const stopClusterConnection = createAsyncThunk( 'main/stopClusterConnection', - async (payload, {dispatch}) => { - // Close connection - dispatch(setClusterProxyPort(undefined)); + async () => { disconnectFromCluster(); } ); diff --git a/src/shared/models/config.ts b/src/shared/models/config.ts index 80907f8b4c..75c9124ce6 100644 --- a/src/shared/models/config.ts +++ b/src/shared/models/config.ts @@ -58,8 +58,6 @@ interface AppConfig { data: any; }; kubeConfig: KubeConfig; - // TODO: clusterProxyPort should move to AppState.clusterConnectionOptions or clusterConnection - clusterProxyPort?: number; osPlatform: NodeJS.Platform; projects: Project[]; selectedProjectRootFolder: string | null; From 1373e8159dd380c0982d8726721e4f419ce85308 Mon Sep 17 00:00:00 2001 From: Mahmoud Mortada Date: Thu, 13 Jul 2023 14:13:39 +0300 Subject: [PATCH 12/26] fix: resolve comments --- .../ProjectOverview/ProjectOverview.tsx | 90 ++++++++++++------- .../ActionsPane/ProjectOverview/styled.tsx | 44 +++++++-- 2 files changed, 92 insertions(+), 42 deletions(-) diff --git a/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx b/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx index 0d0d5b2c92..3e76622d00 100644 --- a/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx +++ b/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx @@ -7,6 +7,7 @@ import { openNewAiResourceWizard, openNewResourceWizard, openTemplateExplorer, + setActiveSettingsPanel, setExplorerSelectedSection, setLeftMenuSelection, } from '@redux/reducers/ui'; @@ -20,6 +21,7 @@ import {setValidationFilters} from '@redux/validation/validation.slice'; import {useRefSelector} from '@utils/hooks'; +import {SettingsPanel} from '@shared/models/config'; import {openDocumentation} from '@shared/utils'; import * as S from './styled'; @@ -38,6 +40,7 @@ const ProjectOverview = () => { const onClickValidationSettingsHandler = (e: MouseEvent) => { e.stopPropagation(); + dispatch(setActiveSettingsPanel(SettingsPanel.ValidationSettings)); dispatch(setLeftMenuSelection('settings')); }; @@ -69,8 +72,42 @@ const ProjectOverview = () => { return ( - Overview + + + ← Select a resource to the left to edit and fix + + + In the meantime, check out your project summary ↓ + + + + Misconfigurations + + +
+ {errorsCount} + errors +
+ + + + +
+ {warningsCount} + warnings +
+ + + + + Analyze and fix errors in the{' '} + dispatch(setLeftMenuSelection('validation'))}>Validation Pane, configure + your policy in the Policy Configuration + + + + Files & Resources @@ -101,27 +138,6 @@ const ProjectOverview = () => { )} - - - Misconfigurations - - -
- {errorsCount} - errors -
- - - - -
- {warningsCount} - warnings -
- - - - @@ -130,7 +146,7 @@ const ProjectOverview = () => {
- {helmChartsCount} + dispatch(setExplorerSelectedSection('helm'))}>{helmChartsCount} Helm Charts
@@ -153,10 +169,18 @@ const ProjectOverview = () => { Kustomize -
- {kustomizationsResourcesCount} - Kustomize overlays -
+ {kustomizationsResourcesCount === 0 ? ( +
+ No Kustomize Overlays found +
+ ) : ( +
+ dispatch(setExplorerSelectedSection('kustomize'))}> + {kustomizationsResourcesCount} + + Kustomize overlays +
+ )} @@ -172,16 +196,16 @@ const ProjectOverview = () => { More actions - - Compare to cluster + + Compare to cluster - New resource from AI + New resource from AI - New resource from advanced template + New resource from advanced template - New resource manually + New resource manually - openDocumentation()}>Documentation + openDocumentation()}>Documentation diff --git a/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx b/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx index 43077579d1..e32eaab11a 100644 --- a/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx +++ b/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx @@ -11,17 +11,23 @@ export const Container = styled.div` gap: 16px; `; -export const Title = styled(Typography.Title)` - background-color: ${Colors.grey3b}; +export const Title = styled.div` + display: flex; + flex-direction: column; padding: 16px; + border-radius: 4px; - &.ant-typography { - font-size: 16px; + & .ant-typography { + font-size: 14px; font-style: normal; - font-weight: 700; - line-height: 22px; - color: ${Colors.whitePure}; + font-weight: 400; + line-height: 22px !important; margin-bottom: 0; + text-align: center; + } + + .weight-700 { + font-weight: 700 !important; } `; @@ -42,6 +48,8 @@ export const Card = styled.div` export const CardTitle = styled(Typography.Title)` background-color: ${Colors.grey10}; padding: 4px 12px; + border-top-left-radius: 4px; + border-top-right-radius: 4px; &.ant-typography { font-size: 14px; @@ -59,6 +67,8 @@ export const CardContent = styled.div` padding: 24px; padding-bottom: 16px; height: 100%; + border-bottom-left-radius: 4px; + border-bottom-right-radius: 4px; `; export const Text = styled(Typography.Text)` @@ -71,6 +81,21 @@ export const Text = styled(Typography.Text)` line-height: 20px; color: ${Colors.grey9}; } + + &.ant-typography:hover { + color: ${({onClick}) => (onClick ? Colors.whitePure : 'currentColor')}; + } +`; + +export const Link = styled(Typography.Link)` + cursor: ${({onClick}) => (onClick ? 'pointer' : 'default')}; + + &.ant-typography { + font-size: 13px; + font-style: normal; + font-weight: 400; + line-height: 22px; + } `; export const GreyText = styled(Typography.Text)` @@ -97,8 +122,8 @@ export const CountChip = styled.span<{$type: 'error' | 'warning' | 'resource'}>` margin-bottom: 8px; justify-content: space-between; width: 100%; - height: ${props => (props.$type === 'resource' ? '90px' : '67px')}; - padding: 8px 10px; + height: ${props => (props.$type === 'resource' ? '90px' : '56px')}; + padding: 8px 20px; cursor: ${({onClick}) => (onClick ? 'pointer' : 'default')}; white-space: nowrap; @@ -146,6 +171,7 @@ export const Count = styled(Typography.Text)` overflow: hidden; text-overflow: ellipsis; min-width: 0; + cursor: ${({onClick}) => (onClick ? 'pointer' : 'default')}; &.ant-typography { display: flex; From 672ca98b2892f540eff40ef014285584919148c2 Mon Sep 17 00:00:00 2001 From: Dev Catalin <20538711+devcatalin@users.noreply.github.com> Date: Thu, 13 Jul 2023 14:20:54 +0300 Subject: [PATCH 13/26] refactor: set cluster args to helm commands --- src/shared/models/commands.ts | 1 - src/shared/utils/commands/helm.ts | 286 --------------------------- src/utils/cluster.ts | 22 +++ src/utils/helm.ts | 310 +++++++++++++++++++++++++++++- 4 files changed, 328 insertions(+), 291 deletions(-) create mode 100644 src/utils/cluster.ts diff --git a/src/shared/models/commands.ts b/src/shared/models/commands.ts index f7cfca24d6..96aa480140 100644 --- a/src/shared/models/commands.ts +++ b/src/shared/models/commands.ts @@ -21,7 +21,6 @@ export type HelmEnv = { }; export type HelmInstallArgs = { - kubeContext: string; values: string; name: string; chart: string; diff --git a/src/shared/utils/commands/helm.ts b/src/shared/utils/commands/helm.ts index 4f77a4d850..e69de29bb2 100644 --- a/src/shared/utils/commands/helm.ts +++ b/src/shared/utils/commands/helm.ts @@ -1,286 +0,0 @@ -import {isEmpty} from 'lodash'; -import {v4 as uuid} from 'uuid'; - -import {CommandOptions, HelmEnv, HelmInstallArgs, HelmTemplateArgs} from '@shared/models/commands'; - -export function createHelmInstallCommand( - {kubeContext, values, name, chart}: HelmInstallArgs, - env?: HelmEnv -): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['install', '--kube-context', kubeContext, '-f', `"${values}"`, chart, `"${name}"`, '--dry-run'], - env, - }; -} - -export function createHelmTemplateCommand({values, name, chart}: HelmTemplateArgs, env?: HelmEnv): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['template', '-f', `"${values}"`, chart, `"${name}"`], - env, - }; -} - -export function listHelmRepoCommand(env?: HelmEnv): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['repo', 'list', '-o json'], - env, - }; -} - -export function addHelmRepoCommand({name, url}: {name: string; url: string}, env?: HelmEnv): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['repo', 'add', name, url], - env, - }; -} - -export function updateHelmRepoCommand({repos = []}: {repos?: string[]}, env?: HelmEnv): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['repo', 'update', ...repos], - env, - }; -} - -export function removeHelmRepoCommand({repos}: {repos: string[]}, env?: HelmEnv): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['repo', 'remove', ...repos], - env, - }; -} - -export function indexHelmRepoCommand({dir}: {dir: string}, env?: HelmEnv): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['repo', 'index', dir], - env, - }; -} - -export function searchHelmRepoCommand({q}: {q: string}, versions?: boolean, env?: HelmEnv): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['search', 'repo', q, versions ? '--versions' : '', '-o json'], - env, - }; -} - -export function searchHelmHubCommand({q}: {q: string}, env?: HelmEnv): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['search', 'hub', q, '-o json'], - env, - }; -} - -export function helmChartInfoCommand({name}: {name: string}, env?: HelmEnv): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['show', 'chart', name], - env, - }; -} - -export function helmChartReadmeCommand({name}: {name: string}, env?: HelmEnv): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['show', 'readme', name], - env, - }; -} - -export function helmChartTemplateCommand({name}: {name: string}, env?: HelmEnv): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['template', name], - env, - }; -} - -export function helmChartValuesCommand({name}: {name: string}, env?: HelmEnv): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['show', 'values', name], - env, - }; -} - -export function helmPullChartCommand( - {name, path, version}: {name: string; path: string; version?: string}, - env?: HelmEnv -): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['pull', name, '--untar', '--untardir', path, version ? `--version ${version}` : ''], - env, - }; -} - -export function installHelmRepoChartCommand( - { - chart, - namespace, - version, - shouldCreateNamespace, - }: {chart: string; namespace?: string; version?: string; shouldCreateNamespace?: boolean}, - env?: HelmEnv -): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: [ - 'install', - chart, - '-g', - namespace ? `--namespace ${namespace}` : '', - version ? `--version ${version}` : '', - shouldCreateNamespace ? '--create-namespace' : '', - ], - env, - }; -} - -export function listHelmReleasesCommand( - {namespace, filter}: {namespace?: string; filter?: string}, - env?: HelmEnv -): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: [ - 'list', - !isEmpty(namespace) ? `--namespace ${namespace}` : '--all-namespaces', - !isEmpty(filter) ? `--filter ${filter}` : '', - '-o json', - ], - env, - }; -} - -export function helmReleaseRevisionsCommand( - {release, namespace}: {release: string; namespace: string}, - env?: HelmEnv -): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['history', release, '-n', namespace, '-o json'], - env, - }; -} - -export function upgradeHelmReleaseCommand( - { - release, - chart, - namespace, - version, - dryRun, - }: {release: string; chart: string; namespace: string; version?: string; dryRun?: boolean}, - env?: HelmEnv -): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: [ - 'upgrade', - release, - chart, - dryRun ? '--dry-run' : '', - '-n', - namespace, - version ? `--version ${version}` : '', - ], - env, - }; -} - -export function uninstallHelmReleaseCommand( - {release, namespace, dryRun}: {release: string; namespace: string; dryRun?: boolean}, - env?: HelmEnv -): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['uninstall', release, dryRun ? '--dry-run' : '', '-n', namespace], - env, - }; -} - -export function getHelmReleaseManifestCommand( - {release, namespace, revision = -1}: {release: string; namespace: string; revision?: number}, - env?: HelmEnv -): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['get', 'manifest', release, revision > -1 ? `--revision ${revision}` : '', '-n', namespace], - env, - }; -} - -export function getHelmReleaseValuesCommand( - {release, namespace}: {release: string; namespace: string}, - env?: HelmEnv -): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['get', 'values', release, '-n', namespace], - env, - }; -} - -export function getHelmReleaseNotesCommand( - {release, namespace}: {release: string; namespace: string}, - env?: HelmEnv -): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['get', 'notes', release, '-n', namespace], - env, - }; -} - -export function getHelmReleaseHooksCommand( - {release, namespace}: {release: string; namespace: string}, - env?: HelmEnv -): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['get', 'hooks', release, '-n', namespace], - env, - }; -} -export function rollbackHelmReleaseCommand( - {release, namespace, revision}: {release: string; namespace: string; revision: number}, - env?: HelmEnv -): CommandOptions { - return { - commandId: uuid(), - cmd: 'helm', - args: ['rollback', release, revision.toString(), '-n', namespace], - env, - }; -} diff --git a/src/utils/cluster.ts b/src/utils/cluster.ts new file mode 100644 index 0000000000..7053cd387d --- /dev/null +++ b/src/utils/cluster.ts @@ -0,0 +1,22 @@ +import store from '@redux/store'; + +export function getKubeContext(): string | undefined { + return store.getState().main.clusterConnection?.context; +} + +export function getClusterNamespace(): string | undefined { + return store.getState().main.clusterConnection?.namespace; +} + +export function getClusterProxyPort(): number | undefined { + return store.getState().cluster.proxyPort; +} + +export function getHelmClusterArgs(): string[] { + const context = getKubeContext(); + const proxyPort = getClusterProxyPort(); + + if (!context || !proxyPort) return []; + + return ['--kube-context', context, '--kube-api-server', `http://127.0.0.1:${proxyPort}`]; +} diff --git a/src/utils/helm.ts b/src/utils/helm.ts index d017e3aa53..89c0b3bf4b 100644 --- a/src/utils/helm.ts +++ b/src/utils/helm.ts @@ -1,5 +1,10 @@ -import path from 'path'; +import {isEmpty} from 'lodash'; +import {dirname, join, sep} from 'path'; +import {v4 as uuid} from 'uuid'; +import {getHelmClusterArgs} from '@utils/cluster'; + +import {CommandOptions, HelmEnv, HelmInstallArgs, HelmTemplateArgs} from '@shared/models/commands'; import {HelmChart} from '@shared/models/helm'; export function buildHelmCommand( @@ -10,16 +15,16 @@ export function buildHelmCommand( rootFolderPath: string, clusterContext?: string ): string[] { - let chartFolderPath = path.join(rootFolderPath, path.dirname(helmChart.filePath)); + let chartFolderPath = join(rootFolderPath, dirname(helmChart.filePath)); - if (chartFolderPath.endsWith(path.sep)) { + if (chartFolderPath.endsWith(sep)) { chartFolderPath = chartFolderPath.slice(0, -1); } const args = [ 'helm', command, - ...valuesFilePaths.map(filePath => ['-f', `"${path.join(rootFolderPath, filePath)}"`]).flat(), + ...valuesFilePaths.map(filePath => ['-f', `"${join(rootFolderPath, filePath)}"`]).flat(), helmChart.name, `"${chartFolderPath}"`, ]; @@ -39,5 +44,302 @@ export function buildHelmCommand( args.push('--dry-run'); } + const clusterArgs = getHelmClusterArgs(); + args.push(...clusterArgs); + return args; } + +export function createHelmInstallCommand({values, name, chart}: HelmInstallArgs, env?: HelmEnv): CommandOptions { + const clusterArgs = getHelmClusterArgs(); + + return { + commandId: uuid(), + cmd: 'helm', + args: ['install', ...clusterArgs, '-f', `"${values}"`, chart, `"${name}"`, '--dry-run'], + env, + }; +} + +export function createHelmTemplateCommand({values, name, chart}: HelmTemplateArgs, env?: HelmEnv): CommandOptions { + return { + commandId: uuid(), + cmd: 'helm', + args: ['template', '-f', `"${values}"`, chart, `"${name}"`], + env, + }; +} + +export function listHelmRepoCommand(env?: HelmEnv): CommandOptions { + return { + commandId: uuid(), + cmd: 'helm', + args: ['repo', 'list', '-o json'], + env, + }; +} + +export function addHelmRepoCommand({name, url}: {name: string; url: string}, env?: HelmEnv): CommandOptions { + return { + commandId: uuid(), + cmd: 'helm', + args: ['repo', 'add', name, url], + env, + }; +} + +export function updateHelmRepoCommand({repos = []}: {repos?: string[]}, env?: HelmEnv): CommandOptions { + return { + commandId: uuid(), + cmd: 'helm', + args: ['repo', 'update', ...repos], + env, + }; +} + +export function removeHelmRepoCommand({repos}: {repos: string[]}, env?: HelmEnv): CommandOptions { + return { + commandId: uuid(), + cmd: 'helm', + args: ['repo', 'remove', ...repos], + env, + }; +} + +export function indexHelmRepoCommand({dir}: {dir: string}, env?: HelmEnv): CommandOptions { + return { + commandId: uuid(), + cmd: 'helm', + args: ['repo', 'index', dir], + env, + }; +} + +export function searchHelmRepoCommand({q}: {q: string}, versions?: boolean, env?: HelmEnv): CommandOptions { + return { + commandId: uuid(), + cmd: 'helm', + args: ['search', 'repo', q, versions ? '--versions' : '', '-o json'], + env, + }; +} + +export function searchHelmHubCommand({q}: {q: string}, env?: HelmEnv): CommandOptions { + return { + commandId: uuid(), + cmd: 'helm', + args: ['search', 'hub', q, '-o json'], + env, + }; +} + +export function helmChartInfoCommand({name}: {name: string}, env?: HelmEnv): CommandOptions { + return { + commandId: uuid(), + cmd: 'helm', + args: ['show', 'chart', name], + env, + }; +} + +export function helmChartReadmeCommand({name}: {name: string}, env?: HelmEnv): CommandOptions { + return { + commandId: uuid(), + cmd: 'helm', + args: ['show', 'readme', name], + env, + }; +} + +export function helmChartTemplateCommand({name}: {name: string}, env?: HelmEnv): CommandOptions { + return { + commandId: uuid(), + cmd: 'helm', + args: ['template', name], + env, + }; +} + +export function helmChartValuesCommand({name}: {name: string}, env?: HelmEnv): CommandOptions { + return { + commandId: uuid(), + cmd: 'helm', + args: ['show', 'values', name], + env, + }; +} + +export function helmPullChartCommand( + {name, path, version}: {name: string; path: string; version?: string}, + env?: HelmEnv +): CommandOptions { + return { + commandId: uuid(), + cmd: 'helm', + args: ['pull', name, '--untar', '--untardir', path, version ? `--version ${version}` : ''], + env, + }; +} + +export function installHelmRepoChartCommand( + { + chart, + namespace, + version, + shouldCreateNamespace, + }: {chart: string; namespace?: string; version?: string; shouldCreateNamespace?: boolean}, + env?: HelmEnv +): CommandOptions { + const clusterArgs = getHelmClusterArgs(); + return { + commandId: uuid(), + cmd: 'helm', + args: [ + 'install', + chart, + '-g', + namespace ? `--namespace ${namespace}` : '', + version ? `--version ${version}` : '', + shouldCreateNamespace ? '--create-namespace' : '', + ...clusterArgs, + ], + env, + }; +} + +export function listHelmReleasesCommand( + {namespace, filter}: {namespace?: string; filter?: string}, + env?: HelmEnv +): CommandOptions { + const clusterArgs = getHelmClusterArgs(); + return { + commandId: uuid(), + cmd: 'helm', + args: [ + 'list', + ...clusterArgs, + !isEmpty(namespace) ? `--namespace ${namespace}` : '--all-namespaces', + !isEmpty(filter) ? `--filter ${filter}` : '', + '-o json', + ], + env, + }; +} + +export function helmReleaseRevisionsCommand( + {release, namespace}: {release: string; namespace: string}, + env?: HelmEnv +): CommandOptions { + const clusterArgs = getHelmClusterArgs(); + return { + commandId: uuid(), + cmd: 'helm', + args: ['history', release, ...clusterArgs, '-n', namespace, '-o json'], + env, + }; +} + +export function upgradeHelmReleaseCommand( + { + release, + chart, + namespace, + version, + dryRun, + }: {release: string; chart: string; namespace: string; version?: string; dryRun?: boolean}, + env?: HelmEnv +): CommandOptions { + const clusterArgs = getHelmClusterArgs(); + return { + commandId: uuid(), + cmd: 'helm', + args: [ + 'upgrade', + release, + chart, + dryRun ? '--dry-run' : '', + ...clusterArgs, + '-n', + namespace, + version ? `--version ${version}` : '', + ], + env, + }; +} + +export function uninstallHelmReleaseCommand( + {release, namespace, dryRun}: {release: string; namespace: string; dryRun?: boolean}, + env?: HelmEnv +): CommandOptions { + const clusterArgs = getHelmClusterArgs(); + return { + commandId: uuid(), + cmd: 'helm', + args: ['uninstall', release, dryRun ? '--dry-run' : '', ...clusterArgs, '-n', namespace], + env, + }; +} + +export function getHelmReleaseManifestCommand( + {release, namespace, revision = -1}: {release: string; namespace: string; revision?: number}, + env?: HelmEnv +): CommandOptions { + const clusterArgs = getHelmClusterArgs(); + return { + commandId: uuid(), + cmd: 'helm', + args: ['get', 'manifest', release, revision > -1 ? `--revision ${revision}` : '', ...clusterArgs, '-n', namespace], + env, + }; +} + +export function getHelmReleaseValuesCommand( + {release, namespace}: {release: string; namespace: string}, + env?: HelmEnv +): CommandOptions { + const clusterArgs = getHelmClusterArgs(); + return { + commandId: uuid(), + cmd: 'helm', + args: ['get', 'values', release, ...clusterArgs, '-n', namespace], + env, + }; +} + +export function getHelmReleaseNotesCommand( + {release, namespace}: {release: string; namespace: string}, + env?: HelmEnv +): CommandOptions { + const clusterArgs = getHelmClusterArgs(); + return { + commandId: uuid(), + cmd: 'helm', + args: ['get', 'notes', release, ...clusterArgs, '-n', namespace], + env, + }; +} + +export function getHelmReleaseHooksCommand( + {release, namespace}: {release: string; namespace: string}, + env?: HelmEnv +): CommandOptions { + const clusterArgs = getHelmClusterArgs(); + return { + commandId: uuid(), + cmd: 'helm', + args: ['get', 'hooks', release, ...clusterArgs, '-n', namespace], + env, + }; +} +export function rollbackHelmReleaseCommand( + {release, namespace, revision}: {release: string; namespace: string; revision: number}, + env?: HelmEnv +): CommandOptions { + const clusterArgs = getHelmClusterArgs(); + return { + commandId: uuid(), + cmd: 'helm', + args: ['rollback', release, revision.toString(), ...clusterArgs, '-n', namespace], + env, + }; +} From 5ee6730b58a021ffb5b1c1feb54d024ec35eec04 Mon Sep 17 00:00:00 2001 From: Dev Catalin <20538711+devcatalin@users.noreply.github.com> Date: Thu, 13 Jul 2023 14:24:24 +0300 Subject: [PATCH 14/26] fix: helm commands imports --- .../HelmReleaseTabs/HelmReleaseHooks.tsx | 3 ++- .../HelmReleaseTabs/HelmReleaseManifest.tsx | 3 ++- .../HelmReleaseTabs/HelmReleaseNotes.tsx | 4 +++- .../HelmReleaseTabs/HelmReleaseValues.tsx | 3 ++- .../HelmReleaseTabs/HelmRevisionsTable.tsx | 8 ++------ .../HelmReleaseDetails/SelectedHelmReleaseDetails.tsx | 8 ++------ .../HelmReleaseDetails/UpgradeHelmReleaseModal.tsx | 4 +++- .../HelmRepoPane/HelmChartDetails/HelmChartDetails.tsx | 4 +++- .../HelmChartDetails/HelmChartTabs/HelmTemplate.tsx | 3 ++- .../HelmChartDetails/HelmChartTabs/HelmValues.tsx | 3 ++- .../organisms/HelmRepoPane/HelmChartsView.tsx | 3 ++- .../organisms/HelmRepoPane/HelmReposView.tsx | 9 ++------- src/hooks/useGetHelmChartChangelog.ts | 4 +++- src/hooks/useGetHelmChartInfo.ts | 4 +++- src/hooks/useSearchHelmCharts.ts | 4 +++- src/redux/services/compare/fetchResources.ts | 10 ++-------- src/redux/thunks/InstallHelmRepoChart.ts | 3 ++- src/redux/thunks/cluster/loadClusterHelmReleases.ts | 3 ++- src/redux/thunks/pullHelmChart.ts | 3 ++- src/shared/utils/commands/helm.ts | 0 src/shared/utils/commands/index.ts | 1 - 21 files changed, 44 insertions(+), 43 deletions(-) delete mode 100644 src/shared/utils/commands/helm.ts diff --git a/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseHooks.tsx b/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseHooks.tsx index 07bb4a501a..e6e1808cf3 100644 --- a/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseHooks.tsx +++ b/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseHooks.tsx @@ -5,9 +5,10 @@ import {Skeleton} from 'antd'; import {useAppSelector} from '@redux/hooks'; +import {getHelmReleaseHooksCommand} from '@utils/helm'; import {KUBESHOP_MONACO_THEME} from '@utils/monaco'; -import {getHelmReleaseHooksCommand, runCommandInMainThread} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; const monacoOptions: monaco.editor.IStandaloneEditorConstructionOptions = { readOnly: true, diff --git a/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseManifest.tsx b/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseManifest.tsx index b3762cb6cd..1d56f30eb8 100644 --- a/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseManifest.tsx +++ b/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseManifest.tsx @@ -5,9 +5,10 @@ import {Skeleton} from 'antd'; import {useAppSelector} from '@redux/hooks'; +import {getHelmReleaseManifestCommand} from '@utils/helm'; import {KUBESHOP_MONACO_THEME} from '@utils/monaco'; -import {getHelmReleaseManifestCommand, runCommandInMainThread} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; const monacoOptions: monaco.editor.IStandaloneEditorConstructionOptions = { readOnly: true, diff --git a/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseNotes.tsx b/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseNotes.tsx index 62989cd355..e165968f3c 100644 --- a/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseNotes.tsx +++ b/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseNotes.tsx @@ -8,8 +8,10 @@ import styled from 'styled-components'; import {useAppSelector} from '@redux/hooks'; +import {getHelmReleaseNotesCommand} from '@utils/helm'; + import {openUrlInExternalBrowser} from '@shared/utils'; -import {getHelmReleaseNotesCommand, runCommandInMainThread} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; const HelmReleaseNotes = () => { const selectedHelmRelease = useAppSelector(state => state.dashboard.helm.selectedHelmRelease); diff --git a/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseValues.tsx b/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseValues.tsx index a7fb809e4e..83112d1226 100644 --- a/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseValues.tsx +++ b/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmReleaseValues.tsx @@ -5,9 +5,10 @@ import {Skeleton} from 'antd'; import {useAppSelector} from '@redux/hooks'; +import {getHelmReleaseValuesCommand} from '@utils/helm'; import {KUBESHOP_MONACO_THEME} from '@utils/monaco'; -import {getHelmReleaseValuesCommand, runCommandInMainThread} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; const monacoOptions: monaco.editor.IStandaloneEditorConstructionOptions = { readOnly: true, diff --git a/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmRevisionsTable.tsx b/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmRevisionsTable.tsx index c0877ac237..3dbc4d00af 100644 --- a/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmRevisionsTable.tsx +++ b/src/components/organisms/Dashboard/HelmReleaseDetails/HelmReleaseTabs/HelmRevisionsTable.tsx @@ -10,17 +10,13 @@ import {useAppDispatch, useAppSelector} from '@redux/hooks'; import {setAlert} from '@redux/reducers/alert'; import {errorAlert, successAlert} from '@utils/alert'; +import {getHelmReleaseManifestCommand, helmReleaseRevisionsCommand, rollbackHelmReleaseCommand} from '@utils/helm'; import {useMainPaneDimensions} from '@utils/hooks'; import {HelmRelease} from '@shared/models/ui'; import {Colors} from '@shared/styles'; import {trackEvent} from '@shared/utils'; -import { - getHelmReleaseManifestCommand, - helmReleaseRevisionsCommand, - rollbackHelmReleaseCommand, - runCommandInMainThread, -} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; import {useHelmReleaseDiffContext} from '../HelmReleaseContext'; diff --git a/src/components/organisms/Dashboard/HelmReleaseDetails/SelectedHelmReleaseDetails.tsx b/src/components/organisms/Dashboard/HelmReleaseDetails/SelectedHelmReleaseDetails.tsx index 7473bbe337..8c1eb9d251 100644 --- a/src/components/organisms/Dashboard/HelmReleaseDetails/SelectedHelmReleaseDetails.tsx +++ b/src/components/organisms/Dashboard/HelmReleaseDetails/SelectedHelmReleaseDetails.tsx @@ -8,15 +8,11 @@ import {setAlert} from '@redux/reducers/alert'; import {loadClusterHelmReleases} from '@redux/thunks/cluster/loadClusterHelmReleases'; import {errorAlert, successAlert} from '@utils/alert'; +import {getHelmReleaseManifestCommand, uninstallHelmReleaseCommand, upgradeHelmReleaseCommand} from '@utils/helm'; import {HelmReleaseTab} from '@shared/models/dashboard'; import {trackEvent} from '@shared/utils'; -import { - getHelmReleaseManifestCommand, - runCommandInMainThread, - uninstallHelmReleaseCommand, - upgradeHelmReleaseCommand, -} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; import HelmDryRunDiffModal from './HelmDryRunDiffModal'; import {useHelmReleaseDiffContext} from './HelmReleaseContext'; diff --git a/src/components/organisms/Dashboard/HelmReleaseDetails/UpgradeHelmReleaseModal.tsx b/src/components/organisms/Dashboard/HelmReleaseDetails/UpgradeHelmReleaseModal.tsx index 5aec584c12..a028c042a0 100644 --- a/src/components/organisms/Dashboard/HelmReleaseDetails/UpgradeHelmReleaseModal.tsx +++ b/src/components/organisms/Dashboard/HelmReleaseDetails/UpgradeHelmReleaseModal.tsx @@ -7,7 +7,9 @@ import {useAppSelector} from '@redux/hooks'; import {useSearchHelmCharts} from '@hooks/useSearchHelmCharts'; -import {runCommandInMainThread, searchHelmRepoCommand} from '@shared/utils/commands'; +import {searchHelmRepoCommand} from '@utils/helm'; + +import {runCommandInMainThread} from '@shared/utils/commands'; interface IProps { onClose: () => void; diff --git a/src/components/organisms/HelmRepoPane/HelmChartDetails/HelmChartDetails.tsx b/src/components/organisms/HelmRepoPane/HelmChartDetails/HelmChartDetails.tsx index b8285e441e..86e9065983 100644 --- a/src/components/organisms/HelmRepoPane/HelmChartDetails/HelmChartDetails.tsx +++ b/src/components/organisms/HelmRepoPane/HelmChartDetails/HelmChartDetails.tsx @@ -15,10 +15,12 @@ import {installHelmRepoChart} from '@redux/thunks/InstallHelmRepoChart'; import {HelmChartModalConfirmWithNamespaceSelect} from '@components/molecules'; +import {searchHelmRepoCommand} from '@utils/helm'; + import {Icon} from '@monokle/components'; import {HelmChartDetailsTab} from '@shared/models/ui'; import {trackEvent} from '@shared/utils'; -import {runCommandInMainThread, searchHelmRepoCommand} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; import HelmInfo from './HelmChartTabs/HelmInfo'; import HelmTemplate from './HelmChartTabs/HelmTemplate'; diff --git a/src/components/organisms/HelmRepoPane/HelmChartDetails/HelmChartTabs/HelmTemplate.tsx b/src/components/organisms/HelmRepoPane/HelmChartDetails/HelmChartTabs/HelmTemplate.tsx index 9e6e8f520f..d35028d451 100644 --- a/src/components/organisms/HelmRepoPane/HelmChartDetails/HelmChartTabs/HelmTemplate.tsx +++ b/src/components/organisms/HelmRepoPane/HelmChartDetails/HelmChartTabs/HelmTemplate.tsx @@ -3,9 +3,10 @@ import {useAsync} from 'react-use'; import {Skeleton} from 'antd'; +import {helmChartTemplateCommand} from '@utils/helm'; import {KUBESHOP_MONACO_THEME} from '@utils/monaco'; -import {helmChartTemplateCommand, runCommandInMainThread} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; interface IProps { chartName: string; diff --git a/src/components/organisms/HelmRepoPane/HelmChartDetails/HelmChartTabs/HelmValues.tsx b/src/components/organisms/HelmRepoPane/HelmChartDetails/HelmChartTabs/HelmValues.tsx index 61acfbe0eb..6cbb720c85 100644 --- a/src/components/organisms/HelmRepoPane/HelmChartDetails/HelmChartTabs/HelmValues.tsx +++ b/src/components/organisms/HelmRepoPane/HelmChartDetails/HelmChartTabs/HelmValues.tsx @@ -3,9 +3,10 @@ import {useAsync} from 'react-use'; import {Skeleton} from 'antd'; +import {helmChartValuesCommand} from '@utils/helm'; import {KUBESHOP_MONACO_THEME} from '@utils/monaco'; -import {helmChartValuesCommand, runCommandInMainThread} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; interface IProps { chartName: string; diff --git a/src/components/organisms/HelmRepoPane/HelmChartsView.tsx b/src/components/organisms/HelmRepoPane/HelmChartsView.tsx index f4b2d0ca09..2213b7ad41 100644 --- a/src/components/organisms/HelmRepoPane/HelmChartsView.tsx +++ b/src/components/organisms/HelmRepoPane/HelmChartsView.tsx @@ -17,12 +17,13 @@ import { import {sortChartsByName, useSearchHelmCharts} from '@hooks/useSearchHelmCharts'; +import {addHelmRepoCommand} from '@utils/helm'; import {useMainPaneDimensions} from '@utils/hooks'; import {Icon} from '@monokle/components'; import {ChartInfo} from '@shared/models/ui'; import {openUrlInExternalBrowser, trackEvent} from '@shared/utils'; -import {addHelmRepoCommand, runCommandInMainThread} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; import HelmChartDetails from './HelmChartDetails'; diff --git a/src/components/organisms/HelmRepoPane/HelmReposView.tsx b/src/components/organisms/HelmRepoPane/HelmReposView.tsx index a5ac4afc33..3dd7736408 100644 --- a/src/components/organisms/HelmRepoPane/HelmReposView.tsx +++ b/src/components/organisms/HelmRepoPane/HelmReposView.tsx @@ -9,16 +9,11 @@ import {useAppDispatch, useAppSelector} from '@redux/hooks'; import {setAlert} from '@redux/reducers/alert'; import {errorAlert, successAlert} from '@utils/alert'; +import {addHelmRepoCommand, listHelmRepoCommand, removeHelmRepoCommand, updateHelmRepoCommand} from '@utils/helm'; import {useMainPaneDimensions} from '@utils/hooks'; import {trackEvent} from '@shared/utils'; -import { - addHelmRepoCommand, - listHelmRepoCommand, - removeHelmRepoCommand, - runCommandInMainThread, - updateHelmRepoCommand, -} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; import * as S from './styled'; diff --git a/src/hooks/useGetHelmChartChangelog.ts b/src/hooks/useGetHelmChartChangelog.ts index a19855b033..a7e12fb0e9 100644 --- a/src/hooks/useGetHelmChartChangelog.ts +++ b/src/hooks/useGetHelmChartChangelog.ts @@ -1,6 +1,8 @@ import {useAsync} from 'react-use'; -import {helmChartReadmeCommand, runCommandInMainThread} from '@shared/utils/commands'; +import {helmChartReadmeCommand} from '@utils/helm'; + +import {runCommandInMainThread} from '@shared/utils/commands'; export const useGetHelmChartChangelog = (chartName: string) => { const state = useAsync(async () => { diff --git a/src/hooks/useGetHelmChartInfo.ts b/src/hooks/useGetHelmChartInfo.ts index a9527aaca8..8808e997b7 100644 --- a/src/hooks/useGetHelmChartInfo.ts +++ b/src/hooks/useGetHelmChartInfo.ts @@ -3,7 +3,9 @@ import {useAsyncFn} from 'react-use'; import YAML from 'yaml'; -import {helmChartInfoCommand, runCommandInMainThread} from '@shared/utils/commands'; +import {helmChartInfoCommand} from '@utils/helm'; + +import {runCommandInMainThread} from '@shared/utils/commands'; export const useGetHelmChartInfo = (helmChartName: string) => { const [state, fetchChart] = useAsyncFn(async (): Promise => { diff --git a/src/hooks/useSearchHelmCharts.ts b/src/hooks/useSearchHelmCharts.ts index eb27acc227..71fcf83813 100644 --- a/src/hooks/useSearchHelmCharts.ts +++ b/src/hooks/useSearchHelmCharts.ts @@ -1,8 +1,10 @@ import {useMemo} from 'react'; import {useAsync} from 'react-use'; +import {searchHelmHubCommand, searchHelmRepoCommand} from '@utils/helm'; + import {ChartInfo} from '@shared/models/ui'; -import {runCommandInMainThread, searchHelmHubCommand, searchHelmRepoCommand} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; export const useSearchHelmCharts = (helmRepoSearch: string, includeHubSearch: boolean) => { const { diff --git a/src/redux/services/compare/fetchResources.ts b/src/redux/services/compare/fetchResources.ts index 720bb2e08d..96ced33d99 100644 --- a/src/redux/services/compare/fetchResources.ts +++ b/src/redux/services/compare/fetchResources.ts @@ -12,7 +12,7 @@ import {createKubeClientWithSetup} from '@redux/cluster/service/kube-client'; import {getCommitResources} from '@redux/git/git.ipc'; import {runKustomize} from '@redux/thunks/preview'; -import {buildHelmCommand} from '@utils/helm'; +import {buildHelmCommand, createHelmInstallCommand, createHelmTemplateCommand} from '@utils/helm'; import {ERROR_MSG_FALLBACK} from '@shared/constants/constants'; import {ROOT_FILE_ENTRY} from '@shared/constants/fileEntry'; @@ -31,12 +31,7 @@ import { import {K8sResource} from '@shared/models/k8sResource'; import {RootState} from '@shared/models/rootState'; import {selectKubeconfig} from '@shared/utils/cluster/selectors'; -import { - createHelmInstallCommand, - createHelmTemplateCommand, - hasCommandFailed, - runCommandInMainThread, -} from '@shared/utils/commands'; +import {hasCommandFailed, runCommandInMainThread} from '@shared/utils/commands'; import {isDefined} from '@shared/utils/filter'; import getClusterObjects from '../getClusterObjects'; @@ -191,7 +186,6 @@ async function previewHelmResources(state: RootState, options: HelmResourceSet): command = createHelmInstallCommand( { - kubeContext: currentContext, values: path.join(folder, valuesFile.name), name: folder, chart: chart.name, diff --git a/src/redux/thunks/InstallHelmRepoChart.ts b/src/redux/thunks/InstallHelmRepoChart.ts index 78c9165140..63a70a503b 100644 --- a/src/redux/thunks/InstallHelmRepoChart.ts +++ b/src/redux/thunks/InstallHelmRepoChart.ts @@ -3,11 +3,12 @@ import {createAsyncThunk} from '@reduxjs/toolkit'; import {setAlert} from '@redux/reducers/alert'; import {errorAlert, successAlert} from '@utils/alert'; +import {installHelmRepoChartCommand} from '@utils/helm'; import {AppDispatch} from '@shared/models/appDispatch'; import {RootState} from '@shared/models/rootState'; import {kubeConfigPathSelector} from '@shared/utils'; -import {installHelmRepoChartCommand, runCommandInMainThread} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; export const installHelmRepoChart = createAsyncThunk< void, diff --git a/src/redux/thunks/cluster/loadClusterHelmReleases.ts b/src/redux/thunks/cluster/loadClusterHelmReleases.ts index 6c68576386..eb16b25e44 100644 --- a/src/redux/thunks/cluster/loadClusterHelmReleases.ts +++ b/src/redux/thunks/cluster/loadClusterHelmReleases.ts @@ -4,11 +4,12 @@ import {setHelmReleases} from '@redux/dashboard'; import {setAlert} from '@redux/reducers/alert'; import {errorAlert} from '@utils/alert'; +import {listHelmReleasesCommand} from '@utils/helm'; import {AppDispatch} from '@shared/models/appDispatch'; import {RootState} from '@shared/models/rootState'; import {HelmRelease} from '@shared/models/ui'; -import {listHelmReleasesCommand, runCommandInMainThread} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; export const loadClusterHelmReleases = createAsyncThunk( 'dashboard/getHelmReleases', diff --git a/src/redux/thunks/pullHelmChart.ts b/src/redux/thunks/pullHelmChart.ts index b8bb508f67..eff988aca0 100644 --- a/src/redux/thunks/pullHelmChart.ts +++ b/src/redux/thunks/pullHelmChart.ts @@ -7,10 +7,11 @@ import {selectFile} from '@redux/reducers/main'; import {setExplorerSelectedSection, setIsInQuickClusterMode, setLeftMenuSelection} from '@redux/reducers/ui'; import {errorAlert, successAlert} from '@utils/alert'; +import {helmPullChartCommand} from '@utils/helm'; import {AppDispatch} from '@shared/models/appDispatch'; import {RootState} from '@shared/models/rootState'; -import {helmPullChartCommand, runCommandInMainThread} from '@shared/utils/commands'; +import {runCommandInMainThread} from '@shared/utils/commands'; import {setCreateProject, setOpenProject} from './project'; diff --git a/src/shared/utils/commands/helm.ts b/src/shared/utils/commands/helm.ts deleted file mode 100644 index e69de29bb2..0000000000 diff --git a/src/shared/utils/commands/index.ts b/src/shared/utils/commands/index.ts index 735193ea61..7941eda657 100644 --- a/src/shared/utils/commands/index.ts +++ b/src/shared/utils/commands/index.ts @@ -1,2 +1 @@ export * from './execute'; -export * from './helm'; From 5aa7453b80a1afd6a37c352542e8334c781440ec Mon Sep 17 00:00:00 2001 From: Dev Catalin <20538711+devcatalin@users.noreply.github.com> Date: Thu, 13 Jul 2023 14:38:01 +0300 Subject: [PATCH 15/26] fix: store circular dependencies --- src/redux/cluster/getters.ts | 22 +++++++++++++++++++ .../cluster/listeners/clusterArgsChanged.ts | 22 +++++++++++++++++++ src/redux/cluster/listeners/index.ts | 3 ++- src/utils/cluster.ts | 16 ++------------ 4 files changed, 48 insertions(+), 15 deletions(-) create mode 100644 src/redux/cluster/getters.ts create mode 100644 src/redux/cluster/listeners/clusterArgsChanged.ts diff --git a/src/redux/cluster/getters.ts b/src/redux/cluster/getters.ts new file mode 100644 index 0000000000..16aba201c1 --- /dev/null +++ b/src/redux/cluster/getters.ts @@ -0,0 +1,22 @@ +// The getters from this file are only used to build the cluster args for helm commands. +// Due to circular dependencies, we can't import the store into the utils/helm file to get the context and proxy port. +// Thus, we rely on the clusterArgsChanged listener to update these getters when the cluster args change. + +let context: string | undefined; +let proxyPort: number | undefined; + +export function getKubeContext(): string | undefined { + return context; +} + +export function setKubeContext(newContext: string | undefined) { + context = newContext; +} + +export function getClusterProxyPort(): number | undefined { + return proxyPort; +} + +export function setClusterProxyPort(newProxyPort: number | undefined) { + proxyPort = newProxyPort; +} diff --git a/src/redux/cluster/listeners/clusterArgsChanged.ts b/src/redux/cluster/listeners/clusterArgsChanged.ts new file mode 100644 index 0000000000..d90f2461a2 --- /dev/null +++ b/src/redux/cluster/listeners/clusterArgsChanged.ts @@ -0,0 +1,22 @@ +import {AppListenerFn} from '@redux/listeners/base'; + +import {setClusterProxyPort, setKubeContext} from '../getters'; + +// More information about why this is needed in the ../getters file +export const clusterArgsChangedListener: AppListenerFn = listen => { + listen({ + predicate: (_, currentState, originalState) => { + if (currentState.main.clusterConnection?.context !== originalState.main.clusterConnection?.context) { + return true; + } + if (currentState.cluster.proxyPort !== originalState.cluster.proxyPort) { + return true; + } + return false; + }, + effect: async (_, {getState}) => { + setKubeContext(getState().main.clusterConnection?.context); + setClusterProxyPort(getState().cluster.proxyPort); + }, + }); +}; diff --git a/src/redux/cluster/listeners/index.ts b/src/redux/cluster/listeners/index.ts index 6e5cb69faf..02b32bd446 100644 --- a/src/redux/cluster/listeners/index.ts +++ b/src/redux/cluster/listeners/index.ts @@ -1,3 +1,4 @@ +import {clusterArgsChangedListener} from './clusterArgsChanged'; import {kubeConfigListener, kubeconfigPathUpdateListener} from './kubeconfig'; -export const clusterListeners = [kubeConfigListener, kubeconfigPathUpdateListener]; +export const clusterListeners = [kubeConfigListener, kubeconfigPathUpdateListener, clusterArgsChangedListener]; diff --git a/src/utils/cluster.ts b/src/utils/cluster.ts index 7053cd387d..67c9c9ae22 100644 --- a/src/utils/cluster.ts +++ b/src/utils/cluster.ts @@ -1,16 +1,4 @@ -import store from '@redux/store'; - -export function getKubeContext(): string | undefined { - return store.getState().main.clusterConnection?.context; -} - -export function getClusterNamespace(): string | undefined { - return store.getState().main.clusterConnection?.namespace; -} - -export function getClusterProxyPort(): number | undefined { - return store.getState().cluster.proxyPort; -} +import {getClusterProxyPort, getKubeContext} from '@redux/cluster/getters'; export function getHelmClusterArgs(): string[] { const context = getKubeContext(); @@ -18,5 +6,5 @@ export function getHelmClusterArgs(): string[] { if (!context || !proxyPort) return []; - return ['--kube-context', context, '--kube-api-server', `http://127.0.0.1:${proxyPort}`]; + return ['--kube-context', context, '--kube-apiserver', `http://127.0.0.1:${proxyPort}`]; } From 41b57cb5df7cd2a567864d97c52ddd90c336a8f8 Mon Sep 17 00:00:00 2001 From: Mahmoud Mortada Date: Thu, 13 Jul 2023 15:28:02 +0300 Subject: [PATCH 16/26] fix: added telemetry --- .../ProjectOverview/ProjectOverview.tsx | 63 +++++++++++-------- .../ActionsPane/ProjectOverview/styled.tsx | 9 +++ src/shared/models/telemetry.ts | 8 +++ 3 files changed, 55 insertions(+), 25 deletions(-) diff --git a/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx b/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx index 3e76622d00..9ead684606 100644 --- a/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx +++ b/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx @@ -22,7 +22,8 @@ import {setValidationFilters} from '@redux/validation/validation.slice'; import {useRefSelector} from '@utils/hooks'; import {SettingsPanel} from '@shared/models/config'; -import {openDocumentation} from '@shared/utils'; +import {ExplorerCollapsibleSectionsType} from '@shared/models/ui'; +import {openDocumentation, trackEvent} from '@shared/utils'; import * as S from './styled'; @@ -42,32 +43,44 @@ const ProjectOverview = () => { e.stopPropagation(); dispatch(setActiveSettingsPanel(SettingsPanel.ValidationSettings)); dispatch(setLeftMenuSelection('settings')); + trackEvent('project_summary/select_validation_settings'); }; - const onClickErrorsCountHandler = () => { - dispatch(setValidationFilters({...currentFilters.current, type: 'error'})); + const onClickValidationHandler = (type?: 'warning' | 'error') => { + dispatch(setValidationFilters({...currentFilters.current, type})); + dispatch(setLeftMenuSelection('validation')); + trackEvent('project_summary/select_validation', {type}); }; - const onClickWarningsCountHandler = () => { - dispatch(setValidationFilters({...currentFilters.current, type: 'warning'})); - dispatch(setLeftMenuSelection('validation')); + const onClickHelmRepoHandler = () => { + dispatch(setLeftMenuSelection('helm')); + trackEvent('project_summary/select_helm_repo'); }; const onClickCompareHandler = () => { dispatch(setLeftMenuSelection('compare')); + trackEvent('project_summary/select_compare'); }; const onClickNewAIResourceHandler = () => { dispatch(openNewAiResourceWizard()); + trackEvent('project_summary/new_ai_resource'); }; const onClickNewResourcesTemplateHandler = () => { dispatch(openTemplateExplorer()); + trackEvent('project_summary/new_template_resource'); }; const onClickNewResourceHandler = () => { dispatch(openNewResourceWizard()); + trackEvent('project_summary/new_empty_resource'); + }; + + const onChangeExplorerSelectionHandler = (key: ExplorerCollapsibleSectionsType) => { + dispatch(setExplorerSelectedSection(key)); + trackEvent('project_summary/select_explorer_section', {section: key}); }; return ( @@ -84,16 +97,16 @@ const ProjectOverview = () => { Misconfigurations - -
+ onClickValidationHandler('error')}> +
{errorsCount} errors
- -
+ onClickValidationHandler('warning')}> +
{warningsCount} warnings
@@ -101,9 +114,9 @@ const ProjectOverview = () => { - Analyze and fix errors in the{' '} - dispatch(setLeftMenuSelection('validation'))}>Validation Pane, configure - your policy in the Policy Configuration + Analyze and fix errors in the onClickValidationHandler()}>Validation Pane, + configure your policy in the{' '} + Policy Configuration @@ -113,8 +126,8 @@ const ProjectOverview = () => {
-
- {filesCount} +
+ onChangeExplorerSelectionHandler('files')}>{filesCount} Files
@@ -132,8 +145,8 @@ const ProjectOverview = () => { ) : ( - dispatch(setExplorerSelectedSection('files'))}>Check out files and - resources in the left to see relations, edit and fix errors. + onChangeExplorerSelectionHandler('files')}>Check out files and resources + in the left to see relations, edit and fix errors. )} @@ -145,21 +158,21 @@ const ProjectOverview = () => { Helm -
- dispatch(setExplorerSelectedSection('helm'))}>{helmChartsCount} +
+ onChangeExplorerSelectionHandler('helm')}>{helmChartsCount} Helm Charts
{helmChartsCount === 0 ? ( - dispatch(setLeftMenuSelection('helm'))}> + onClickHelmRepoHandler()}> Browse Helm Charts to download / install Add Helm repository ) : ( - dispatch(setExplorerSelectedSection('helm'))}>Check out Helm Charts + onChangeExplorerSelectionHandler('helm')}>Check out Helm Charts found on your files. You can dry-run them and - dispatch(setLeftMenuSelection('helm'))}> add new Helm Charts. + onClickHelmRepoHandler()}> add new Helm Charts. )} @@ -174,8 +187,8 @@ const ProjectOverview = () => { No Kustomize Overlays found
) : ( -
- dispatch(setExplorerSelectedSection('kustomize'))}> +
+ onChangeExplorerSelectionHandler('kustomize')}> {kustomizationsResourcesCount} Kustomize overlays @@ -184,7 +197,7 @@ const ProjectOverview = () => { - dispatch(setExplorerSelectedSection('kustomize'))}> + onChangeExplorerSelectionHandler('kustomize')}> Check out Kustimize overlays{' '} found on your files. You can dry-run them. diff --git a/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx b/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx index e32eaab11a..1991c36f3a 100644 --- a/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx +++ b/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx @@ -155,6 +155,15 @@ export const CountChip = styled.span<{$type: 'error' | 'warning' | 'resource'}>` (props.$type === 'error' && Colors.red7) || (props.$type === 'resource' && Colors.geekblue7)}; } + + .clickable-text:hover { + & .ant-typography { + color: ${props => + (props.$type === 'warning' && Colors.yellow10) || + (props.$type === 'error' && Colors.volcano8) || + (props.$type === 'resource' && Colors.geekblue9)}; + } + } `; export const ResourcesContainer = styled.div<{$hasResources: boolean}>` diff --git a/src/shared/models/telemetry.ts b/src/shared/models/telemetry.ts index 69a11ba8c8..a69cc800b5 100644 --- a/src/shared/models/telemetry.ts +++ b/src/shared/models/telemetry.ts @@ -184,6 +184,14 @@ export type EventMap = { 'validation/load_config': {actionType: string}; 'validation/validate_all': {actionType: string; resourcesCount: number; executionTime: number}; 'validation/validate_incremental': {actionType: string; resourcesCount: number; executionTime: number}; + 'project_summary/select_validation_settings': undefined; + 'project_summary/select_validation': {type?: 'warning' | 'error'}; + 'project_summary/select_compare': undefined; + 'project_summary/select_helm_repo': undefined; + 'project_summary/new_template_resource': undefined; + 'project_summary/new_empty_resource': undefined; + 'project_summary/new_ai_resource': undefined; + 'project_summary/select_explorer_section': {section: string}; }; export const APP_INSTALLED = 'APP_INSTALLED'; From b2a1f66f4e7c6f4af0e4901c8ac1a831f24378c6 Mon Sep 17 00:00:00 2001 From: Dev Catalin <20538711+devcatalin@users.noreply.github.com> Date: Thu, 13 Jul 2023 17:06:53 +0300 Subject: [PATCH 17/26] refactor: build test action --- .github/workflows/monokle-publish-test.yml | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/.github/workflows/monokle-publish-test.yml b/.github/workflows/monokle-publish-test.yml index 859fb3bf62..06226dae97 100644 --- a/.github/workflows/monokle-publish-test.yml +++ b/.github/workflows/monokle-publish-test.yml @@ -4,8 +4,7 @@ name: monokle-sign-notarize-publish-test on: push: branches: - # Add your branch name here - - erdikose/test/test + - build/test # Allows you to run this workflow manually from the Actions tab workflow_dispatch: @@ -32,6 +31,8 @@ jobs: # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it. - name: Checkout Project uses: actions/checkout@v2 + with: + ref: build/test # Check memory and cpu - name: Verify Runner Resources From 225d038800585f5f1d6accb13f3205be461f6415 Mon Sep 17 00:00:00 2001 From: Mahmoud Mortada Date: Fri, 14 Jul 2023 13:08:35 +0300 Subject: [PATCH 18/26] fix: add label to the clickable area --- .../ProjectOverview/ProjectOverview.tsx | 23 ++++++++++--------- .../ActionsPane/ProjectOverview/styled.tsx | 5 +++- 2 files changed, 16 insertions(+), 12 deletions(-) diff --git a/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx b/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx index 9ead684606..1069676a4f 100644 --- a/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx +++ b/src/components/organisms/ActionsPane/ProjectOverview/ProjectOverview.tsx @@ -126,10 +126,10 @@ const ProjectOverview = () => {
-
- onChangeExplorerSelectionHandler('files')}>{filesCount} + onChangeExplorerSelectionHandler('files')}> + {filesCount} Files -
+ {resourcesCount} Resources @@ -158,10 +158,10 @@ const ProjectOverview = () => { Helm -
- onChangeExplorerSelectionHandler('helm')}>{helmChartsCount} + onChangeExplorerSelectionHandler('helm')}> + {helmChartsCount} Helm Charts -
+ {helmChartsCount === 0 ? ( @@ -187,12 +187,13 @@ const ProjectOverview = () => { No Kustomize Overlays found
) : ( -
- onChangeExplorerSelectionHandler('kustomize')}> - {kustomizationsResourcesCount} - + onChangeExplorerSelectionHandler('kustomize')} + > + {kustomizationsResourcesCount} Kustomize overlays -
+ )} diff --git a/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx b/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx index 1991c36f3a..d8c7f9241e 100644 --- a/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx +++ b/src/components/organisms/ActionsPane/ProjectOverview/styled.tsx @@ -172,6 +172,10 @@ export const ResourcesContainer = styled.div<{$hasResources: boolean}>` } `; +export const CountContainer = styled.div` + cursor: ${onClick => (onClick ? 'pointer' : 'default')}; +`; + export const Count = styled(Typography.Text)` display: flex; gap: 4px; @@ -180,7 +184,6 @@ export const Count = styled(Typography.Text)` overflow: hidden; text-overflow: ellipsis; min-width: 0; - cursor: ${({onClick}) => (onClick ? 'pointer' : 'default')}; &.ant-typography { display: flex; From 867a739b6736b376631a6b0b86736274065cbee1 Mon Sep 17 00:00:00 2001 From: Mahmoud Mortada Date: Fri, 14 Jul 2023 15:41:44 +0300 Subject: [PATCH 19/26] fix: helm browse instead of helm releases --- src/components/organisms/DashboardPane/DashboardPane.tsx | 9 --------- src/components/organisms/PaneManager/activities.tsx | 8 ++++---- src/shared/models/ui.ts | 2 +- 3 files changed, 5 insertions(+), 14 deletions(-) diff --git a/src/components/organisms/DashboardPane/DashboardPane.tsx b/src/components/organisms/DashboardPane/DashboardPane.tsx index 17a4bb9912..1c9017dd60 100644 --- a/src/components/organisms/DashboardPane/DashboardPane.tsx +++ b/src/components/organisms/DashboardPane/DashboardPane.tsx @@ -1,5 +1,3 @@ -import {useEffect} from 'react'; - import {setDashboardActiveAccordion} from '@redux/dashboard'; import {useAppDispatch, useAppSelector} from '@redux/hooks'; @@ -15,13 +13,6 @@ const accordionsKeys = ['cluster-resources', 'helm-releases', 'images'] as Dashb const DashboardPane = () => { const dispatch = useAppDispatch(); const activeKey = useAppSelector(state => state.dashboard.ui.activeAccordion); - const leftMenuSelection = useAppSelector(state => state.ui.leftMenu.selection); - - useEffect(() => { - if (leftMenuSelection === 'helm-releases') { - dispatch(setDashboardActiveAccordion('helm-releases')); - } - }, [dispatch, leftMenuSelection]); return ( diff --git a/src/components/organisms/PaneManager/activities.tsx b/src/components/organisms/PaneManager/activities.tsx index 34f76061f2..fa85188937 100644 --- a/src/components/organisms/PaneManager/activities.tsx +++ b/src/components/organisms/PaneManager/activities.tsx @@ -102,11 +102,11 @@ export const activities: ActivityType[] = [ isVisible: () => Boolean(useAppSelector(isInClusterModeSelector)), }, { - type: 'panel', - name: 'helm-releases', - tooltip: 'View helm releases', + type: 'fullscreen', + name: 'helm-in-cluster', + tooltip: 'View helm browser', icon: () => , - component: , + component: , useBadge: () => undefined, isVisible: () => Boolean(useAppSelector(isInClusterModeSelector)), }, diff --git a/src/shared/models/ui.ts b/src/shared/models/ui.ts index 0c9edbbf7f..1c09e21189 100644 --- a/src/shared/models/ui.ts +++ b/src/shared/models/ui.ts @@ -70,7 +70,7 @@ export const LeftMenuSelectionOptions = [ 'settings', 'dashboard', 'helm', - 'helm-releases', + 'helm-in-cluster', 'cluster-validation', 'close', ] as const; From 9bfbbbe1b2a068256dab8cef65e827d135827a83 Mon Sep 17 00:00:00 2001 From: Dev Catalin <20538711+devcatalin@users.noreply.github.com> Date: Mon, 17 Jul 2023 12:25:29 +0300 Subject: [PATCH 20/26] fix: ENV kubeconfig with multiple files --- electron/app/services/cluster/ipc.ts | 2 ++ .../cluster/utils/getDefaultKubeConfig.ts | 5 +++++ src/redux/cluster/listeners/kubeconfig.ts | 8 +++++--- src/redux/cluster/selectors.ts | 15 +++++++++++++-- src/redux/cluster/service/kube-control.ts | 1 + 5 files changed, 26 insertions(+), 5 deletions(-) diff --git a/electron/app/services/cluster/ipc.ts b/electron/app/services/cluster/ipc.ts index 4d523e84cf..8d2d607108 100644 --- a/electron/app/services/cluster/ipc.ts +++ b/electron/app/services/cluster/ipc.ts @@ -1,5 +1,6 @@ import {handleIpc} from '../../utils/ipc'; import {debugProxy, getKubeConfig, setup, stopWatchingKubeconfig, watchKubeconfig} from './handlers'; +import {getEnvKubeconfigs} from './utils/getDefaultKubeConfig'; // Cluster & Proxy management handleIpc('cluster:setup', setup); @@ -7,5 +8,6 @@ handleIpc('cluster:debug-proxy', debugProxy); // Kubeconfig management handleIpc('kubeconfig:get', getKubeConfig); +handleIpc('kubeconfig:get:env', getEnvKubeconfigs); handleIpc('kubeconfig:watch', watchKubeconfig); handleIpc('kubeconfig:watch:stop', stopWatchingKubeconfig); diff --git a/electron/app/services/cluster/utils/getDefaultKubeConfig.ts b/electron/app/services/cluster/utils/getDefaultKubeConfig.ts index 67c4a06136..3bea5ee6b0 100644 --- a/electron/app/services/cluster/utils/getDefaultKubeConfig.ts +++ b/electron/app/services/cluster/utils/getDefaultKubeConfig.ts @@ -15,3 +15,8 @@ export function getDefaultKubeConfig() { const kubeConfigPath = path.join(home, `${path.sep}.kube${path.sep}config`); return kubeConfigPath; } + +export function getEnvKubeconfigs(): string[] { + const kubeconfig = getDefaultKubeConfig(); + return kubeconfig.split(':'); +} diff --git a/src/redux/cluster/listeners/kubeconfig.ts b/src/redux/cluster/listeners/kubeconfig.ts index ddc78b1724..ff93b79c7f 100644 --- a/src/redux/cluster/listeners/kubeconfig.ts +++ b/src/redux/cluster/listeners/kubeconfig.ts @@ -20,7 +20,7 @@ import {setOpenProject} from '@redux/thunks/project'; import {KubeConfig, ModernKubeConfig} from '@shared/models/config'; import {selectKubeconfigPaths} from '../selectors'; -import {stopWatchKubeconfig, watchKubeconfig} from '../service/kube-control'; +import {getEnvKubeconfigs, stopWatchKubeconfig, watchKubeconfig} from '../service/kube-control'; import {kubeconfigPathsUpdated, kubeconfigUpdated} from '../slice'; export const startWatchingKubeconfig = createAction('cluster/startKubeConfigWatch'); @@ -32,7 +32,8 @@ export const kubeConfigListener: AppListenerFn = listen => { effect: async (_, {getState, dispatch, condition, unsubscribe, subscribe}) => { unsubscribe(); - const kubeconfigs = selectKubeconfigPaths(getState()); + const ENV_KUBECONFIGS = await getEnvKubeconfigs(); + const kubeconfigs = [...ENV_KUBECONFIGS, ...selectKubeconfigPaths(getState())]; const listener = (_event: any, config: ModernKubeConfig | undefined) => { const oldConfig = config ? getState().cluster.kubeconfigs[config.path] : undefined; @@ -123,7 +124,8 @@ export const kubeconfigPathUpdateListener: AppListenerFn = listen => { return; } - const kubeconfigs = selectKubeconfigPaths(getState()); + const ENV_KUBECONFIG = await getEnvKubeconfigs(); + const kubeconfigs = [...ENV_KUBECONFIG, ...selectKubeconfigPaths(getState())]; dispatch(kubeconfigPathsUpdated({kubeconfigs})); await watchKubeconfig({kubeconfigs}); }, diff --git a/src/redux/cluster/selectors.ts b/src/redux/cluster/selectors.ts index 3401569c85..8c618ba8dd 100644 --- a/src/redux/cluster/selectors.ts +++ b/src/redux/cluster/selectors.ts @@ -26,8 +26,19 @@ export const selectKubeconfigPaths = (state: RootState): string[] => { const configsFromClusterSlice = state.cluster.configPaths; const globalConfig = state.config.kubeConfig.path; const projectConfig = state.config.projectConfig?.kubeConfig?.path; - const allConfigs = [...configsFromClusterSlice, globalConfig, projectConfig].filter(isDefined); - return uniq(allConfigs); + let allConfigs = [...configsFromClusterSlice, globalConfig, projectConfig].filter(isDefined); + allConfigs = uniq( + allConfigs + .map(config => { + // KUBECONFIG ENV VAR can contain multiple paths separated by ':' + if (config.includes(':')) { + return config.split(':'); + } + return config; + }) + .flat() + ); + return allConfigs; }; export const selectCurrentContextId = createSelector( diff --git a/src/redux/cluster/service/kube-control.ts b/src/redux/cluster/service/kube-control.ts index b1b5ba4a9a..9d38450591 100644 --- a/src/redux/cluster/service/kube-control.ts +++ b/src/redux/cluster/service/kube-control.ts @@ -13,6 +13,7 @@ import {runCommandInMainThread} from '@shared/utils/commands'; export const setup = invokeIpc('cluster:setup'); export const debugProxy = invokeIpc('cluster:debug-proxy'); export const getKubeconfig = invokeIpc<{path: string | undefined}, ModernKubeConfig>('kubeconfig:get'); +export const getEnvKubeconfigs = invokeIpc('kubeconfig:get:env'); export const watchKubeconfig = invokeIpc<{kubeconfigs: string[]}, void>('kubeconfig:watch'); export const stopWatchKubeconfig = invokeIpc('kubeconfig:watch:stop'); From 74d4d23800f7d88b7a3063c842530d50e6e16710 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed, 19 Jul 2023 05:41:48 +0000 Subject: [PATCH 21/26] chore(deps-dev): bump word-wrap from 1.2.3 to 1.2.4 Bumps [word-wrap](https://github.com/jonschlinkert/word-wrap) from 1.2.3 to 1.2.4. - [Release notes](https://github.com/jonschlinkert/word-wrap/releases) - [Commits](https://github.com/jonschlinkert/word-wrap/compare/1.2.3...1.2.4) --- updated-dependencies: - dependency-name: word-wrap dependency-type: indirect ... Signed-off-by: dependabot[bot] --- package-lock.json | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index 368e5ae22a..e2f988f2a3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -28262,9 +28262,10 @@ "license": "MIT" }, "node_modules/word-wrap": { - "version": "1.2.3", + "version": "1.2.4", + "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.4.tgz", + "integrity": "sha512-2V81OA4ugVo5pRo46hAoD2ivUJx8jXmWXfUkY4KFNw0hEptvN0QfH3K4nHiwzGeKl5rFKedV48QVoqYavy4YpA==", "dev": true, - "license": "MIT", "engines": { "node": ">=0.10.0" } From 9e2bc981234619ad15d17b9ad1d9fd4f7967f18e Mon Sep 17 00:00:00 2001 From: Dev Catalin <20538711+devcatalin@users.noreply.github.com> Date: Fri, 21 Jul 2023 11:19:31 +0300 Subject: [PATCH 22/26] fix: helm dry run configuration --- .../ValidationCustom/ValidationLevelSelect.tsx | 6 ++---- src/redux/thunks/runPreviewConfiguration.ts | 2 +- src/redux/validation/validation.slice.ts | 9 ++------- 3 files changed, 5 insertions(+), 12 deletions(-) diff --git a/src/components/organisms/ValidationSettings/ValidationCustom/ValidationLevelSelect.tsx b/src/components/organisms/ValidationSettings/ValidationCustom/ValidationLevelSelect.tsx index 9ff2e72cea..2d81e4b877 100644 --- a/src/components/organisms/ValidationSettings/ValidationCustom/ValidationLevelSelect.tsx +++ b/src/components/organisms/ValidationSettings/ValidationCustom/ValidationLevelSelect.tsx @@ -3,6 +3,7 @@ import {Select, Tooltip} from 'antd'; import styled from 'styled-components'; import {TOOLTIP_DELAY} from '@constants/constants'; +import {ValidationLevelSelectTooltip} from '@constants/tooltips'; import {ProblemIcon} from '@monokle/components'; import {Colors} from '@shared/styles/colors'; @@ -19,10 +20,7 @@ const ValidationLevelSelect: React.FC = props => { const {rule, disabled, handleChange} = props; return ( - +