fix: Issues with launching and installation on the steam deck

src/mainview/components/game/ActionButtons.tsx

@@ -1,4 +1,4 @@
-import { deleteGameMutation } from "@/mainview/scripts/queries/romm";
+import { deleteGameMutation, gameInvalidationQuery } from "@/mainview/scripts/queries/romm";
 import { FocusContext, setFocus, useFocusable } from "@noriginmedia/norigin-spatial-navigation";
 import { useMutation } from "@tanstack/react-query";
 import { ContextList, DialogEntry, useContextDialog } from "../ContextDialog";
@@ -9,6 +9,8 @@ import MainActions from "./MainActions";
 import ActionButton from "./ActionButton";
 import { useLocalStorage } from "usehooks-ts";
 import FocusTooltip from "../FocusTooltip";
+import { Router } from "@/mainview";
+import { useBlocker } from "@tanstack/react-router";
 
 function AchievementsInfo (data: { game: FrontEndGameTypeDetailed; } & InteractParams)
 {
@@ -35,10 +37,9 @@ export default function ActionButtons (data: { game?: FrontEndGameTypeDetailed,
     const { ref, focusKey, hasFocusedChild } = useFocusable({ focusKey: 'actions', forceFocus: true, trackChildren: true, preferredChildFocusKey: 'mainAction' });
     const deleteMutation = useMutation({
         ...deleteGameMutation({ id: data.id, source: data.source }),
-        onSuccess: () =>
+        onSuccess: (d, v, r, ctx) =>
         {
-            location.reload();
-            console.log("Deleted");
+            ctx.client.invalidateQueries(gameInvalidationQuery(data.id, data.source)).then(() => Router.history.back());
         },
         onError (error)
         {
@@ -46,22 +47,35 @@ export default function ActionButtons (data: { game?: FrontEndGameTypeDetailed,
         }
     });
 
+    useBlocker({ shouldBlockFn: () => deleteMutation.isPending });
+
     const contextOptions: DialogEntry[] = [];
     if (data.game?.local)
     {
-        contextOptions.push({
-            id: 'delete',
-            action: () =>
-            {
-                deleteMutation.mutate();
-            },
-            icon: <Trash />,
-            content: "Delete",
-            type: 'error'
-        });
+        if (deleteMutation.isPending)
+        {
+            contextOptions.push({
+                id: 'delete',
+                icon: <span className="loading loading-spinner loading-lg"></span>,
+                content: "Deleting",
+                type: 'error'
+            });
+        } else
+        {
+            contextOptions.push({
+                id: 'delete',
+                action: () =>
+                {
+                    deleteMutation.mutate();
+                },
+                icon: <Trash />,
+                content: "Delete",
+                type: 'error'
+            });
+        }
     }
 
-    const { setOpen, dialog: settingsDialog } = useContextDialog("settings-context", { content: <ContextList options={contextOptions} /> });
+    const { setOpen, dialog: settingsDialog } = useContextDialog("settings-context", { content: <ContextList disableCloseButton={deleteMutation.isPending} options={contextOptions} />, canClose: !deleteMutation.isPending });
 
     return <div ref={ref} className="flex sm:gap-2 md:gap-4 sm:h-16 md:h-32 overflow-hidden p-2 items-center shrink-0">
         <FocusContext value={focusKey}>