feat: save file system option on create, update, delete files

thenick775 · Nov 17, 2024 · 71e8200 · 71e8200
1 parent 4701b2a
commit 71e8200
Show file tree

Hide file tree

Showing 15 changed files with 164 additions and 16 deletions.
diff --git a/gbajs3/src/components/modals/cheats.tsx b/gbajs3/src/components/modals/cheats.tsx
@@ -8,6 +8,7 @@ import { ModalBody } from './modal-body.tsx';
 import { ModalFooter } from './modal-footer.tsx';
 import { ModalHeader } from './modal-header.tsx';
 import { useEmulatorContext, useModalContext } from '../../hooks/context.tsx';
+import { useAddCallbacks } from '../../hooks/emulator/use-add-callbacks.tsx';
 import {
   EmbeddedProductTour,
   type TourSteps
@@ -85,6 +86,7 @@ export const CheatsModal = () => {
   const { setIsModalOpen } = useModalContext();
   const { emulator } = useEmulatorContext();
   const [viewRawCheats, setViewRawCheats] = useState(false);
+  const { syncActionIfEnabled } = useAddCallbacks();
   const baseId = useId();
   const defaultCheat = { desc: '', code: '', enable: false };
 
@@ -197,6 +199,7 @@ export const CheatsModal = () => {
 
             if (cheatsFile)
               emulator?.uploadCheats(cheatsFile, () => {
+                syncActionIfEnabled();
                 emulator.autoLoadCheats();
                 refreshForm();
               });

diff --git a/gbajs3/src/components/modals/file-system.tsx b/gbajs3/src/components/modals/file-system.tsx
@@ -8,6 +8,7 @@ import { ModalBody } from './modal-body.tsx';
 import { ModalFooter } from './modal-footer.tsx';
 import { ModalHeader } from './modal-header.tsx';
 import { useEmulatorContext, useModalContext } from '../../hooks/context.tsx';
+import { useAddCallbacks } from '../../hooks/emulator/use-add-callbacks.tsx';
 import {
   EmbeddedProductTour,
   type TourSteps
@@ -25,15 +26,17 @@ const FlexModalBody = styled(ModalBody)`
 export const FileSystemModal = () => {
   const { setIsModalOpen } = useModalContext();
   const { emulator } = useEmulatorContext();
+  const { syncActionIfEnabled } = useAddCallbacks();
   const [allFiles, setAllFiles] = useState<FileNode | undefined>();
   const baseId = useId();
 
   const deleteFile = useCallback(
     (path: string) => {
       emulator?.deleteFile(path);
       setAllFiles(emulator?.listAllFiles());
+      syncActionIfEnabled();
     },
-    [emulator]
+    [emulator, syncActionIfEnabled]
   );
 
   const downloadFile = (path: string) => {

diff --git a/gbajs3/src/components/modals/file-system/file-system-options-form.spec.tsx b/gbajs3/src/components/modals/file-system/file-system-options-form.spec.tsx
@@ -29,6 +29,9 @@ describe('<FileSystemOptionsForm />', () => {
     // form and form fields
     expect(screen.getByLabelText('File System Options Form')).toBeVisible();
     expect(screen.getByText('Save file system on in-game save')).toBeVisible();
+    expect(
+      screen.getByText('Save file system on creates / updates / deletes')
+    ).toBeVisible();
   });
 
   it('saves file system options', async () => {
@@ -37,7 +40,8 @@ describe('<FileSystemOptionsForm />', () => {
 
     vi.spyOn(addCallbacksHooks, 'useAddCallbacks').mockImplementation(() => ({
       addCallbacks: vi.fn(),
-      addCallbacksAndSaveSettings: addCallbacksAndSaveSettingsSpy
+      addCallbacksAndSaveSettings: addCallbacksAndSaveSettingsSpy,
+      syncActionIfEnabled: vi.fn()
     }));
 
     renderWithContext(<FileSystemOptionsForm id="testId" />);
@@ -50,6 +54,9 @@ describe('<FileSystemOptionsForm />', () => {
     await userEvent.click(
       screen.getByLabelText('Save file system on in-game save')
     );
+    await userEvent.click(
+      screen.getByLabelText('Save file system on creates / updates / deletes')
+    );
     await userEvent.click(screen.getByLabelText('Enable Notifications'));
     // submit form
     await userEvent.click(submitButton);
@@ -58,7 +65,8 @@ describe('<FileSystemOptionsForm />', () => {
     expect(addCallbacksAndSaveSettingsSpy).toHaveBeenCalledWith(
       {
         saveFileSystemOnInGameSave: true,
-        notificationsEnabled: true
+        notificationsEnabled: true,
+        saveFileSystemOnCreateUpdateDelete: true
       },
       expect.anything()
     );

diff --git a/gbajs3/src/components/modals/file-system/file-system-options-form.tsx b/gbajs3/src/components/modals/file-system/file-system-options-form.tsx
@@ -83,6 +83,11 @@ export const FileSystemOptionsForm = ({ id }: FileSystemOptionsFormProps) => {
             watcher={watch('saveFileSystemOnInGameSave')}
             {...register('saveFileSystemOnInGameSave')}
           />
+          <ManagedCheckbox
+            label="Save file system on creates / updates / deletes"
+            watcher={watch('saveFileSystemOnCreateUpdateDelete')}
+            {...register('saveFileSystemOnCreateUpdateDelete')}
+          />
           <ManagedSwitch
             label="Enable Notifications"
             watcher={watch('notificationsEnabled')}

diff --git a/gbajs3/src/components/modals/load-rom.tsx b/gbajs3/src/components/modals/load-rom.tsx
@@ -7,6 +7,7 @@ import { ModalBody } from './modal-body.tsx';
 import { ModalFooter } from './modal-footer.tsx';
 import { ModalHeader } from './modal-header.tsx';
 import { useEmulatorContext, useModalContext } from '../../hooks/context.tsx';
+import { useAddCallbacks } from '../../hooks/emulator/use-add-callbacks.tsx';
 import { useRunGame } from '../../hooks/emulator/use-run-game.tsx';
 import { useListRoms } from '../../hooks/use-list-roms.tsx';
 import { useLoadRom } from '../../hooks/use-load-rom.tsx';
@@ -94,19 +95,21 @@ export const LoadRomModal = () => {
   const [currentRomLoading, setCurrentRomLoading] = useState<string | null>(
     null
   );
+  const { syncActionIfEnabled } = useAddCallbacks();
 
   const shouldUploadRom = !romLoading && !!romFile && !!currentRomLoading;
 
   useEffect(() => {
     if (shouldUploadRom) {
       const runCallback = () => {
+        syncActionIfEnabled();
         runGame(emulator?.filePaths().gamePath + '/' + romFile.name);
       };
 
       emulator?.uploadRom(romFile, runCallback);
       setCurrentRomLoading(null);
     }
-  }, [emulator, shouldUploadRom, romFile, runGame]);
+  }, [emulator, shouldUploadRom, romFile, runGame, syncActionIfEnabled]);
 
   const tourSteps: TourSteps = [
     {

diff --git a/gbajs3/src/components/modals/load-save.tsx b/gbajs3/src/components/modals/load-save.tsx
@@ -7,6 +7,7 @@ import { ModalBody } from './modal-body.tsx';
 import { ModalFooter } from './modal-footer.tsx';
 import { ModalHeader } from './modal-header.tsx';
 import { useEmulatorContext, useModalContext } from '../../hooks/context.tsx';
+import { useAddCallbacks } from '../../hooks/emulator/use-add-callbacks.tsx';
 import { useListSaves } from '../../hooks/use-list-saves.tsx';
 import { useLoadSave } from '../../hooks/use-load-save.tsx';
 import {
@@ -78,6 +79,7 @@ export const LoadSaveModal = () => {
   const { setIsModalOpen } = useModalContext();
   const { emulator } = useEmulatorContext();
   const saveListId = useId();
+  const { syncActionIfEnabled } = useAddCallbacks();
   const {
     data: saveList,
     isLoading: saveListLoading,
@@ -97,10 +99,10 @@ export const LoadSaveModal = () => {
 
   useEffect(() => {
     if (shouldUploadSave) {
-      emulator?.uploadSaveOrSaveState(saveFile);
+      emulator?.uploadSaveOrSaveState(saveFile, syncActionIfEnabled);
       setCurrentSaveLoading(null);
     }
-  }, [emulator, shouldUploadSave, saveFile]);
+  }, [emulator, shouldUploadSave, saveFile, syncActionIfEnabled]);
 
   const tourSteps: TourSteps = [
     {

diff --git a/gbajs3/src/components/modals/save-states.tsx b/gbajs3/src/components/modals/save-states.tsx
@@ -9,6 +9,7 @@ import { ModalBody } from './modal-body.tsx';
 import { ModalFooter } from './modal-footer.tsx';
 import { ModalHeader } from './modal-header.tsx';
 import { useEmulatorContext, useModalContext } from '../../hooks/context.tsx';
+import { useAddCallbacks } from '../../hooks/emulator/use-add-callbacks.tsx';
 import { saveStateSlotLocalStorageKey } from '../controls/consts.tsx';
 import {
   EmbeddedProductTour,
@@ -95,6 +96,7 @@ export const SaveStatesModal = () => {
     saveStateSlotLocalStorageKey,
     0
   );
+  const { syncActionIfEnabled } = useAddCallbacks();
   const baseId = useId();
   const {
     register,
@@ -223,6 +225,7 @@ export const SaveStatesModal = () => {
                     const slot = parseInt(slotString);
                     emulator?.deleteSaveState(slot);
                     refreshSaveStates();
+                    syncActionIfEnabled();
                   }
                 }}
               >
@@ -248,6 +251,7 @@ export const SaveStatesModal = () => {
               refreshSaveStates();
               setCurrentSlot((prevState) => prevState + 1);
               setSaveStateError(null);
+              syncActionIfEnabled();
             } else {
               setSaveStateError('Failed to create save state');
             }

diff --git a/gbajs3/src/components/modals/upload-cheats.tsx b/gbajs3/src/components/modals/upload-cheats.tsx
@@ -6,6 +6,7 @@ import { ModalBody } from './modal-body.tsx';
 import { ModalFooter } from './modal-footer.tsx';
 import { ModalHeader } from './modal-header.tsx';
 import { useEmulatorContext, useModalContext } from '../../hooks/context.tsx';
+import { useAddCallbacks } from '../../hooks/emulator/use-add-callbacks.tsx';
 import {
   EmbeddedProductTour,
   type TourSteps
@@ -30,6 +31,7 @@ export const UploadCheatsModal = () => {
     formState: { isSubmitSuccessful },
     control
   } = useForm<InputProps>();
+  const { syncActionIfEnabled } = useAddCallbacks();
   const cheatsFormId = useId();
 
   const onDrop = useCallback(
@@ -43,6 +45,7 @@ export const UploadCheatsModal = () => {
   const onSubmit: SubmitHandler<InputProps> = ({ cheatFiles }) => {
     cheatFiles.forEach((cheatFiles) => emulator?.uploadCheats(cheatFiles));
     reset();
+    syncActionIfEnabled();
   };
 
   const tourSteps: TourSteps = [

diff --git a/gbajs3/src/components/modals/upload-public-external-roms.tsx b/gbajs3/src/components/modals/upload-public-external-roms.tsx
@@ -13,6 +13,7 @@ import { ModalBody } from './modal-body.tsx';
 import { ModalFooter } from './modal-footer.tsx';
 import { ModalHeader } from './modal-header.tsx';
 import { useEmulatorContext, useModalContext } from '../../hooks/context.tsx';
+import { useAddCallbacks } from '../../hooks/emulator/use-add-callbacks.tsx';
 import { useRunGame } from '../../hooks/emulator/use-run-game.tsx';
 import { useLoadExternalRom } from '../../hooks/use-load-external-rom.tsx';
 import { ErrorWithIcon } from '../shared/error-with-icon.tsx';
@@ -63,6 +64,7 @@ export const UploadPublicExternalRomsModal = ({
   const [currentRomURL, setCurrentRomURL] = useState<string | null>(null);
   const uploadRomButtonId = useId();
   const runGame = useRunGame();
+  const { syncActionIfEnabled } = useAddCallbacks();
 
   const {
     data: externalRomFile,
@@ -74,6 +76,7 @@ export const UploadPublicExternalRomsModal = ({
   useEffect(() => {
     if (!isExternalRomLoading && externalRomFile && currentRomURL) {
       const runCallback = () => {
+        syncActionIfEnabled();
         const hasSucceeded = runGame(
           emulator?.filePaths().gamePath + '/' + externalRomFile.name
         );
@@ -93,7 +96,8 @@ export const UploadPublicExternalRomsModal = ({
     emulator,
     externalRomFile,
     isExternalRomLoading,
-    setIsModalOpen
+    setIsModalOpen,
+    syncActionIfEnabled
   ]);
 
   return (

diff --git a/gbajs3/src/components/modals/upload-rom.tsx b/gbajs3/src/components/modals/upload-rom.tsx
@@ -8,6 +8,7 @@ import { ModalBody } from './modal-body.tsx';
 import { ModalFooter } from './modal-footer.tsx';
 import { ModalHeader } from './modal-header.tsx';
 import { useEmulatorContext, useModalContext } from '../../hooks/context.tsx';
+import { useAddCallbacks } from '../../hooks/emulator/use-add-callbacks.tsx';
 import { useRunGame } from '../../hooks/emulator/use-run-game.tsx';
 import { useLoadExternalRom } from '../../hooks/use-load-external-rom.tsx';
 import {
@@ -50,13 +51,15 @@ export const UploadRomModal = () => {
   } = useLoadExternalRom();
   const uploadRomFormId = useId();
   const runGame = useRunGame();
+  const { syncActionIfEnabled } = useAddCallbacks();
 
   const shouldUploadExternalRom =
     !isExternalRomLoading && !!externalRomFile && !!currentRomURL;
 
   useEffect(() => {
     if (shouldUploadExternalRom) {
       const runCallback = () => {
+        syncActionIfEnabled();
         const hasSucceeded = runGame(
           emulator?.filePaths().gamePath + '/' + externalRomFile.name
         );
@@ -72,7 +75,8 @@ export const UploadRomModal = () => {
     externalRomFile,
     emulator,
     setIsModalOpen,
-    runGame
+    runGame,
+    syncActionIfEnabled
   ]);
 
   const onDrop = useCallback(
@@ -91,6 +95,7 @@ export const UploadRomModal = () => {
     }
 
     const runCallback = () => {
+      syncActionIfEnabled();
       const hasSucceeded = runGame(
         emulator?.filePaths().gamePath + '/' + romFile.name
       );

diff --git a/gbajs3/src/components/modals/upload-saves.tsx b/gbajs3/src/components/modals/upload-saves.tsx
@@ -6,6 +6,7 @@ import { ModalBody } from './modal-body.tsx';
 import { ModalFooter } from './modal-footer.tsx';
 import { ModalHeader } from './modal-header.tsx';
 import { useEmulatorContext, useModalContext } from '../../hooks/context.tsx';
+import { useAddCallbacks } from '../../hooks/emulator/use-add-callbacks.tsx';
 import {
   EmbeddedProductTour,
   type TourSteps
@@ -26,6 +27,7 @@ const validFileExtensions = [
 export const UploadSavesModal = () => {
   const { setIsModalOpen } = useModalContext();
   const { emulator } = useEmulatorContext();
+  const { syncActionIfEnabled } = useAddCallbacks();
   const {
     reset,
     handleSubmit,
@@ -46,6 +48,7 @@ export const UploadSavesModal = () => {
   const onSubmit: SubmitHandler<InputProps> = ({ saveFiles }) => {
     saveFiles.forEach((saveFile) => emulator?.uploadSaveOrSaveState(saveFile));
     reset();
+    syncActionIfEnabled();
   };
 
   const tourSteps: TourSteps = [