Add save reset

src/App.svelte

@@ -4,7 +4,7 @@
   import Wrapper from "./components/Wrapper.svelte";
   import { SharkGame } from "./shark/SharkGame";
 
-  import { Modals, closeModal } from "svelte-modals";
+  import { Modals, closeAllModals } from "svelte-modals";
   import { onDestroy, onMount } from "svelte";
   import type { Unsubscriber } from "svelte/store";
 
@@ -28,7 +28,7 @@
 
   function handleKeyUp(event: KeyboardEvent) {
     if (event.key === "Escape") {
-      closeModal();
+      closeAllModals();
     }
   }
 </script>
@@ -36,7 +36,7 @@
 <svelte:body on:keyup={handleKeyUp} />
 
 <Modals>
-  <div slot="backdrop" id="modal-backdrop" on:click={closeModal} />
+  <div slot="backdrop" id="modal-backdrop" on:click={closeAllModals} />
 </Modals>
 {#await SharkGame.initialize()}
   Loading...

src/components/Header.svelte

@@ -4,6 +4,7 @@
 
   import SettingsModal from "./Modals/SettingsModal.svelte";
   import HelpModal from "./Modals/HelpModal.svelte";
+  import ResetModal from "./Modals/ResetModal.svelte";
 
   export let title: string;
   export let game: typeof SharkGame;
@@ -21,7 +22,7 @@
       openModal(HelpModal, { discordLink }, { replace: true });
     },
     reset() {
-      console.log("reset");
+      openModal(ResetModal, { game }, { replace: true });
     },
   };
   const otherHeaderButtons = {

src/components/Modals/Base/ConfirmModal.svelte

@@ -0,0 +1,20 @@
+<script lang="ts">
+  import { closeModal } from "svelte-modals";
+
+  import BaseModal from "./Modal.svelte";
+
+  export let isOpen: boolean;
+
+  export let confirm: () => void;
+  export let deny: () => void = closeModal;
+</script>
+
+<BaseModal {isOpen}>
+  <div id="confirm-modal">
+    <slot>Are you sure?</slot>
+    <div>
+      <button on:click={confirm}>Yes.</button>
+      <button on:click={deny}>No.</button>
+    </div>
+  </div>
+</BaseModal>

src/components/Modals/HelpModal.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import BaseModal from "./BaseModal.svelte";
+  import BaseModal from "./Base/Modal.svelte";
 
   export let isOpen: boolean;
   export let discordLink: string;

src/components/Modals/ResetModal.svelte

@@ -0,0 +1,18 @@
+<script lang="ts">
+  import { closeAllModals } from "svelte-modals";
+
+  import type { SharkGame } from "../../shark/SharkGame";
+
+  import ConfirmModal from "./Base/ConfirmModal.svelte";
+
+  export let isOpen: boolean;
+  export let game: typeof SharkGame;
+</script>
+
+<ConfirmModal
+  {isOpen}
+  confirm={() => {
+    game.SaveHandler.reset();
+  }}
+  deny={closeAllModals}>Do you want to reset your save?</ConfirmModal
+>

src/components/Modals/SettingsModal.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import type { Settings } from "../../shark/Settings";
 
-  import BaseModal from "./BaseModal.svelte";
+  import BaseModal from "./Base/Modal.svelte";
 
   export let isOpen: boolean;
 

src/shark/SaveHandler.ts

@@ -128,6 +128,16 @@ export class SaveHandler extends StaticClass {
     console.timeEnd("Done loading");
   }
 
+  static reset(): void {
+    const localSave = localStorage.getItem(SaveHandler.saveName);
+    if (localSave !== null) {
+      localStorage.setItem(SaveHandler.saveName + "-backup", localSave);
+    }
+
+    localStorage.removeItem(SaveHandler.saveName);
+    window.location.reload();
+  }
+
   static migrators: ((save: Save) => Save)[] = [
     (): Version1Save => {
       const newSave = {