diff --git a/src/modules/command-palette/command-palette.store.ts b/src/modules/command-palette/command-palette.store.ts index f2153884..9637f95d 100644 --- a/src/modules/command-palette/command-palette.store.ts +++ b/src/modules/command-palette/command-palette.store.ts @@ -8,10 +8,12 @@ import { useStyleStore } from '@/stores/style.store'; import SunIcon from '~icons/mdi/white-balance-sunny'; import GithubIcon from '~icons/mdi/github'; import BugIcon from '~icons/mdi/bug-outline'; +import DiceIcon from '~icons/mdi/dice-5'; export const useCommandPaletteStore = defineStore('command-palette', () => { const toolStore = useToolStore(); const styleStore = useStyleStore(); + const router = useRouter(); const searchPrompt = ref(''); const toolsOptions = toolStore.tools.map(tool => ({ @@ -23,6 +25,18 @@ export const useCommandPaletteStore = defineStore('command-palette', () => { const searchOptions: PaletteOption[] = [ ...toolsOptions, + { + name: 'Random tool', + description: 'Get a random tool from the list.', + action: () => { + const { path } = _.sample(toolStore.tools)!; + router.push(path); + }, + icon: DiceIcon, + category: 'Tools', + keywords: ['random', 'tool', 'pick', 'choose', 'select'], + closeOnSelect: true, + }, { name: 'Toggle dark mode', description: 'Toggle dark mode on or off.', diff --git a/src/modules/command-palette/command-palette.types.ts b/src/modules/command-palette/command-palette.types.ts index 0b072a7f..325eba2c 100644 --- a/src/modules/command-palette/command-palette.types.ts +++ b/src/modules/command-palette/command-palette.types.ts @@ -10,4 +10,5 @@ export interface PaletteOption { category: string keywords?: string[] href?: string + closeOnSelect?: boolean } diff --git a/src/modules/command-palette/command-palette.vue b/src/modules/command-palette/command-palette.vue index bd431a02..12ad5fbb 100644 --- a/src/modules/command-palette/command-palette.vue +++ b/src/modules/command-palette/command-palette.vue @@ -76,19 +76,35 @@ function getOptionIndex(option: PaletteOption) { } function activateOption(option: PaletteOption) { + const { closeOnSelect } = option; + if (option.action) { option.action(); + + if (closeOnSelect) { + close(); + } + return; } + const closeAfterNavigation = closeOnSelect || _.isUndefined(closeOnSelect); + if (option.to) { router.push(option.to); - close(); + + if (closeAfterNavigation) { + close(); + } + return; } if (option.href) { window.open(option.href, '_blank'); - close(); + + if (closeAfterNavigation) { + close(); + } } }