feat: allow cluster resources to be modified and applied without leav…

…ing cluster preview

src/components/molecules/Monaco/Monaco.tsx

@@ -73,6 +73,7 @@ const Monaco = (props: {editorHeight: string}) => {
   const selectedPath = useAppSelector(state => state.main.selectedPath);
   const selectedResourceId = useAppSelector(state => state.main.selectedResourceId);
   const resourceMap = useAppSelector(state => state.main.resourceMap);
+  const previewType = useAppSelector(state => state.main.previewType);
   const [code, setCode] = useState('');
   const [orgCode, setOrgCode] = useState<string>('');
   const [containerRef, {width}] = useMeasure<HTMLDivElement>();
@@ -252,7 +253,7 @@ const Monaco = (props: {editorHeight: string}) => {
 
   const options = {
     selectOnLineNumbers: true,
-    readOnly: isInPreviewMode || (!selectedPath && !selectedResourceId),
+    readOnly: (isInPreviewMode && previewType !== 'cluster') || (!selectedPath && !selectedResourceId),
     fontWeight: 'bold',
     glyphMargin: true,
     minimap: {

src/components/organisms/ActionsPane/ActionsPane.tsx

@@ -46,6 +46,7 @@ const ActionsPane = (props: {contentHeight: string}) => {
   const uiState = useAppSelector(state => state.ui);
   const currentSelectionHistoryIndex = useAppSelector(state => state.main.currentSelectionHistoryIndex);
   const selectionHistory = useAppSelector(state => state.main.selectionHistory);
+  const previewType = useAppSelector(state => state.main.previewType);
   const [key, setKey] = useState('source');
   const dispatch = useAppDispatch();
 
@@ -124,11 +125,12 @@ const ActionsPane = (props: {contentHeight: string}) => {
 
   const applySelection = useCallback(() => {
     if (selectedResource) {
-      applyResourceWithConfirm(selectedResource, resourceMap, fileMap, dispatch, kubeconfig);
+      const isClusterPreview = previewType === 'cluster';
+      applyResourceWithConfirm(selectedResource, resourceMap, fileMap, dispatch, kubeconfig, {isClusterPreview});
     } else if (selectedPath) {
       applyFileWithConfirm(selectedPath, fileMap, dispatch, kubeconfig);
     }
-  }, [selectedResource, resourceMap, fileMap, kubeconfig, selectedPath, dispatch]);
+  }, [selectedResource, resourceMap, fileMap, kubeconfig, selectedPath, dispatch, previewType]);
 
   const diffSelectedResource = useCallback(() => {
     if (selectedResourceId) {

src/components/organisms/ActionsPane/applyResourceWithConfirm.tsx

@@ -11,7 +11,11 @@ export function applyResourceWithConfirm(
   resourceMap: ResourceMapType,
   fileMap: FileMapType,
   dispatch: ThunkDispatch<any, any, any>,
-  kubeconfig: string
+  kubeconfig: string,
+  options?: {
+    isClusterPreview?: boolean;
+    shouldPerformDiff?: boolean;
+  }
 ) {
   const title = isKustomizationResource(selectedResource)
     ? `Apply ${selectedResource.name} kustomization your cluster?`
@@ -22,7 +26,7 @@ export function applyResourceWithConfirm(
     icon: <ExclamationCircleOutlined />,
     onOk() {
       return new Promise(resolve => {
-        applyResource(selectedResource.id, resourceMap, fileMap, dispatch, kubeconfig);
+        applyResource(selectedResource.id, resourceMap, fileMap, dispatch, kubeconfig, options);
         resolve({});
       });
     },

src/components/organisms/DiffModal/DiffModal.tsx

@@ -48,6 +48,7 @@ const DiffModal = () => {
   const diffResourceId = useAppSelector(state => state.main.diffResourceId);
   const [diffResource, setDiffResource] = useState<K8sResource>();
   const [resourceContent, setResourceContent] = useState<string>();
+  const previewType = useAppSelector(state => state.main.previewType);
   const fileMap = useAppSelector(state => state.main.fileMap);
   const kubeconfig = useAppSelector(state => state.config.kubeconfigPath);
   const [isVisible, setVisible] = useState(false);
@@ -75,7 +76,10 @@ const DiffModal = () => {
     if (diffResourceId) {
       const resource = resourceMap[diffResourceId];
       if (resource) {
-        applyResourceWithConfirm(resource, resourceMap, fileMap, dispatch, kubeconfig);
+        applyResourceWithConfirm(resource, resourceMap, fileMap, dispatch, kubeconfig, {
+          isClusterPreview: previewType === 'cluster',
+          shouldPerformDiff: true,
+        });
       }
     }
   };

src/redux/thunks/applyResource.ts

@@ -1,14 +1,17 @@
 import {K8sResource} from '@models/k8sresource';
 import {spawn} from 'child_process';
 import log from 'loglevel';
+import {stringify} from 'yaml';
 import {FileMapType, ResourceMapType} from '@models/appstate';
 import {setAlert} from '@redux/reducers/alert';
 import {AlertEnum, AlertType} from '@models/alert';
 import {AppDispatch} from '@redux/store';
 import {getAbsoluteResourceFolder} from '@redux/services/fileEntry';
 import {isKustomizationResource} from '@redux/services/kustomize';
 import {getShellPath} from '@utils/shell';
-import {setApplyingResource} from '@redux/reducers/main';
+import {setApplyingResource, updateResource} from '@redux/reducers/main';
+import {getResourceFromCluster} from '@redux/thunks/utils';
+import {performResourceDiff} from './diffResource';
 
 /**
  * Invokes kubectl for the content of the specified resource
@@ -56,7 +59,11 @@ export async function applyResource(
   resourceMap: ResourceMapType,
   fileMap: FileMapType,
   dispatch: AppDispatch,
-  kubeconfig: string
+  kubeconfig: string,
+  options?: {
+    isClusterPreview?: boolean;
+    shouldPerformDiff?: boolean;
+  }
 ) {
   try {
     const resource = resourceMap[resourceId];
@@ -79,6 +86,23 @@ export async function applyResource(
             title: 'Apply completed',
             message: data.toString(),
           };
+          if (options?.isClusterPreview) {
+            getResourceFromCluster(resource, kubeconfig).then(resourceFromCluster => {
+              delete resourceFromCluster.body.metadata?.managedFields;
+              const updatedResourceText = stringify(resourceFromCluster.body, {sortMapEntries: true});
+              dispatch(
+                updateResource({
+                  resourceId: resource.id,
+                  content: updatedResourceText,
+                })
+              );
+              if (options?.shouldPerformDiff) {
+                dispatch(performResourceDiff(resource.id));
+              }
+            });
+          } else if (options?.shouldPerformDiff) {
+            dispatch(performResourceDiff(resource.id));
+          }
           dispatch(setAlert(alert));
           dispatch(setApplyingResource(false));
         });

src/redux/thunks/diffResource.ts

@@ -4,10 +4,8 @@ import {AppDispatch, RootState} from '@redux/store';
 import * as k8s from '@kubernetes/client-node';
 import {stringify} from 'yaml';
 import log from 'loglevel';
-import {createPreviewRejection} from '@redux/thunks/utils';
-
+import {createPreviewRejection, getResourceFromCluster} from '@redux/thunks/utils';
 import {getResourceKindHandler} from '@src/kindhandlers';
-
 /**
  * Thunk to diff a resource against the configured cluster
  */
@@ -24,9 +22,16 @@ export const performResourceDiff = createAsyncThunk<
   const kubeconfig = thunkAPI.getState().config.kubeconfigPath;
   try {
     const resource = resourceMap[diffResourceId];
-    const resourceKindHandler = getResourceKindHandler(resource.kind);
 
-    if (resource && resource.text && resourceKindHandler) {
+    if (resource && resource.text) {
+      const resourceKindHandler = getResourceKindHandler(resource.kind);
+      if (!resourceKindHandler) {
+        return createPreviewRejection(
+          thunkAPI,
+          'Diff Resource',
+          `Could not find Kind Handler for resoruce ${resource.id}`
+        );
+      }
       const kc = new k8s.KubeConfig();
       kc.loadFromFile(kubeconfig);
 
@@ -50,9 +55,12 @@ export const performResourceDiff = createAsyncThunk<
         return createPreviewRejection(thunkAPI, title, message);
       };
 
-      return resourceKindHandler
-        .getResourceFromCluster(kc, resource.content.metadata.name, resource.namespace ? resource.namespace : 'default')
-        .then(handleResource, handleRejection);
+      try {
+        const resourceFromCluster = await getResourceFromCluster(resource, kubeconfig);
+        return handleResource(resourceFromCluster);
+      } catch (err) {
+        return handleRejection(err);
+      }
     }
   } catch (e) {
     createPreviewRejection(thunkAPI, 'Diff Resource', `Failed to diff resources; ${e.message}`);

src/redux/thunks/utils.ts

@@ -1,8 +1,11 @@
+import * as k8s from '@kubernetes/client-node';
 import {PREVIEW_PREFIX, YAML_DOCUMENT_DELIMITER} from '@constants/constants';
 import {ResourceMapType} from '@models/appstate';
 import {extractK8sResources, processParsedResources} from '@redux/services/resource';
 import {stringify} from 'yaml';
 import {AlertEnum} from '@models/alert';
+import {K8sResource} from '@models/k8sresource';
+import {getResourceKindHandler} from '@src/kindhandlers';
 
 /**
  * Utility to convert list of objects returned by k8s api to a single YAML document
@@ -53,3 +56,19 @@ export function createPreviewRejection(thunkAPI: any, title: string, message: st
     },
   });
 }
+
+export async function getResourceFromCluster(resource: K8sResource, kubeconfigPath: string) {
+  const resourceKindHandler = getResourceKindHandler(resource.kind);
+
+  if (resource && resource.text && resourceKindHandler) {
+    const kc = new k8s.KubeConfig();
+    kc.loadFromFile(kubeconfigPath);
+
+    const resourceFromCluster = await resourceKindHandler.getResourceFromCluster(
+      kc,
+      resource.content.metadata.name,
+      resource.namespace ? resource.namespace : 'default'
+    );
+    return resourceFromCluster;
+  }
+}