Fix game deletion flow to avoid locking the UI (#16)

Ecks1337 · Oct 12, 2022 · 4a01ccb · 4a01ccb
1 parent 5853318
commit 4a01ccb
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 14 deletions.
diff --git a/src/renderer/actions/game.action.ts b/src/renderer/actions/game.action.ts
@@ -1,16 +1,14 @@
-import { SetState } from "zustand/vanilla";
 import Swal from "sweetalert2";
 import useTranslation from "../i18n/I18nService";
 import { invokeIpc } from "../utils";
 
 const { t } = useTranslation();
 
 export interface IGameAction {
-  deleteGameAction: (titleId: string, dataPath: string) => void,
-  deletedGame?: string,
+  deleteGameAction: (titleId: string, dataPath: string) => Promise<boolean>
 }
 
-const createGameSlice = (set: SetState<IGameAction>): IGameAction => ({
+const createGameSlice = (): IGameAction => ({
   deleteGameAction: async (titleId, dataPath) => {
     const { isConfirmed } = await Swal.fire({
       icon: "warning",
@@ -22,11 +20,11 @@ const createGameSlice = (set: SetState<IGameAction>): IGameAction => ({
     });
 
     if (!isConfirmed) {
-      return;
+      return false;
     }
 
     await invokeIpc("delete-game", titleId, dataPath);
-    return set({ deletedGame: titleId });
+    return true;
   }
 });
 

diff --git a/src/renderer/actions/state.ts b/src/renderer/actions/state.ts
@@ -17,7 +17,7 @@ const useStore = create((set: SetState<any>, get: GetState<any>) => ({
   ...createAlertSlice(set),
   ...createEmulatorFilesSLice(set, get),
   ...createDownloadManagerSlice(set, get),
-  ...createGameSlice(set),
+  ...createGameSlice(),
   ...createDownloadSaveSlice(set),
   ...createDownloadModSlice(set),
   ...createShadersSlice(set),

diff --git a/src/renderer/components/GameDetailComponent/GameDetailComponent.tsx b/src/renderer/components/GameDetailComponent/GameDetailComponent.tsx
@@ -58,7 +58,6 @@ const GameDetailComponent = () => {
     needRefreshShaders,
     shareShaders,
     deleteGameAction,
-    deletedGame,
     threshold,
     shadersMinVersion
   ] = useStore(state => [
@@ -71,7 +70,6 @@ const GameDetailComponent = () => {
     state.needRefreshShaders,
     state.shareShaders,
     state.deleteGameAction,
-    state.deletedGame,
     state.threshold,
     state.shadersMinVersion
   ]);
@@ -82,10 +80,6 @@ const GameDetailComponent = () => {
   const { t } = useTranslation();
   const navigate = useNavigate();
 
-  useEffect(() => {
-    deletedGame && navigate(-1);
-  }, [deletedGame]);
-
   const extractCompatibilityLabels = (response: GithubIssue) => {
     // Probably non 200 response from GitHub, so leave it as default value (null)
     if (response == null) return;
@@ -165,7 +159,7 @@ const GameDetailComponent = () => {
         <Button
           variant="contained"
           color="error"
-          onClick={() => deleteGameAction(metaData.id, dataPath)}
+          onClick={() => deleteGameAction(metaData.id, dataPath).then(confirmed => confirmed && navigate(-1))}
           startIcon={<DeleteIcon />}
         >
           {t("deleteGame")}