feat: added support for deleting objects

unxsist · Mar 7, 2024 · 9105689 · 9105689
1 parent ee0088e
commit 9105689
Show file tree

Hide file tree

Showing 16 changed files with 194 additions and 27 deletions.
diff --git a/src/App.vue b/src/App.vue
@@ -1,39 +1,35 @@
 <script setup lang="ts">
-import AuthCheck from "./components/AuthCheck.vue";
 import AppLayout from "@/components/AppLayout.vue";
 import Navigation from "@/components/Navigation.vue";
 import RouterViewport from "@/components/RouterViewport.vue";
 import Toaster from "@/components/ui/toast/Toaster.vue";
-import Loading from "@/components/Loading.vue";
 import CommandPalette from "./components/CommandPalette.vue";
 import SettingsContextProvider from "./providers/SettingsContextProvider";
 import KubeContextProvider from "./providers/KubeContextProvider";
 import CommandPaletteProvider from "./providers/CommandPaletteProvider";
 import TabProvider from "./providers/TabProvider";
+import DialogProvider from "./providers/DialogProvider";
+import DialogHandler from "./components/DialogHandler.vue";
 </script>
 
 <template>
   <AppLayout class="dark bg-zinc-900 text-sm rounded-lg">
-    <!-- <AuthCheck> -->
-    <!-- <template #default> -->
     <Suspense>
       <SettingsContextProvider>
         <KubeContextProvider>
           <TabProvider>
             <CommandPaletteProvider>
-              <Navigation />
-              <RouterViewport />
-              <Toaster />
-              <CommandPalette />
+              <DialogProvider>
+                <Navigation />
+                <RouterViewport />
+                <Toaster />
+                <CommandPalette />
+                <DialogHandler />
+              </DialogProvider>
             </CommandPaletteProvider>
           </TabProvider>
         </KubeContextProvider>
       </SettingsContextProvider>
     </Suspense>
-    <!-- </template> -->
-    <!-- <template #loading> -->
-    <!-- <Loading label="K8s crew, prepare for take-off..." /> -->
-    <!-- </template> -->
-    <!-- </AuthCheck> -->
   </AppLayout>
 </template>
diff --git a/src/components/DialogHandler.vue b/src/components/DialogHandler.vue
@@ -0,0 +1,38 @@
+<script setup lang="ts">
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from "@/components/ui/alert-dialog";
+
+import { DialogProviderStateKey } from "@/providers/DialogProvider";
+import { injectStrict } from "@/lib/utils";
+
+const { dialog } = injectStrict(DialogProviderStateKey);
+</script>
+
+<template>
+  <AlertDialog v-if="dialog" :open="true">
+    <AlertDialogContent>
+      <AlertDialogHeader>
+        <AlertDialogTitle>{{ dialog.title }}</AlertDialogTitle>
+        <AlertDialogDescription>
+          {{ dialog.message }}
+        </AlertDialogDescription>
+      </AlertDialogHeader>
+      <AlertDialogFooter>
+        <AlertDialogAction
+          v-for="(button, index) in dialog.buttons"
+          :key="index"
+          @click="button.handler(dialog)"
+          >{{ button.label }}</AlertDialogAction
+        >
+      </AlertDialogFooter>
+    </AlertDialogContent>
+  </AlertDialog>
+</template>
diff --git a/src/components/tables/pods.ts b/src/components/tables/pods.ts
@@ -28,7 +28,13 @@ export const columns: ColumnDef<V1Pod>[] = [
   },
   {
     header: "Status",
-    accessorFn: (row) => row.status?.phase,
+    accessorFn: (row) => {
+      if (row.metadata?.deletionTimestamp) {
+        return "Terminating";
+      }
+
+      return row.status?.phase;
+    },
   },
   {
     header: "CPU",

diff --git a/src/components/tables/types.ts b/src/components/tables/types.ts
@@ -1,3 +1,5 @@
+import { BaseDialogInterface } from "@/providers/DialogProvider";
+import { Command } from "@tauri-apps/api/shell";
 import { VirtualService } from "@kubernetes-models/istio/networking.istio.io/v1beta1";
 import { KubernetesObject } from "@kubernetes/client-node";
 
@@ -19,8 +21,9 @@ export type RowAction<T> = WithOptions<T> | WithHandler<T>;
 
 export function getDefaultActions<T extends KubernetesObject | VirtualService>(
   addTab: any,
+  spawnDialog: any,
   context: string,
-  isGenericResource: boolean = false
+  isGenericResource = false
 ): RowAction<T>[] {
   return [
     {
@@ -58,5 +61,46 @@ export function getDefaultActions<T extends KubernetesObject | VirtualService>(
         );
       },
     },
+    {
+      label: "Delete",
+      handler: (row) => {
+        const dialog: BaseDialogInterface = {
+          title: "Delete",
+          message: `Are you sure you want to delete ${row.metadata?.name}?`,
+          buttons: [
+            {
+              label: "Cancel",
+              handler: (dialog) => {
+                dialog.close();
+              },
+            },
+            {
+              label: "Delete",
+              handler: (dialog) => {
+                const command = new Command("kubectl", [
+                  "delete",
+                  `${row.kind}/${row.metadata?.name}`,
+                  "--context",
+                  context,
+                  "--namespace",
+                  row.metadata?.namespace || "",
+                ]);
+
+                command.stderr.on("data", (error: string) => {
+                  console.log(error);
+                });
+
+                command.on("close", () => {
+                  dialog.close();
+                });
+
+                command.spawn();
+              },
+            },
+          ],
+        };
+        spawnDialog(dialog);
+      },
+    },
   ];
 }
