changes

headlamp-k8s · Dec 9, 2024 · f3c729d · f3c729d
1 parent 45bf405
commit f3c729d
Show file tree

Hide file tree

Showing 23 changed files with 10 additions and 5,114 deletions.
diff --git a/frontend/src/components/common/CreateResourceButton.tsx b/frontend/src/components/common/CreateResourceButton.tsx
@@ -30,6 +30,7 @@ export function CreateResourceButton(props: CreateResourceButtonProps) {
       <EditorDialog
         item={baseObject}
         open={openDialog}
+        setOpen={setOpenDialog}
         onClose={() => setOpenDialog(false)}
         saveLabel={t('translation|Apply')}
         errorMessage={errorMessage}

diff --git a/frontend/src/components/common/Resource/CreateButton.tsx b/frontend/src/components/common/Resource/CreateButton.tsx
@@ -6,18 +6,7 @@ import MenuItem from '@mui/material/MenuItem';
 import Select from '@mui/material/Select';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
-import { useDispatch } from 'react-redux';
-import { useLocation } from 'react-router-dom';
 import { useClusterGroup } from '../../../lib/k8s';
-import { apply } from '../../../lib/k8s/apiProxy';
-import { KubeObjectInterface } from '../../../lib/k8s/KubeObject';
-import { clusterAction } from '../../../redux/clusterActionSlice';
-import {
-  EventStatus,
-  HeadlampEventType,
-  useEventCallback,
-} from '../../../redux/headlampEventSlice';
-import { AppDispatch } from '../../../redux/stores/store';
 import ActionButton from '../ActionButton';
 import EditorDialog from './EditorDialog';
 
@@ -27,16 +16,13 @@ interface CreateButtonProps {
 
 export default function CreateButton(props: CreateButtonProps) {
   const { isNarrow } = props;
-  const dispatch: AppDispatch = useDispatch();
 
   const [openDialog, setOpenDialog] = React.useState(false);
   const [errorMessage, setErrorMessage] = React.useState('');
-  const location = useLocation();
   const { t } = useTranslation(['translation']);
-  const dispatchCreateEvent = useEventCallback(HeadlampEventType.CREATE_RESOURCE);
   const clusters = useClusterGroup();
   const [targetCluster, setTargetCluster] = React.useState(clusters[0] || '');
-  const [currentItem, setCurrentItem] = React.useState({}); // eslint-disable-line no-unused-vars
+  const itemRef = React.useRef({});
 
   // When the clusters in the group change, we want to reset the target cluster
   // if it's not in the new list of clusters.
@@ -48,82 +34,6 @@ export default function CreateButton(props: CreateButtonProps) {
     }
   }, [clusters]);
 
-  const applyFunc = async (newItems: KubeObjectInterface[], clusterName: string) => {
-    await Promise.allSettled(newItems.map(newItem => apply(newItem, clusterName))).then(
-      (values: any) => {
-        values.forEach((value: any, index: number) => {
-          if (value.status === 'rejected') {
-            let msg;
-            const kind = newItems[index].kind;
-            const name = newItems[index].metadata.name;
-            const apiVersion = newItems[index].apiVersion;
-            if (newItems.length === 1) {
-              msg = t('translation|Failed to create {{ kind }} {{ name }}.', { kind, name });
-            } else {
-              msg = t('translation|Failed to create {{ kind }} {{ name }} in {{ apiVersion }}.', {
-                kind,
-                name,
-                apiVersion,
-              });
-            }
-            setErrorMessage(msg);
-            setOpenDialog(true);
-            throw msg;
-          }
-        });
-      }
-    );
-  };
-
-  function handleSave(newItemDefs: KubeObjectInterface[]) {
-    let massagedNewItemDefs = newItemDefs;
-    const cancelUrl = location.pathname;
-
-    // check if all yaml objects are valid
-    for (let i = 0; i < massagedNewItemDefs.length; i++) {
-      if (massagedNewItemDefs[i].kind === 'List') {
-        // flatten this List kind with the items that it has which is a list of valid k8s resources
-        const deletedItem = massagedNewItemDefs.splice(i, 1);
-        massagedNewItemDefs = massagedNewItemDefs.concat(deletedItem[0].items!);
-      }
-      if (!massagedNewItemDefs[i].metadata?.name) {
-        setErrorMessage(
-          t(`translation|Invalid: One or more of resources doesn't have a name property`)
-        );
-        return;
-      }
-      if (!massagedNewItemDefs[i].kind) {
-        setErrorMessage(t('translation|Invalid: Please set a kind to the resource'));
-        return;
-      }
-    }
-    // all resources name
-    const resourceNames = massagedNewItemDefs.map(newItemDef => newItemDef.metadata.name);
-    setOpenDialog(false);
-
-    dispatch(
-      clusterAction(() => applyFunc(massagedNewItemDefs, targetCluster), {
-        startMessage: t('translation|Applying {{ newItemName }}…', {
-          newItemName: resourceNames.join(','),
-        }),
-        cancelledMessage: t('translation|Cancelled applying {{ newItemName }}.', {
-          newItemName: resourceNames.join(','),
-        }),
-        successMessage: t('translation|Applied {{ newItemName }}.', {
-          newItemName: resourceNames.join(','),
-        }),
-        errorMessage: t('translation|Failed to apply {{ newItemName }}.', {
-          newItemName: resourceNames.join(','),
-        }),
-        cancelUrl,
-      })
-    );
-
-    dispatchCreateEvent({
-      status: EventStatus.CONFIRMED,
-    });
-  }
-
   return (
     <React.Fragment>
       {isNarrow ? (
@@ -149,10 +59,10 @@ export default function CreateButton(props: CreateButtonProps) {
         </Button>
       )}
       <EditorDialog
-        item={currentItem}
+        item={itemRef.current}
         open={openDialog}
         onClose={() => setOpenDialog(false)}
-        onSave={handleSave}
+        setOpen={setOpenDialog}
         saveLabel={t('translation|Apply')}
         errorMessage={errorMessage}
         onEditorChanged={() => setErrorMessage('')}

diff --git a/frontend/src/components/common/Resource/EditorDialog.tsx b/frontend/src/components/common/Resource/EditorDialog.tsx
@@ -67,6 +67,8 @@ export interface EditorDialogProps extends DialogProps {
   onSave?: ((...args: any[]) => void) | 'default' | null;
   /** Called when the editor's contents change. */
   onEditorChanged?: ((newValue: string) => void) | null;
+  /** The function to open the dialog. */
+  setOpen?: (open: boolean) => void;
   /** The label to use for the save button. */
   saveLabel?: string;
   /** The error message to display. */
@@ -83,6 +85,7 @@ export default function EditorDialog(props: EditorDialogProps) {
     onClose,
     onSave = 'default',
     onEditorChanged,
+    setOpen,
     saveLabel,
     errorMessage,
     title,
@@ -300,7 +303,9 @@ export default function EditorDialog(props: EditorDialogProps) {
               });
             }
             setError(msg);
-            throw msg;
+            setOpen?.(true);
+            // throw msg;
+            throw new Error(msg);
           }
         });
       }