refactor: add ignoreWhenModalOpen parameter to useKeyDown

app/components/Settings/BottomScreen/Menus/Clock/Achievements.vue

@@ -151,12 +151,15 @@ onClick((x, y) => {
   }
 });
 
-useKeyDown(({ key }) => {
-  if (isAnimating.value) return;
-  if (key === "NDS_X") {
-    handleVisitAll();
-  }
-});
+useKeyDown(
+  ({ key }) => {
+    if (isAnimating.value) return;
+    if (key === "NDS_X") {
+      handleVisitAll();
+    }
+  },
+  { ignoreWhenModalOpen: true },
+);
 
 onRender((ctx) => {
   // slash divider

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

@@ -600,27 +600,30 @@ const slide = (rowDir: number, colDir: number) => {
   }
 };
 
-useKeyDown(({ key }) => {
-  if (isAnimating.value || confirmationModal.isOpen) return;
-  switch (key) {
-    case "NDS_UP":
-    case "NDS_SWIPE_UP":
-      slide(-1, 0);
-      break;
-    case "NDS_DOWN":
-    case "NDS_SWIPE_DOWN":
-      slide(1, 0);
-      break;
-    case "NDS_LEFT":
-    case "NDS_SWIPE_LEFT":
-      slide(0, -1);
-      break;
-    case "NDS_RIGHT":
-    case "NDS_SWIPE_RIGHT":
-      slide(0, 1);
-      break;
-  }
-});
+useKeyDown(
+  ({ key }) => {
+    if (isAnimating.value) return;
+    switch (key) {
+      case "NDS_UP":
+      case "NDS_SWIPE_UP":
+        slide(-1, 0);
+        break;
+      case "NDS_DOWN":
+      case "NDS_SWIPE_DOWN":
+        slide(1, 0);
+        break;
+      case "NDS_LEFT":
+      case "NDS_SWIPE_LEFT":
+        slide(0, -1);
+        break;
+      case "NDS_RIGHT":
+      case "NDS_SWIPE_RIGHT":
+        slide(0, 1);
+        break;
+    }
+  },
+  { ignoreWhenModalOpen: true },
+);
 </script>
 
 <template>

app/composables/useKeyDown.ts

@@ -6,11 +6,17 @@ export type KeyDownCallback = (params: {
   repeated: boolean;
 }) => void;
 
-export const useKeyDown = (callback: KeyDownCallback) => {
+export const useKeyDown = (
+  callback: KeyDownCallback,
+  // the confirmation modal's own buttons rely on useKeyDown, so this is opt-in
+  options: { ignoreWhenModalOpen?: boolean } = {},
+) => {
   const app = useAppStore();
+  const confirmationModal = useConfirmationModal();
 
   const handleKeyDown = (event: KeyboardEvent) => {
     if (app.lagModalOpen) return;
+    if (options.ignoreWhenModalOpen && confirmationModal.isOpen) return;
 
     const ndsButton = mapCodeToNDS(event.code);
     if (