feat: add project switching functionality to command palette
This commit is contained in:
@@ -14,9 +14,11 @@ import {
|
|||||||
Activity,
|
Activity,
|
||||||
BarChart3,
|
BarChart3,
|
||||||
BookOpen,
|
BookOpen,
|
||||||
|
Check,
|
||||||
Clock,
|
Clock,
|
||||||
Copy,
|
Copy,
|
||||||
FileText,
|
FileText,
|
||||||
|
FolderOpen,
|
||||||
Layers,
|
Layers,
|
||||||
LayoutDashboard,
|
LayoutDashboard,
|
||||||
Megaphone,
|
Megaphone,
|
||||||
@@ -85,7 +87,7 @@ function ShortcutHint({shortcut}: {shortcut: [string, string]}) {
|
|||||||
|
|
||||||
export function CommandPalette() {
|
export function CommandPalette() {
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const {activeProject} = useActiveProject();
|
const {activeProject, availableProjects, setActiveProject} = useActiveProject();
|
||||||
const [open, setOpen] = useState(false);
|
const [open, setOpen] = useState(false);
|
||||||
const [query, setQuery] = useState('');
|
const [query, setQuery] = useState('');
|
||||||
const [debouncedQuery, setDebouncedQuery] = useState('');
|
const [debouncedQuery, setDebouncedQuery] = useState('');
|
||||||
@@ -188,6 +190,13 @@ export function CommandPalette() {
|
|||||||
? CREATE_ACTIONS.filter(a => matches(a.label, query) || matches(a.keywords, query))
|
? CREATE_ACTIONS.filter(a => matches(a.label, query) || matches(a.keywords, query))
|
||||||
: CREATE_ACTIONS;
|
: CREATE_ACTIONS;
|
||||||
|
|
||||||
|
const filteredProjects = availableProjects.filter(p => matches(p.name, debouncedQuery || query));
|
||||||
|
|
||||||
|
const switchProject = (project: (typeof availableProjects)[number]) => {
|
||||||
|
setActiveProject(project);
|
||||||
|
setOpen(false);
|
||||||
|
};
|
||||||
|
|
||||||
const navigate = (href: string, label: string) => {
|
const navigate = (href: string, label: string) => {
|
||||||
void router.push(href);
|
void router.push(href);
|
||||||
addRecentPage({label, href});
|
addRecentPage({label, href});
|
||||||
@@ -215,7 +224,8 @@ export function CommandPalette() {
|
|||||||
workflows.length > 0 ||
|
workflows.length > 0 ||
|
||||||
segments.length > 0 ||
|
segments.length > 0 ||
|
||||||
filteredNavActions.length > 0 ||
|
filteredNavActions.length > 0 ||
|
||||||
filteredCreateActions.length > 0
|
filteredCreateActions.length > 0 ||
|
||||||
|
filteredProjects.length > 0
|
||||||
: true;
|
: true;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -329,6 +339,27 @@ export function CommandPalette() {
|
|||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
{availableProjects.length > 1 && filteredProjects.length > 0 && (
|
||||||
|
<>
|
||||||
|
<CommandGroup heading="Switch project">
|
||||||
|
{filteredProjects.map(project => (
|
||||||
|
<CommandItem
|
||||||
|
key={project.id}
|
||||||
|
value={`project-${project.id}-${project.name}`}
|
||||||
|
onSelect={() => switchProject(project)}
|
||||||
|
>
|
||||||
|
<FolderOpen className="mr-3 h-4 w-4 text-neutral-400 shrink-0" />
|
||||||
|
<span>{project.name}</span>
|
||||||
|
{project.id === activeProject?.id && (
|
||||||
|
<Check className="ml-auto h-4 w-4 text-neutral-400 shrink-0" />
|
||||||
|
)}
|
||||||
|
</CommandItem>
|
||||||
|
))}
|
||||||
|
</CommandGroup>
|
||||||
|
<CommandSeparator />
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
|
||||||
{filteredNavActions.length > 0 && (
|
{filteredNavActions.length > 0 && (
|
||||||
<CommandGroup heading="Go to">
|
<CommandGroup heading="Go to">
|
||||||
{filteredNavActions.map(action => {
|
{filteredNavActions.map(action => {
|
||||||
|
|||||||
Reference in New Issue
Block a user