diff options
Diffstat (limited to 'src/modules/command-palette/command-palette.store.ts')
-rw-r--r-- | src/modules/command-palette/command-palette.store.ts | 68 |
1 files changed, 68 insertions, 0 deletions
diff --git a/src/modules/command-palette/command-palette.store.ts b/src/modules/command-palette/command-palette.store.ts new file mode 100644 index 0000000..f215388 --- /dev/null +++ b/src/modules/command-palette/command-palette.store.ts @@ -0,0 +1,68 @@ +import { defineStore } from 'pinia'; +import _ from 'lodash'; +import type { PaletteOption } from './command-palette.types'; +import { useToolStore } from '@/tools/tools.store'; +import { useFuzzySearch } from '@/composable/fuzzySearch'; +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'; + +export const useCommandPaletteStore = defineStore('command-palette', () => { + const toolStore = useToolStore(); + const styleStore = useStyleStore(); + const searchPrompt = ref(''); + + const toolsOptions = toolStore.tools.map(tool => ({ + ...tool, + to: tool.path, + toolCategory: tool.category, + category: 'Tools', + })); + + const searchOptions: PaletteOption[] = [ + ...toolsOptions, + { + name: 'Toggle dark mode', + description: 'Toggle dark mode on or off.', + action: () => styleStore.toggleDark(), + icon: SunIcon, + category: 'Actions', + keywords: ['dark', 'theme', 'toggle', 'mode', 'light', 'system'], + }, + { + name: 'Github repository', + href: 'https://github.com/CorentinTh/it-tools', + category: 'External', + description: 'View the source code of it-tools on Github.', + keywords: ['github', 'repo', 'repository', 'source', 'code'], + icon: GithubIcon, + }, + { + name: 'Report a bug or an issue', + description: 'Report a bug or an issue to help improve it-tools.', + href: 'https://github.com/CorentinTh/it-tools/issues/new/choose', + category: 'Actions', + keywords: ['report', 'issue', 'bug', 'problem', 'error'], + icon: BugIcon, + }, + ]; + + const { searchResult } = useFuzzySearch({ + search: searchPrompt, + data: searchOptions, + options: { + keys: [{ name: 'name', weight: 2 }, 'description', 'keywords', 'category'], + threshold: 0.3, + }, + }); + + const filteredSearchResult = computed(() => + _.chain(searchResult.value).groupBy('category').mapValues(categoryOptions => _.take(categoryOptions, 5)).value()); + + return { + filteredSearchResult, + searchPrompt, + }; +}); |