fix(frontend): fix some state and params issues

Author: UNIkeEN

src/components/modals/generic-confirm-dialog.tsx

@@ -6,6 +6,7 @@ import {
   AlertDialogFooter,
   AlertDialogHeader,
   AlertDialogOverlay,
+  AlertDialogProps,
   Button,
   Checkbox,
   HStack,
@@ -15,9 +16,10 @@ import { t } from "i18next";
 import { useRef, useState } from "react";
 import { useLauncherConfig } from "@/contexts/config";
 
-interface GenericConfirmDialogProps {
-  isOpen: boolean;
-  onClose: () => void;
+interface GenericConfirmDialogProps extends Omit<
+  AlertDialogProps,
+  "children" | "leastDestructiveRef"
+> {
   title: string;
   body: string | React.ReactElement;
   footerLeft?: React.ReactElement;
@@ -27,6 +29,7 @@ interface GenericConfirmDialogProps {
   onCancelCallback?: () => void;
   isAlert?: boolean;
   isLoading?: boolean;
+  showCloseBtn?: boolean;
   showSuppressBtn?: boolean;
   suppressKey?: string;
 }
@@ -43,8 +46,10 @@ const GenericConfirmDialog: React.FC<GenericConfirmDialogProps> = ({
   onCancelCallback,
   isAlert = false,
   isLoading = false,
+  showCloseBtn = true,
   showSuppressBtn = false,
   suppressKey,
+  ...props
 }) => {
   const cancelRef = useRef<HTMLButtonElement>(null);
   const { config, update } = useLauncherConfig();
@@ -74,11 +79,12 @@ const GenericConfirmDialog: React.FC<GenericConfirmDialogProps> = ({
       onClose={handleCancel}
       autoFocus={false}
       isCentered
+      {...props}
     >
       <AlertDialogOverlay>
         <AlertDialogContent>
           <AlertDialogHeader>{title}</AlertDialogHeader>
-          <AlertDialogCloseButton />
+          {showCloseBtn && <AlertDialogCloseButton />}
           <AlertDialogBody>{body}</AlertDialogBody>
           <AlertDialogFooter>
             <HStack spacing={3}>

src/layouts/main-layout.tsx

@@ -45,6 +45,7 @@ const MainLayout = ({ children }: MainLayoutProps) => {
 
   const [bgImgSrc, setBgImgSrc] = useState<string>("");
   const isCheckedRunCount = useRef(false);
+  const isCheckedLastRunStatus = useRef(false);
 
   const {
     isOpen: isWelcomeAndTermsModalOpen,
@@ -63,17 +64,21 @@ const MainLayout = ({ children }: MainLayoutProps) => {
       title: t("UnavailableExePathAlertDialog.dialog.title"),
       body: t("UnavailableExePathAlertDialog.dialog.content"),
       btnCancel: t("UnavailableExePathAlertDialog.dialog.btnContinue"),
+      onCancelCallback: () => update("runCount", config.runCount + 1), // because this dialog will skip the run count check
       btnOK: t("General.exit"),
-      isAlert: true,
       onOKCallback: () => exit(0),
       footerLeft: (
         <HStack spacing={2}>
           <LuLanguages />
           <LanguageMenu placement="top" />
         </HStack>
       ),
+      isAlert: true,
+      closeOnEsc: false,
+      closeOnOverlayClick: false,
+      showCloseBtn: false,
     });
-  }, [openGenericConfirmDialog]);
+  }, [config.runCount, openGenericConfirmDialog, update]);
 
   const openLastExitedAbnormallyDialog = useCallback(() => {
     openGenericConfirmDialog({
@@ -132,11 +137,12 @@ const MainLayout = ({ children }: MainLayoutProps) => {
     }
 
     // update `last_run_exited_normally` to false, will be updated when this run ends with normal exit.
-    if (!config.mocked && !isCheckedRunCount.current && !isStandAlone) {
+    if (!config.mocked && !isCheckedLastRunStatus.current && !isStandAlone) {
       if (!config.lastRunExitedNormally) {
         openLastExitedAbnormallyDialog();
       }
       update("lastRunExitedNormally", false);
+      isCheckedLastRunStatus.current = true;
     }
 
     // update run count, conditionally show some modals.