diff --git a/src/providers/DialogProvider.ts b/src/providers/DialogProvider.ts
@@ -0,0 +1,46 @@
+import { ToRefs } from "vue";
+
+export const DialogProviderStateKey: InjectionKey<ToRefs<DialogProviderState>> =
+  Symbol("DialogProviderState");
+
+export const DialogProviderSpawnDialogKey: InjectionKey<
+  (dialog: DialogInterface) => void
+> = Symbol("DialogProviderSpawnDialog");
+
+export interface DialogButtonInterface {
+  label: string;
+  handler: (dialog: DialogInterface) => void;
+}
+
+export interface BaseDialogInterface {
+  title: string;
+  message: string;
+  buttons: DialogButtonInterface[];
+}
+
+export interface DialogInterface extends BaseDialogInterface {
+  close: () => void;
+}
+
+export interface DialogProviderState {
+  dialog: DialogInterface | null;
+}
+
+export default {
+  setup() {
+    const state: DialogProviderState = reactive({
+      dialog: null,
+    });
+
+    provide(DialogProviderStateKey, toRefs(state));
+
+    const spawnDialog = (dialog: BaseDialogInterface) => {
+      state.dialog = { ...dialog, close: () => (state.dialog = null) };
+    };
+
+    provide(DialogProviderSpawnDialogKey, spawnDialog);
+  },
+  render(): any {
+    return this.$slots.default();
+  },
+};
diff --git a/src/views/ConfigMaps.vue b/src/views/ConfigMaps.vue
@@ -19,8 +19,11 @@ import { RowAction, getDefaultActions } from "@/components/tables/types";
 import { TabProviderAddTabKey } from "@/providers/TabProvider";
 const addTab = injectStrict(TabProviderAddTabKey);
 
