feat: minor improvements

src/components/organisms/Dashboard/EmptyDashboard.tsx

@@ -1,20 +1,23 @@
+import {shell} from 'electron';
+
 import {useCallback, useEffect, useRef, useState} from 'react';
 
 import {QuestionCircleFilled} from '@ant-design/icons';
 
 import {motion, useAnimationControls} from 'framer-motion';
 import styled from 'styled-components';
 
+import {activeProjectSelector} from '@redux/appConfig';
 import {startWatchingKubeconfig, stopWatchingKubeconfig} from '@redux/cluster/listeners/kubeconfig';
 import {selectCurrentContextId, selectKubeconfig, useClusterSelector} from '@redux/cluster/selectors';
 import {pingCluster} from '@redux/cluster/thunks/ping';
 import {useAppDispatch, useAppSelector} from '@redux/hooks';
-import {setLeftMenuSelection} from '@redux/reducers/ui';
+import {setActiveSettingsPanel, setLeftMenuSelection} from '@redux/reducers/ui';
 
 import {ContextId, MonokleClusterError} from '@shared/ipc';
-import {ModernKubeConfig} from '@shared/models/config';
+import {ModernKubeConfig, SettingsPanel} from '@shared/models/config';
 import {Colors} from '@shared/styles';
-import {openUrlInExternalBrowser} from '@shared/utils/shell';
+import {openDiscord, openUrlInExternalBrowser} from '@shared/utils/shell';
 
 import {ClusterIndication} from './Disconnected/ClusterIndication';
 import ClusterFigure from './Disconnected/ConnectIcon.svg';
