46 lines
1.2 KiB
Vue
46 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
import BaseButton from '@/components/base/BaseButton.vue'
|
|
import {useBaseStore} from '@/stores/base'
|
|
import {onBeforeUnmount, onMounted} from 'vue'
|
|
import {eventToShortcutString} from '@/helpers/shortcut'
|
|
import {isAppleDevice} from '@/helpers/isAppleDevice'
|
|
|
|
const baseStore = useBaseStore()
|
|
|
|
// See https://github.com/github/hotkey/discussions/85#discussioncomment-5214660
|
|
function openQuickActionsViaHotkey(event) {
|
|
const shortcutString = eventToShortcutString(event)
|
|
if (!shortcutString) return
|
|
|
|
// On macOS, use Cmd+K (Meta+K), on other platforms use Ctrl+K (Control+K)
|
|
const expectedShortcut = isAppleDevice() ? 'Meta+KeyK' : 'Control+KeyK'
|
|
if (shortcutString !== expectedShortcut) return
|
|
|
|
event.preventDefault()
|
|
|
|
openQuickActions()
|
|
}
|
|
|
|
onMounted(() => {
|
|
document.addEventListener('keydown', openQuickActionsViaHotkey)
|
|
})
|
|
|
|
onBeforeUnmount(() => {
|
|
document.removeEventListener('keydown', openQuickActionsViaHotkey)
|
|
})
|
|
|
|
function openQuickActions() {
|
|
baseStore.setQuickActionsActive(true)
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<BaseButton
|
|
class="trigger-button"
|
|
:title="$t('keyboardShortcuts.quickSearch')"
|
|
@click="openQuickActions"
|
|
>
|
|
<Icon icon="search" />
|
|
</BaseButton>
|
|
</template>
|