+import { DialogProviderSpawnDialogKey } from "@/providers/DialogProvider";
+const spawnDialog = injectStrict(DialogProviderSpawnDialogKey);
+
 const rowActions: RowAction<V1ConfigMap>[] = [
-  ...getDefaultActions<V1ConfigMap>(addTab, context.value),
+  ...getDefaultActions<V1ConfigMap>(addTab, spawnDialog, context.value),
 ];
 
 async function getConfigMaps(refresh: boolean = false) {

diff --git a/src/views/CronJobs.vue b/src/views/CronJobs.vue
@@ -19,8 +19,11 @@ import { RowAction, getDefaultActions } from "@/components/tables/types";
 import { TabProviderAddTabKey } from "@/providers/TabProvider";
 const addTab = injectStrict(TabProviderAddTabKey);
 
+import { DialogProviderSpawnDialogKey } from "@/providers/DialogProvider";
+const spawnDialog = injectStrict(DialogProviderSpawnDialogKey);
+
 const rowActions: RowAction<V1CronJob>[] = [
-  ...getDefaultActions<V1CronJob>(addTab, context.value),
+  ...getDefaultActions<V1CronJob>(addTab, spawnDialog, context.value),
 ];
 
 async function getCronJobs(refresh: boolean = false) {

diff --git a/src/views/Deployments.vue b/src/views/Deployments.vue
@@ -11,6 +11,9 @@ const { context, namespace } = injectStrict(KubeContextStateKey);
 import { TabProviderAddTabKey } from "@/providers/TabProvider";
 const addTab = injectStrict(TabProviderAddTabKey);
 
+import { DialogProviderSpawnDialogKey } from "@/providers/DialogProvider";
+const spawnDialog = injectStrict(DialogProviderSpawnDialogKey);
+
 import DataTable from "@/components/ui/DataTable.vue";
 import { RowAction, getDefaultActions } from "@/components/tables/types";
 import { columns } from "@/components/tables/deployments";
@@ -20,8 +23,8 @@ const { toast } = useToast();
 const deployments = ref<V1Deployment[]>([]);
 
 const rowActions: RowAction<V1Deployment>[] = [
-  ...getDefaultActions<V1Deployment>(addTab, context.value),
-    {
+  ...getDefaultActions<V1Deployment>(addTab, spawnDialog, context.value),
+  {
     label: "Logs",
     handler: (row) => {
       addTab(

diff --git a/src/views/GenericResource.vue b/src/views/GenericResource.vue
@@ -18,8 +18,11 @@ import { RowAction, getDefaultActions } from "@/components/tables/types";
 import { TabProviderAddTabKey } from "@/providers/TabProvider";
 const addTab = injectStrict(TabProviderAddTabKey);
 
+import { DialogProviderSpawnDialogKey } from "@/providers/DialogProvider";
+const spawnDialog = injectStrict(DialogProviderSpawnDialogKey);
+
 const rowActions: RowAction<any>[] = [
-  ...getDefaultActions<any>(addTab, context.value, true),
+  ...getDefaultActions<any>(addTab, spawnDialog, context.value, true),
 ];
 
 onBeforeRouteUpdate((to, from, next) => {

diff --git a/src/views/Ingresses.vue b/src/views/Ingresses.vue
@@ -19,8 +19,11 @@ import { RowAction, getDefaultActions } from "@/components/tables/types";
 import { TabProviderAddTabKey } from "@/providers/TabProvider";
 const addTab = injectStrict(TabProviderAddTabKey);
 
+import { DialogProviderSpawnDialogKey } from "@/providers/DialogProvider";
+const spawnDialog = injectStrict(DialogProviderSpawnDialogKey);
+
 const rowActions: RowAction<V1Ingress>[] = [
-  ...getDefaultActions<V1Ingress>(addTab, context.value),
+  ...getDefaultActions<V1Ingress>(addTab, spawnDialog, context.value),
 ];
 
 async function getIngresses(refresh: boolean = false) {

diff --git a/src/views/Jobs.vue b/src/views/Jobs.vue
@@ -19,8 +19,11 @@ import { RowAction, getDefaultActions } from "@/components/tables/types";
 import { TabProviderAddTabKey } from "@/providers/TabProvider";
 const addTab = injectStrict(TabProviderAddTabKey);
 
+import { DialogProviderSpawnDialogKey } from "@/providers/DialogProvider";
+const spawnDialog = injectStrict(DialogProviderSpawnDialogKey);
+
 const rowActions: RowAction<V1Job>[] = [
-  ...getDefaultActions<V1Job>(addTab, context.value),
+  ...getDefaultActions<V1Job>(addTab, spawnDialog, context.value),
 ];
 
 async function getJobs(refresh: boolean = false) {

diff --git a/src/views/PersistentVolumeClaims.vue b/src/views/PersistentVolumeClaims.vue
@@ -19,8 +19,15 @@ import { RowAction, getDefaultActions } from "@/components/tables/types";
 import { TabProviderAddTabKey } from "@/providers/TabProvider";
 const addTab = injectStrict(TabProviderAddTabKey);
 
+import { DialogProviderSpawnDialogKey } from "@/providers/DialogProvider";
+const spawnDialog = injectStrict(DialogProviderSpawnDialogKey);
+
 const rowActions: RowAction<V1PersistentVolumeClaim>[] = [
-  ...getDefaultActions<V1PersistentVolumeClaim>(addTab, context.value),
+  ...getDefaultActions<V1PersistentVolumeClaim>(
+    addTab,
+    spawnDialog,
+    context.value
+  ),
 ];
 
 async function getPersistentVolumeClaims(refresh: boolean = false) {

diff --git a/src/views/Pods.vue b/src/views/Pods.vue
@@ -17,12 +17,15 @@ import { TabProviderAddTabKey } from "@/providers/TabProvider";
 const { context, namespace } = injectStrict(KubeContextStateKey);
 const addTab = injectStrict(TabProviderAddTabKey);
 
+import { DialogProviderSpawnDialogKey } from "@/providers/DialogProvider";
+const spawnDialog = injectStrict(DialogProviderSpawnDialogKey);
+
 const { toast } = useToast();
 
 const pods = ref<V1Pod[]>([]);
 
 const rowActions: RowAction<V1Pod>[] = [
-  ...getDefaultActions<V1Pod>(addTab, context.value),
+  ...getDefaultActions<V1Pod>(addTab, spawnDialog, context.value),
   {
     label: "Shell",
     options: (row) => {

diff --git a/src/views/Secrets.vue b/src/views/Secrets.vue
@@ -19,8 +19,11 @@ import { RowAction, getDefaultActions } from "@/components/tables/types";
 import { TabProviderAddTabKey } from "@/providers/TabProvider";
 const addTab = injectStrict(TabProviderAddTabKey);
 
+import { DialogProviderSpawnDialogKey } from "@/providers/DialogProvider";
+const spawnDialog = injectStrict(DialogProviderSpawnDialogKey);
+
 const rowActions: RowAction<V1Secret>[] = [
-  ...getDefaultActions<V1Secret>(addTab, context.value),
+  ...getDefaultActions<V1Secret>(addTab, spawnDialog, context.value),
 ];
 
 async function getConfigMaps(refresh: boolean = false) {

diff --git a/src/views/Services.vue b/src/views/Services.vue
@@ -19,8 +19,11 @@ import { RowAction, getDefaultActions } from "@/components/tables/types";
 import { TabProviderAddTabKey } from "@/providers/TabProvider";
 const addTab = injectStrict(TabProviderAddTabKey);
 
+import { DialogProviderSpawnDialogKey } from "@/providers/DialogProvider";
+const spawnDialog = injectStrict(DialogProviderSpawnDialogKey);
+
 const rowActions: RowAction<V1Service>[] = [
-  ...getDefaultActions<V1Service>(addTab, context.value),
+  ...getDefaultActions<V1Service>(addTab, spawnDialog, context.value),
 ];
 
 async function getServices(refresh: boolean = false) {

diff --git a/src/views/VirtualServices.vue b/src/views/VirtualServices.vue
@@ -19,8 +19,11 @@ import { RowAction, getDefaultActions } from "@/components/tables/types";
 import { TabProviderAddTabKey } from "@/providers/TabProvider";
 const addTab = injectStrict(TabProviderAddTabKey);
 
+import { DialogProviderSpawnDialogKey } from "@/providers/DialogProvider";
+const spawnDialog = injectStrict(DialogProviderSpawnDialogKey);
+
 const rowActions: RowAction<VirtualService>[] = [
-  ...getDefaultActions<VirtualService>(addTab, context.value),
+  ...getDefaultActions<VirtualService>(addTab, spawnDialog, context.value),
 ];
 
 async function getVirtualServices(refresh: boolean = false) {