@@ -25,6 +28,7 @@ export const EmptyDashboard = () => {
   const dispatch = useAppDispatch();
   const contextId = useAppSelector(selectCurrentContextId);
   const [debug, setDebug] = useState(false);
+  const activeProject = useAppSelector(activeProjectSelector);
 
   const toggleDebug = useCallback(
     (newDebug?: boolean) => {
@@ -41,6 +45,23 @@ export const EmptyDashboard = () => {
     toggleDebug(false);
   }, [toggleDebug]);
 
+  const goToSettings = useCallback(() => {
+    dispatch(
+      setActiveSettingsPanel(
+        activeProject ? SettingsPanel.CurrentProjectSettings : SettingsPanel.DefaultProjectSettings
+      )
+    );
+    dispatch(setLeftMenuSelection('settings'));
+  }, [activeProject, dispatch]);
+
+  const goToDiscord = useCallback(() => {
+    openDiscord();
+  }, []);
+
+  const goToDocs = useCallback(() => {
+    shell.openExternal('https://kubeshop.github.io/monokle/cluster-mode');
+  }, []);
+
   useEffect(() => {
     dispatch(pingCluster());
   }, [contextId, dispatch]);
@@ -57,17 +78,17 @@ export const EmptyDashboard = () => {
         <Header>Connect to your cluster</Header>
 
         <p>
-          Monokle automatically detects and updates your Kubeconfig file. You can also go to your <a>Settings</a> to
-          declare them manually.
+          Monokle automatically detects and updates your Kubeconfig file. You can also go to your{' '}
+          <a onClick={goToSettings}>Settings</a> to declare them manually.
         </p>
 
         <HelpMessage>
           <p style={{marginBottom: 4}}>
             <QuestionCircleFilled /> Help & Tips
           </p>
           <p>
-            <a>Learn more</a> about cluster insights. Looking for help? Reach out to us in <a>our Discord channel</a> -
-            we are glad to help you.
+            <a onClick={goToDocs}>Learn more</a> about cluster insights. Looking for help? Reach out to us in{' '}
+            <a onClick={goToDiscord}>our Discord channel</a> - we are glad to help you.
           </p>
         </HelpMessage>
 

src/components/organisms/PageHeader/ClusterControl/ContextSelect.tsx

@@ -11,10 +11,10 @@ import {selectKubeconfig} from '@redux/cluster/selectors';
 import {useAppDispatch, useAppSelector} from '@redux/hooks';
 import {setLeftMenuSelection} from '@redux/reducers/ui';
 
+import {Icon} from '@monokle/components';
 import {Colors} from '@shared/styles';
 
 import {ClusterSelectionTable} from '../ClusterSelectionTable';
-import * as S from '../Controls.styled';
 
 export function ContextSelect() {
   const kubeconfig = useAppSelector(selectKubeconfig);
@@ -39,7 +39,10 @@ export function ContextSelect() {
       trigger={['hover']}
     >
       <div>
-        <Trigger icon={<S.ClusterOutlined />} value={kubeconfig.currentContext} />
+        <Trigger
+          icon={<Icon name="cluster-dashboard" style={{fontSize: '14px', marginTop: 4}} />}
+          value={kubeconfig.currentContext}
+        />
       </div>
     </Dropdown>
   );
@@ -90,7 +93,7 @@ function InvalidKubeconfigButton() {
   return (
     <TriggerBtn onClick={handleClick}>
       <Spacer>
-        <S.ClusterOutlined />
+        <Icon name="cluster-dashboard" style={{fontSize: '14px', marginTop: 4}} />
         <span>No cluster found</span>
       </Spacer>
     </TriggerBtn>
@@ -100,5 +103,5 @@ function InvalidKubeconfigButton() {
 const Spacer = styled.div`
   display: flex;
   align-items: center;
-  gap: 4px;
+  gap: 8px;
 `;

src/components/organisms/PageHeader/ClusterSelectionTable.tsx

@@ -84,14 +84,14 @@ export const ClusterSelectionTable: FC<ClusterSelectionTableProps> = ({setIsClus
         return;
       }
 
-      KUBECTL.updateContext(contextName)
+      KUBECTL.updateContext(contextName, {kubeconfig: kubeconfig?.path})
         .then(() => dispatch(setCurrentContext(contextName)))
         .catch((err: Error) => {
           const cause = err.cause instanceof Error ? err.cause.message : 'The cause is unknown.';
           notify.error(err.message, {description: cause});
         });
     },
-    [dispatch, currentContext, notify, setIsClusterDropdownOpen]
+    [setIsClusterDropdownOpen, currentContext?.name, kubeconfig?.path, dispatch, notify]
   );
 
   const updateClusterColor = (name: string, color: ClusterColors) => {

src/constants/constants.ts

@@ -24,6 +24,8 @@ export const DEFAULT_GIT_REPO_PLACEHOLDER = 'https://github.com/kubeshop/monokle
 export const TEMPLATES_HELP_URL = 'https://github.com/kubeshop/monokle/blob/main/docs/templates.md';
 export const PLUGINS_HELP_URL = 'https://kubeshop.github.io/monokle/plugins';
 
+export const DISCORD_URL = 'https://discord.gg/kMJxmuYTMu';
+
 export const PLUGIN_DOCS_URL = 'https://kubeshop.github.io/monokle/plugins/';
 export const LET_US_KNOW_URL = 'https://github.com/kubeshop/monokle/issues/1550';
 export const CLUSTER_AVAILABLE_COLORS = [

src/redux/appConfig/appConfig.slice.ts

@@ -186,11 +186,7 @@ export const configSlice = createSlice({
       state.isAccessLoading = action.payload;
     },
     setKubeConfig: (state: Draft<AppConfig>, action: PayloadAction<KubeConfig>) => {
-      state.kubeConfig = {...state.kubeConfig, ...action.payload};
-
-      if (state.kubeConfig.path) {
-        electronStore.set('appConfig.kubeConfig', state.kubeConfig.path);
-      }
+      state.kubeConfig = action.payload;
     },
     createProject: (state: Draft<AppConfig>, action: PayloadAction<Project>) => {
       const project: Project = action.payload;

src/redux/cluster/listeners/kubeconfig.ts

@@ -67,7 +67,9 @@ export const kubeConfigListener: AppListenerFn = listen => {
         if (isGlobalKubeconfig) {
           const oldKubeconfig = getState().config.kubeConfig;
           const changed = !isEqual(newKubeconfig, oldKubeconfig);
-          if (changed || !config?.isValid) dispatch(setKubeConfig(newKubeconfig));
+          if (changed) {
+            dispatch(setKubeConfig(newKubeconfig));
+          }
         }
 
         const isProjectKubeconfig = getState().config.projectConfig?.kubeConfig?.path === config?.path;

src/redux/cluster/service/kube-control.ts

@@ -16,13 +16,19 @@ export const getKubeconfig = invokeIpc<{path: string | undefined}, ModernKubeCon
 export const watchKubeconfig = invokeIpc<{kubeconfigs: string[]}, void>('kubeconfig:watch');
 export const stopWatchKubeconfig = invokeIpc<undefined, void>('kubeconfig:watch:stop');
 
+type KubectlGlobal = {
+  kubeconfig?: string;
+  context?: string;
+};
+
 export const KUBECTL = {
-  async updateContext(context: string) {
+  async updateContext(context: string, globals: KubectlGlobal = {}) {
     try {
+      const globalArgs = createGlobalArgs(globals);
       const arg = await runCommandInMainThread({
         commandId: uuid(),
         cmd: `kubectl`,
-        args: ['config', 'use-context', context],
+        args: [...globalArgs, 'config', 'use-context', context],
       });
 
       if (arg.exitCode !== 0) {
@@ -33,3 +39,10 @@ export const KUBECTL = {
     }
   },
 };
+
+function createGlobalArgs(globals: KubectlGlobal) {
+  const globalArgs = [];
+  if (globals.kubeconfig) globalArgs.push(`--kubeconfig=${globals.kubeconfig}`);
+  if (globals.context) globalArgs.push(`--context=${globals.context}`);
+  return globalArgs;
+}