ti.sil/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2025-12-15 22:05:19 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

refac: shortcuts

Browse source
This commit is contained in:
Timothy Jaeryang Baek 2025-11-06 13:08:48 -05:00
parent 8da4e5bb19
commit dc3d704800
1 changed files with 72 additions and 103 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

105
src/routes/(app)/+layout.svelte
View file

@ -165,91 +165,68 @@
]); ]);
// Helper function to check if the pressed keys match the shortcut definition // Helper function to check if the pressed keys match the shortcut definition
const checkShortcut = (event: KeyboardEvent, keys: string[]): boolean => { const isShortcutMatch = (event: KeyboardEvent, shortcut): boolean => {
const lowerCaseKeys = keys.map((key) => key.toLowerCase()); const keys = shortcut?.keys || [];
const isModPressed = lowerCaseKeys.includes('mod') ? event.ctrlKey || event.metaKey : true; const mainKeys = keys.filter(
const isShiftPressed = lowerCaseKeys.includes('shift') ? event.shiftKey : true; (k) => !['ctrl', 'Ctrl', 'shift', 'Shift', 'alt', 'Alt', 'mod', 'Mod'].includes(k)
const isAltPressed = lowerCaseKeys.includes('alt') ? event.altKey : true;
const isCtrlPressed = lowerCaseKeys.includes('ctrl') ? event.ctrlKey : true;
const mainKeys = lowerCaseKeys.filter(
(key) => !['mod', 'shift', 'alt', 'ctrl'].includes(key)
); );
if (mainKeys.length > 0 && !mainKeys.includes(event.code.toLowerCase())) { const normalized = keys.map((k) => k.toLowerCase());
return false; const needCtrl = normalized.includes('ctrl') || normalized.includes('mod');
} const needShift = normalized.includes('shift');
const needAlt = normalized.includes('alt');
let modConflict = false; // Get the main key pressed
if (keys.includes('mod')) { const keyPressed = event.code;
if (!lowerCaseKeys.includes('shift') && event.shiftKey) modConflict = true;
if (!lowerCaseKeys.includes('alt') && event.altKey) modConflict = true;
}
return ( // Check modifiers
!modConflict && if (needShift && !event.shiftKey) return false;
isModPressed &&
isShiftPressed && if (needCtrl && !(event.ctrlKey || event.metaKey)) return false;
isAltPressed && if (!needCtrl && (event.ctrlKey || event.metaKey)) return false;
isCtrlPressed && if (needAlt && !event.altKey) return false;
(event.ctrlKey || event.metaKey) === if (!needAlt && event.altKey) return false;
(lowerCaseKeys.includes('mod') || lowerCaseKeys.includes('ctrl')) &&
event.shiftKey === lowerCaseKeys.includes('shift') && if (mainKeys.length && !mainKeys.includes(keyPressed)) return false;
event.altKey === lowerCaseKeys.includes('alt')
); return true;
}; };
const setupKeyboardShortcuts = () => { const setupKeyboardShortcuts = () => {
document.addEventListener('keydown', async (event) => { document.addEventListener('keydown', async (event) => {
for (const shortcutName in shortcuts) { if (isShortcutMatch(event, shortcuts[Shortcut.SEARCH])) {
const shortcut = shortcuts[shortcutName];
if (checkShortcut(event, shortcut.keys)) {
// Here you can map the shortcut name to an action
// This is a simple example, you might want a more robust solution
switch (shortcutName) {
case Shortcut.SEARCH:
event.preventDefault(); event.preventDefault();
showSearch.set(!$showSearch); showSearch.set(!$showSearch);
break; } else if (isShortcutMatch(event, shortcuts[Shortcut.NEW_CHAT])) {
case Shortcut.NEW_CHAT:
event.preventDefault(); event.preventDefault();
document.getElementById('sidebar-new-chat-button')?.click(); document.getElementById('sidebar-new-chat-button')?.click();
break; } else if (isShortcutMatch(event, shortcuts[Shortcut.FOCUS_INPUT])) {
case Shortcut.FOCUS_INPUT:
event.preventDefault(); event.preventDefault();
document.getElementById('chat-input')?.focus(); document.getElementById('chat-input')?.focus();
break; } else if (isShortcutMatch(event, shortcuts[Shortcut.COPY_LAST_CODE_BLOCK])) {
case Shortcut.COPY_LAST_CODE_BLOCK:
event.preventDefault(); event.preventDefault();
[...document.getElementsByClassName('copy-code-button')]?.at(-1)?.click(); [...document.getElementsByClassName('copy-code-button')]?.at(-1)?.click();
break; } else if (isShortcutMatch(event, shortcuts[Shortcut.COPY_LAST_RESPONSE])) {
case Shortcut.COPY_LAST_RESPONSE:
event.preventDefault(); event.preventDefault();
[...document.getElementsByClassName('copy-response-button')]?.at(-1)?.click(); [...document.getElementsByClassName('copy-response-button')]?.at(-1)?.click();
break; } else if (isShortcutMatch(event, shortcuts[Shortcut.TOGGLE_SIDEBAR])) {
case Shortcut.TOGGLE_SIDEBAR:
event.preventDefault(); event.preventDefault();
showSidebar.set(!$showSidebar); showSidebar.set(!$showSidebar);
break; } else if (isShortcutMatch(event, shortcuts[Shortcut.DELETE_CHAT])) {
case Shortcut.DELETE_CHAT:
event.preventDefault(); event.preventDefault();
document.getElementById('delete-chat-button')?.click(); document.getElementById('delete-chat-button')?.click();
break; } else if (isShortcutMatch(event, shortcuts[Shortcut.OPEN_SETTINGS])) {
case Shortcut.OPEN_SETTINGS:
event.preventDefault(); event.preventDefault();
showSettings.set(!$showSettings); showSettings.set(!$showSettings);
break; } else if (isShortcutMatch(event, shortcuts[Shortcut.SHOW_SHORTCUTS])) {
case Shortcut.SHOW_SHORTCUTS:
event.preventDefault(); event.preventDefault();
showShortcuts.set(!$showShortcuts); showShortcuts.set(!$showShortcuts);
break; } else if (isShortcutMatch(event, shortcuts[Shortcut.CLOSE_MODAL])) {
case Shortcut.CLOSE_MODAL:
event.preventDefault(); event.preventDefault();
showSettings.set(false); showSettings.set(false);
showShortcuts.set(false); showShortcuts.set(false);
break; } else if (isShortcutMatch(event, shortcuts[Shortcut.NEW_TEMPORARY_CHAT])) {
case Shortcut.NEW_TEMPORARY_CHAT:
event.preventDefault(); event.preventDefault();
if ($user?.role !== 'admin' && $user?.permissions?.chat?.temporary_enforced) { if ($user?.role !== 'admin' && $user?.permissions?.chat?.temporary_enforced) {
temporaryChatEnabled.set(true); temporaryChatEnabled.set(true);
@ -260,24 +237,16 @@
setTimeout(() => { setTimeout(() => {
document.getElementById('new-chat-button')?.click(); document.getElementById('new-chat-button')?.click();
}, 0); }, 0);
break; } else if (isShortcutMatch(event, shortcuts[Shortcut.GENERATE_MESSAGE_PAIR])) {
case Shortcut.GENERATE_MESSAGE_PAIR:
event.preventDefault(); event.preventDefault();
document.getElementById('generate-message-pair-button')?.click(); document.getElementById('generate-message-pair-button')?.click();
break; } else if (isShortcutMatch(event, shortcuts[Shortcut.REGENERATE_RESPONSE])) {
case Shortcut.REGENERATE_RESPONSE:
event.preventDefault(); event.preventDefault();
[...document.getElementsByClassName('regenerate-response-button')]?.at(-1)?.click(); [...document.getElementsByClassName('regenerate-response-button')]?.at(-1)?.click();
break; } else if (isShortcutMatch(event, shortcuts[Shortcut.STOP_GENERATING])) {
case Shortcut.STOP_GENERATING: // This shortcut is handled in Chat.svelte
// Placeholder for future implementation } else if (isShortcutMatch(event, shortcuts[Shortcut.PREVENT_FILE_CREATION])) {
break;
case Shortcut.PREVENT_FILE_CREATION:
// This shortcut is handled by the paste event in MessageInput.svelte // This shortcut is handled by the paste event in MessageInput.svelte
break;
}
}
} }
}); });
}; };