icmp pinging + deleting

components/delete-dialog.tsx

@@ -12,6 +12,9 @@ import {
   DialogHeader,
   DialogTitle,
 } from "@/components/ui/dialog";
+import { invoke } from "@tauri-apps/api/core";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import { toast } from "sonner";
 
 type DeleteDialogProps = {
   id: string;
@@ -25,11 +28,29 @@ export default function DeleteDialog({
   onOpenChange,
 }: DeleteDialogProps) {
   const formRef = useRef<HTMLFormElement>(null);
+  const queryClient = useQueryClient();
+
+  const delete_app = async (id: string) => {
+    await invoke("delete_apps", { id });
+  };
+
+  const { mutate: deleteApp } = useMutation({
+    mutationKey: ["delete_app"],
+    mutationFn: delete_app,
+    onSuccess: () => {
+      console.log("App deleted successfully");
+      queryClient.invalidateQueries({ queryKey: ["apps"] });
+    },
+    onError: (error) => {
+      toast.error("Error deleting app");
+      console.error("Error deleting app:", error);
+    },
+  });
 
   const handleDelete = async (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
-    console.log(`Deleting app with id: ${id}`);
-    onOpenChange(false); // Close dialog after deleting
+    deleteApp(id);
+    onOpenChange(false);
   };
 
   const handleHoldComplete = () => {