fix: shortcuts only block keyboard actions when needed, and change some keybinds

app/composables/useKeyboardShortcuts.ts

@@ -1,10 +1,10 @@
 export const useKeyboardShortcuts = () => {
-    const shortcutsMap = new Map<string, () => void>();
+    const shortcutsMap = new Map<string, (event: KeyboardEvent) => void>();
 
     const normalize = (combo: string[]) =>
         combo.map(k => k.toLowerCase()).sort().join('+');
 
-    const addShortcut = (combo: string[], callback: () => void) => {
+    const addShortcut = (combo: string[], callback: (event: KeyboardEvent) => void) => {
         const normalizedKey = normalize(combo);
         shortcutsMap.set(normalizedKey, callback);
 
@@ -28,9 +28,7 @@ export const useKeyboardShortcuts = () => {
         const pressedCombo = normalize(keys);
 
         if (shortcutsMap.has(pressedCombo)) {
-            event.preventDefault();
+            shortcutsMap.get(pressedCombo)!(event);
-            event.stopPropagation();
-            shortcutsMap.get(pressedCombo)!();
         }
     };
 

app/layouts/default.vue

@@ -5,7 +5,9 @@ const { colorScheme } = await useUserSettings();
 const { toggle: toggleSidebar } = useSidebar();
 const { addShortcut } = useKeyboardShortcuts();
 
-addShortcut(['ctrl', '['], () => {
+addShortcut(['ctrl', '['], (event) => {
+    event.preventDefault();
+    event.stopPropagation();
     toggleSidebar();
 });
 

app/pages/agent/[id]/topic/[topicId].vue

@@ -258,32 +258,42 @@ const activeGeneration = computed(() => {
 
 const { scrollToBottom } = useAutoScroll(chatPaneWrapper);
 
-addShortcut(['ctrl', 'alt', 'n'], () => {
+addShortcut(['ctrl', 'alt', 'n'], (event) => {
+    event.preventDefault();
+    event.stopPropagation();
+    (document.activeElement as HTMLElement | undefined)?.blur();
     return navigateTo(`/agent/${route.params.id}`);
 });
 
-addShortcut(['ctrl', 'shift', 'enter'], () => {
+addShortcut(['ctrl', 'shift', 'enter'], (event) => {
     const lastMessage = topic.value?.messages?.at(-1);
     if (lastMessage) {
+        event.preventDefault();
+        event.stopPropagation();
         handleRegenerate(lastMessage);
     }
 });
 
-addShortcut(['ctrl', 'shift', 'backspace'], () => {
+addShortcut(['ctrl', 'shift', 'backspace'], (event) => {
     const lastMessage = topic.value?.messages?.at(-1);
     if (lastMessage) {
+        event.preventDefault();
+        event.stopPropagation();
         handleDelete(lastMessage);
     }
 });
 
-addShortcut(['ctrl', 'c'], () => {
+addShortcut(['ctrl', 'shift', 'c'], (event) => {
     if (activeGeneration.value === null) return;
 
+    event.preventDefault();
+    event.stopPropagation();
     handleCancel();
 })
 
-addShortcut(['alt', '['], async () => {
+addShortcut(['alt', '['], async (event) => {
-    console.log("left");
+    event.preventDefault();
+    event.stopPropagation();
 
     const lastMessage = topic.value?.messages?.at(-1);
     if (lastMessage && lastMessage.children.length > 0) {
@@ -293,8 +303,9 @@ addShortcut(['alt', '['], async () => {
     }
 })
 
-addShortcut(['alt', ']'], async () => {
+addShortcut(['alt', ']'], async (event) => {
-    console.log("right");
+    event.preventDefault();
+    event.stopPropagation();
 
     const lastMessage = topic.value?.messages?.at(-1);
     if (lastMessage && lastMessage.children.length > 0) {