From 7ac81d55e948e57b91f54ff132e8d23f5c9d7e59 Mon Sep 17 00:00:00 2001
From: TAKAHASHI Shuuji <shuuji3@gmail.com>
Date: Mon, 22 Apr 2024 21:38:53 +0900
Subject: [PATCH] TMP: fix: change search shortcut not working as expected yet

---
 .../magickeys/MagickeysKeyboardShortcuts.vue  | 69 ++++++++++---------
 plugins/magic-keys.client.ts                  |  6 +-
 2 files changed, 40 insertions(+), 35 deletions(-)

diff --git a/components/magickeys/MagickeysKeyboardShortcuts.vue b/components/magickeys/MagickeysKeyboardShortcuts.vue
index c6f5d308..0938625e 100644
--- a/components/magickeys/MagickeysKeyboardShortcuts.vue
+++ b/components/magickeys/MagickeysKeyboardShortcuts.vue
@@ -13,7 +13,7 @@ interface ShortcutDef {
 
 interface ShortcutItem {
   description: string
-  shortcut: ShortcutDef
+  shortcuts: ShortcutDef[]
 }
 
 interface ShortcutItemGroup {
@@ -30,63 +30,63 @@ const shortcutItemGroups = computed<ShortcutItemGroup[]>(() => [
     items: [
       {
         description: t('magic_keys.groups.navigation.shortcut_help'),
-        shortcut: { keys: ['?'], isSequence: false },
+        shortcuts: [{ keys: ['?'], isSequence: false }],
       },
       // {
       //   description: t('magic_keys.groups.navigation.next_status'),
-      //   shortcut: { keys: ['j'], isSequence: false },
+      //   shortcuts: [{ keys: ['j'], isSequence: false }],
       // },
       // {
       //   description: t('magic_keys.groups.navigation.previous_status'),
-      //   shortcut: { keys: ['k'], isSequence: false },
+      //   shortcuts: [{ keys: ['k'], isSequence: false }],
       // },
       {
         description: t('magic_keys.groups.navigation.go_to_search'),
-        shortcut: { keys: ['/'], isSequence: false },
+        shortcuts: [{ keys: ['g', '/'], isSequence: true }],
       },
       {
         description: t('magic_keys.groups.navigation.go_to_home'),
-        shortcut: { keys: ['g', 'h'], isSequence: true },
+        shortcuts: [{ keys: ['g', 'h'], isSequence: true }],
       },
       {
         description: t('magic_keys.groups.navigation.go_to_notifications'),
-        shortcut: { keys: ['g', 'n'], isSequence: true },
+        shortcuts: [{ keys: ['g', 'n'], isSequence: true }],
       },
       {
         description: t('magic_keys.groups.navigation.go_to_conversations'),
-        shortcut: { keys: ['g', 'c'], isSequence: true },
+        shortcuts: [{ keys: ['g', 'c'], isSequence: true }],
       },
       {
         description: t('magic_keys.groups.navigation.go_to_favourites'),
-        shortcut: { keys: ['g', 'f'], isSequence: true },
+        shortcuts: [{ keys: ['g', 'f'], isSequence: true }],
       },
       {
         description: t('magic_keys.groups.navigation.go_to_bookmarks'),
-        shortcut: { keys: ['g', 'b'], isSequence: true },
+        shortcuts: [{ keys: ['g', 'b'], isSequence: true }],
       },
       {
         description: t('magic_keys.groups.navigation.go_to_explore'),
-        shortcut: { keys: ['g', 'e'], isSequence: true },
+        shortcuts: [{ keys: ['g', 'e'], isSequence: true }],
       },
       {
         description: t('magic_keys.groups.navigation.go_to_local'),
-        shortcut: { keys: ['g', 'l'], isSequence: true },
+        shortcuts: [{ keys: ['g', 'l'], isSequence: true }],
       },
       {
         description: t('magic_keys.groups.navigation.go_to_federated'),
-        shortcut: { keys: ['g', 't'], isSequence: true },
+        shortcuts: [{ keys: ['g', 't'], isSequence: true }],
       },
       {
         description: t('magic_keys.groups.navigation.go_to_lists'),
-        shortcut: { keys: ['g', 'i'], isSequence: true },
+        shortcuts: [{ keys: ['g', 'i'], isSequence: true }],
       },
       {
         description: t('magic_keys.groups.navigation.go_to_settings'),
-        shortcut: { keys: ['g', 's'], isSequence: true },
+        shortcuts: [{ keys: ['g', 's'], isSequence: true }],
       },
       {
         description: t('magic_keys.groups.navigation.go_to_profile'),
-        shortcut: { keys: ['g', 'p'], isSequence: true },
+        shortcuts: [{ keys: ['g', 'p'], isSequence: true }],
       },
     ],
   },
@@ -95,34 +95,34 @@ const shortcutItemGroups = computed<ShortcutItemGroup[]>(() => [
     items: [
       {
         description: t('magic_keys.groups.actions.search'),
-        shortcut: { keys: [modifierKeyName.value, 'k'], isSequence: false },
+        shortcuts: [{ keys: [modifierKeyName.value, 'k'], isSequence: false }, { keys: ['/'], isSequence: false }],
       },
       {
         description: t('magic_keys.groups.actions.command_mode'),
-        shortcut: { keys: [modifierKeyName.value, '/'], isSequence: false },
+        shortcuts: [{ keys: [modifierKeyName.value, '/'], isSequence: false }],
       },
       {
         description: t('magic_keys.groups.actions.compose'),
-        shortcut: { keys: ['c'], isSequence: false },
+        shortcuts: [{ keys: ['c'], isSequence: false }],
       },
       {
         description: t('magic_keys.groups.actions.show_new_items'),
-        shortcut: { keys: ['.'], isSequence: false },
+        shortcuts: [{ keys: ['.'], isSequence: false }],
       },
       {
         description: t('magic_keys.groups.actions.favourite'),
-        shortcut: { keys: ['f'], isSequence: false },
+        shortcuts: [{ keys: ['f'], isSequence: false }],
       },
       {
         description: t('magic_keys.groups.actions.boost'),
-        shortcut: { keys: ['b'], isSequence: false },
+        shortcuts: [{ keys: ['b'], isSequence: false }],
       },
     ],
   },
-  {
-    name: t('magic_keys.groups.media.title'),
-    items: [],
-  },
+  // {
+  //   name: t('magic_keys.groups.media.title'),
+  //   items: [],
+  // },
 ])
 </script>
 
@@ -151,13 +151,16 @@ const shortcutItemGroups = computed<ShortcutItemGroup[]>(() => [
             {{ item.description }}
           </div>
           <div>
-            <template
-              v-for="(key, idx) in item.shortcut.keys"
-              :key="idx"
-            >
-              <span v-if="idx !== 0" mx1 text-sm op80>{{ item.shortcut.isSequence ? $t('magic_keys.sequence_then') : '+' }}</span>
-              <code class="px2 md:px1.5 lg:px2 lg:px2 py0 lg:py-0.5" rounded bg-code border="px $c-border-code" shadow-sm my1 font-mono font-600>{{ key }}</code>
-            </template>
+            <span v-for="(shortcut, shortcutIndex) in item.shortcuts" :key="shortcutIndex">
+              <template
+                v-for="(key, idx) in shortcut.keys"
+                :key="idx"
+              >
+                <span v-if="shortcutIndex !== 0">, </span>
+                <span v-if="idx !== 0" mx1 text-sm op80>{{ shortcut.isSequence ? $t('magic_keys.sequence_then') : '+' }}</span>
+                <code class="px2 md:px1.5 lg:px2 lg:px2 py0 lg:py-0.5" rounded bg-code border="px $c-border-code" shadow-sm my1 font-mono font-600>{{ key }}</code>
+              </template>
+            </span>
           </div>
         </div>
       </div>
diff --git a/plugins/magic-keys.client.ts b/plugins/magic-keys.client.ts
index 2c885347..42d50239 100644
--- a/plugins/magic-keys.client.ts
+++ b/plugins/magic-keys.client.ts
@@ -1,6 +1,7 @@
 import type { RouteLocationRaw } from 'vue-router'
 import { useMagicSequence } from '~/composables/magickeys'
 import { currentUser, getInstanceDomain } from '~/composables/users'
+import { openCommandPanel } from '~/composables/dialog'
 
 export default defineNuxtPlugin(({ $scrollToTop }) => {
   const keys = useMagicKeys()
@@ -34,7 +35,7 @@ export default defineNuxtPlugin(({ $scrollToTop }) => {
       openPublishDialog('dialog', getDefaultDraftItem())
     }
   }
-  whenever(logicAnd(isAuthenticated, notUsingInput, keys.c), defaultPublishDialog)
+  whenever(logicAnd(isAuthenticated, notUsingInput, useMagicSequence(['c'])), defaultPublishDialog)
 
   const instanceDomain = currentInstance.value ? getInstanceDomain(currentInstance.value) : 'm.webtoo.ls'
   whenever(logicAnd(notUsingInput, useMagicSequence(['g', 'h'])), () => navigateTo('/home'))
@@ -49,7 +50,8 @@ export default defineNuxtPlugin(({ $scrollToTop }) => {
   whenever(logicAnd(isAuthenticated, notUsingInput, useMagicSequence(['g', 'i'])), () => navigateTo('/lists'))
   whenever(logicAnd(notUsingInput, useMagicSequence(['g', 's'])), () => navigateTo('/settings'))
   whenever(logicAnd(isAuthenticated, notUsingInput, useMagicSequence(['g', 'p'])), () => navigateTo(`/${instanceDomain}/@${currentUser.value?.account.username}`))
-  whenever(logicAnd(notUsingInput, computed(() => keys.current.size === 1), keys['/']), () => navigateTo('/search'))
+  whenever(logicAnd(notUsingInput, useMagicSequence(['g', '/'])), () => navigateTo('/search'))
+  whenever(logicAnd(notUsingInput, useMagicSequence(['/'])), () => openCommandPanel())
 
   const toggleFavouriteActiveStatus = () => {
     // TODO: find a better solution than clicking buttons...