feat(settings/options/2048): save board state to local storage

app/components/Settings/BottomScreen/Menus/Options/GbaMode.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-// TODO: store state in local storage
+import { useLocalStorage } from "@vueuse/core";
 
 const store = useSettingsStore();
 const confirmationModal = useConfirmationModal();
@@ -54,9 +54,17 @@ const BOARD_X = 64;
 const BOARD_Y = 32;
 const BOARD_SIZE = 4;
 
-const board = Array.from({ length: BOARD_SIZE }, () =>
-  Array.from({ length: BOARD_SIZE }, () => 0),
-);
+const emptyBoard = () =>
+  Array.from({ length: BOARD_SIZE }, () =>
+    Array.from({ length: BOARD_SIZE }, () => 0),
+  );
+
+const savedBoard = useLocalStorage("nds-2048-board", emptyBoard());
+const board = savedBoard.value.map((r) => [...r]);
+
+const saveBoard = () => {
+  savedBoard.value = board.map((r) => [...r]);
+};
 
 onRender((ctx) => {
   assets.images.home.topScreen.background.draw(ctx, 0, 0);
@@ -182,6 +190,7 @@ const resetBoard = () => {
 
   spawnTile();
   spawnTile();
+  saveBoard();
 };
 
 const isDead = () => {
@@ -198,7 +207,9 @@ const isDead = () => {
   return true;
 };
 
-resetBoard();
+if (board.every((r) => r.every((c) => c === 0))) {
+  resetBoard();
+}
 
 const slide = (rowDir: number, colDir: number) => {
   const before = board.map((r) => [...r]);
@@ -211,6 +222,7 @@ const slide = (rowDir: number, colDir: number) => {
   if (!moved) return;
 
   spawnTile();
+  saveBoard();
   if (isDead()) {
     confirmationModal.open({
       text: "Game Over!\nRestart?",