starred/archived-linsa
1
0
Fork 0
mirror of https://github.com/linsa-io/linsa.git synced 2026-01-12 12:20:23 +01:00
Code Issues 2 Packages Projects Releases Wiki Activity

refactor(command): improve command data

Browse Source
This commit is contained in:
Aslam H
2024-09-08 06:41:36 +07:00
parent 34b8df25d2
commit 713f198120
1 changed files with 24 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
web/components/custom/command-palette/command-data.ts
View File

@@ -5,7 +5,7 @@ import { HTMLLikeElement } from "@/lib/utils"
export type CommandAction = string | (() => void)
export type CommandItemType = {
export interface CommandItemType {
icon?: keyof typeof icons
value: string
label: HTMLLikeElement | string
@@ -14,10 +14,25 @@ export type CommandItemType = {
shortcut?: string
}
export type CommandGroupType = {
export type CommandGroupType = Array<{
heading?: string
items: CommandItemType[]
}[]
}>
const createNavigationItem = (
icon: keyof typeof icons,
value: string,
path: string,
actions: ReturnType<typeof useCommandActions>
): CommandItemType => ({
icon,
value: `Go to ${value}`,
label: {
tag: "span",
children: ["Go to ", { tag: "span", attributes: { className: "font-semibold" }, children: [value] }]
},
action: () => actions.navigateTo(path)
})
export const createCommandGroups = (
actions: ReturnType<typeof useCommandActions>,
@@ -81,51 +96,11 @@ export const createCommandGroups = (
{
heading: "Navigation",
items: [
{
icon: "ArrowRight",
value: "Go to Links",
label: {
tag: "span",
children: ["Go to ", { tag: "span", attributes: { className: "font-semibold" }, children: ["links"] }]
},
action: () => actions.navigateTo("/links")
},
{
icon: "ArrowRight",
value: "Go to Pages",
label: {
tag: "span",
children: ["Go to ", { tag: "span", attributes: { className: "font-semibold" }, children: ["pages"] }]
},
action: () => actions.navigateTo("/pages")
},
{
icon: "ArrowRight",
value: "Go to Search",
label: {
tag: "span",
children: ["Go to ", { tag: "span", attributes: { className: "font-semibold" }, children: ["search"] }]
},
action: () => actions.navigateTo("/search")
},
{
icon: "ArrowRight",
value: "Go to Profile",
label: {
tag: "span",
children: ["Go to ", { tag: "span", attributes: { className: "font-semibold" }, children: ["profile"] }]
},
action: () => actions.navigateTo("/profile")
},
{
icon: "ArrowRight",
value: "Go to Settings",
label: {
tag: "span",
children: ["Go to ", { tag: "span", attributes: { className: "font-semibold" }, children: ["settings"] }]
},
action: () => actions.navigateTo("/settings")
}
createNavigationItem("ArrowRight", "Links", "/links", actions),
createNavigationItem("ArrowRight", "Pages", "/pages", actions),
createNavigationItem("ArrowRight", "Search", "/search", actions),
createNavigationItem("ArrowRight", "Profile", "/profile", actions),
createNavigationItem("ArrowRight", "Settings", "/settings", actions)
]
}
],
@@ -149,7 +124,7 @@ export const createCommandGroups = (
},
{
icon: "Monitor",
value: "changeThemeToSystem",
value: "Change Theme to System",
label: "Change Theme to System",
action: () => actions.changeTheme("system")
}