feat: add more shortcuts

src/composable/shortcut.js

@@ -27,6 +27,10 @@ export const mapShortcuts = {
     id: 'action:search',
     combo: 'mod+shift+f',
   },
+  'action:new': {
+    id: 'action:new',
+    combo: 'mod+option+n',
+  },
   'editor:duplicate-block': {
     id: 'editor:duplicate-block',
     combo: 'mod+option+d',

src/newtab/pages/Collections.vue

@@ -14,7 +14,11 @@
         prepend-icon="riSearch2Line"
         class="flex-1"
       />
-      <ui-button variant="accent" @click="newCollection">
+      <ui-button
+        :title="shortcut['action:new'].readable"
+        variant="accent"
+        @click="newCollection"
+      >
         {{ t('collection.new') }}
       </ui-button>
     </div>
@@ -57,11 +61,6 @@ import SharedCard from '@/components/newtab/shared/SharedCard.vue';
 
 const dialog = useDialog();
 const { t } = useI18n();
-const shortcut = useShortcut('action:search', () => {
-  const searchInput = document.querySelector('#search-input input');
-
-  searchInput?.focus();
-});
 
 const collectionCardMenu = [
   { id: 'rename', name: t('common.rename'), icon: 'riPencilLine' },
@@ -124,5 +123,14 @@ function deleteCollection({ name, id }) {
   });
 }
 
+const shortcut = useShortcut(['action:search', 'action:new'], ({ id }) => {
+  if (id === 'action:search') {
+    const searchInput = document.querySelector('#search-input input');
+    searchInput?.focus();
+  } else {
+    newCollection();
+  }
+});
+
 const menuHandlers = { rename: renameCollection, delete: deleteCollection };
 </script>

src/newtab/pages/Workflows.vue

@@ -54,7 +54,11 @@
         <v-remixicon name="riUploadLine" class="mr-2 -ml-1" />
         {{ t('workflow.import') }}
       </ui-button>
-      <ui-button variant="accent" @click="newWorkflow">
+      <ui-button
+        :title="shortcut['action:new'].readable"
+        variant="accent"
+        @click="newWorkflow"
+      >
         {{ t('workflow.new') }}
       </ui-button>
     </div>
@@ -174,19 +178,14 @@
 import { computed, shallowReactive, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useDialog } from '@/composable/dialog';
+import { useShortcut } from '@/composable/shortcut';
 import { sendMessage } from '@/utils/message';
 import { exportWorkflow, importWorkflow } from '@/utils/workflow-data';
-import { useShortcut } from '@/composable/shortcut';
 import SharedCard from '@/components/newtab/shared/SharedCard.vue';
 import Workflow from '@/models/workflow';
 
 const dialog = useDialog();
 const { t } = useI18n();
-const shortcut = useShortcut('action:search', () => {
-  const searchInput = document.querySelector('#search-input input');
-
-  searchInput?.focus();
-});
 
 const sorts = ['name', 'createdAt'];
 const menu = [
@@ -287,6 +286,14 @@ async function handleWorkflowModal() {
   }
 }
 
+const shortcut = useShortcut(['action:search', 'action:new'], ({ id }) => {
+  if (id === 'action:search') {
+    const searchInput = document.querySelector('#search-input input');
+    searchInput?.focus();
+  } else {
+    newWorkflow();
+  }
+});
 const menuHandlers = {
   export: exportWorkflow,
   rename: renameWorkflow,