From e70c3b77227c98f27ca3a08c5ea3fb9933c37cbd Mon Sep 17 00:00:00 2001 From: Illia Filippov Date: Tue, 23 Dec 2025 00:50:21 +0100 Subject: [PATCH 1/4] fix: project picker dropdown highlights first item instead of current project --- .../components/project-selector-with-options.tsx | 1 + .../layout/sidebar/hooks/use-project-picker.ts | 11 +++++++++-- 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/apps/ui/src/components/layout/sidebar/components/project-selector-with-options.tsx b/apps/ui/src/components/layout/sidebar/components/project-selector-with-options.tsx index d5b24899..f117d329 100644 --- a/apps/ui/src/components/layout/sidebar/components/project-selector-with-options.tsx +++ b/apps/ui/src/components/layout/sidebar/components/project-selector-with-options.tsx @@ -69,6 +69,7 @@ export function ProjectSelectorWithOptions({ filteredProjects, } = useProjectPicker({ projects, + currentProject, isProjectPickerOpen, setIsProjectPickerOpen, setCurrentProject, diff --git a/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts b/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts index 7a8566dc..e2bc9856 100644 --- a/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts +++ b/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts @@ -3,6 +3,7 @@ import type { Project } from '@/lib/electron'; interface UseProjectPickerProps { projects: Project[]; + currentProject: Project | null; isProjectPickerOpen: boolean; setIsProjectPickerOpen: (value: boolean | ((prev: boolean) => boolean)) => void; setCurrentProject: (project: Project) => void; @@ -10,6 +11,7 @@ interface UseProjectPickerProps { export function useProjectPicker({ projects, + currentProject, isProjectPickerOpen, setIsProjectPickerOpen, setCurrentProject, @@ -32,13 +34,18 @@ export function useProjectPicker({ setSelectedProjectIndex(0); }, [filteredProjects.length, projectSearchQuery]); - // Reset search query when dropdown closes + // Reset search query when dropdown closes, set to current project index when it opens useEffect(() => { if (!isProjectPickerOpen) { setProjectSearchQuery(''); setSelectedProjectIndex(0); + } else if (currentProject) { + const currentIndex = filteredProjects.findIndex((p) => p.id === currentProject.id); + if (currentIndex !== -1) { + setSelectedProjectIndex(currentIndex); + } } - }, [isProjectPickerOpen]); + }, [isProjectPickerOpen, currentProject, filteredProjects]); // Focus the search input when dropdown opens useEffect(() => { From 38f2e0beea054b310f4b9f558c92a7bd3dacc82d Mon Sep 17 00:00:00 2001 From: Illia Filippov Date: Tue, 23 Dec 2025 01:36:20 +0100 Subject: [PATCH 2/4] fix: ensure current project is highlighted in project picker dropdown without side effects --- .../layout/sidebar/hooks/use-project-picker.ts | 17 ++++++++++++++--- 1 file changed, 14 insertions(+), 3 deletions(-) diff --git a/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts b/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts index e2bc9856..0ce4ec16 100644 --- a/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts +++ b/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts @@ -29,8 +29,19 @@ export function useProjectPicker({ return projects.filter((project) => project.name.toLowerCase().includes(query)); }, [projects, projectSearchQuery]); + const getCurrentProjectIndex = useCallback(() => { + return currentProject ? filteredProjects.findIndex((p) => p.id === currentProject.id) : -1; + }, [currentProject, filteredProjects]); + // Reset selection when filtered results change useEffect(() => { + if (!projectSearchQuery.trim()) { + const currentIndex = getCurrentProjectIndex(); + if (currentIndex !== -1) { + setSelectedProjectIndex(currentIndex); + return; + } + } setSelectedProjectIndex(0); }, [filteredProjects.length, projectSearchQuery]); @@ -39,13 +50,13 @@ export function useProjectPicker({ if (!isProjectPickerOpen) { setProjectSearchQuery(''); setSelectedProjectIndex(0); - } else if (currentProject) { - const currentIndex = filteredProjects.findIndex((p) => p.id === currentProject.id); + } else { + const currentIndex = getCurrentProjectIndex(); if (currentIndex !== -1) { setSelectedProjectIndex(currentIndex); } } - }, [isProjectPickerOpen, currentProject, filteredProjects]); + }, [isProjectPickerOpen, currentProject]); // Focus the search input when dropdown opens useEffect(() => { From a398367f00ba7472318a0929ae47c635b8f2bf87 Mon Sep 17 00:00:00 2001 From: Illia Filippov Date: Tue, 23 Dec 2025 02:06:49 +0100 Subject: [PATCH 3/4] refactor: simplify project index retrieval and selection logic in project picker --- .../layout/sidebar/hooks/use-project-picker.ts | 14 ++++++-------- 1 file changed, 6 insertions(+), 8 deletions(-) diff --git a/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts b/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts index 0ce4ec16..c8cf0d23 100644 --- a/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts +++ b/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts @@ -29,9 +29,9 @@ export function useProjectPicker({ return projects.filter((project) => project.name.toLowerCase().includes(query)); }, [projects, projectSearchQuery]); - const getCurrentProjectIndex = useCallback(() => { + const getCurrentProjectIndex = () => { return currentProject ? filteredProjects.findIndex((p) => p.id === currentProject.id) : -1; - }, [currentProject, filteredProjects]); + }; // Reset selection when filtered results change useEffect(() => { @@ -42,8 +42,9 @@ export function useProjectPicker({ return; } } + setSelectedProjectIndex(0); - }, [filteredProjects.length, projectSearchQuery]); + }, [filteredProjects.length, projectSearchQuery, currentProject]); // Reset search query when dropdown closes, set to current project index when it opens useEffect(() => { @@ -51,16 +52,13 @@ export function useProjectPicker({ setProjectSearchQuery(''); setSelectedProjectIndex(0); } else { + // Set the selected project index to the current project index const currentIndex = getCurrentProjectIndex(); if (currentIndex !== -1) { setSelectedProjectIndex(currentIndex); } - } - }, [isProjectPickerOpen, currentProject]); - // Focus the search input when dropdown opens - useEffect(() => { - if (isProjectPickerOpen) { + // Focus the search input when dropdown opens // Small delay to ensure the dropdown is rendered setTimeout(() => { projectSearchInputRef.current?.focus(); From 50a595a8dab733634bf0e491921e4fd8f422412d Mon Sep 17 00:00:00 2001 From: Illia Filippov Date: Tue, 23 Dec 2025 02:30:28 +0100 Subject: [PATCH 4/4] fix(useProjectPicker): ensure project selection resets correctly when project picker is opened --- .../sidebar/hooks/use-project-picker.ts | 22 ++++++++----------- 1 file changed, 9 insertions(+), 13 deletions(-) diff --git a/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts b/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts index c8cf0d23..341921c6 100644 --- a/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts +++ b/apps/ui/src/components/layout/sidebar/hooks/use-project-picker.ts @@ -29,14 +29,16 @@ export function useProjectPicker({ return projects.filter((project) => project.name.toLowerCase().includes(query)); }, [projects, projectSearchQuery]); - const getCurrentProjectIndex = () => { - return currentProject ? filteredProjects.findIndex((p) => p.id === currentProject.id) : -1; - }; - - // Reset selection when filtered results change + // Reset selection when filtered results change and project picker is open useEffect(() => { + if (!isProjectPickerOpen) { + return; + } + if (!projectSearchQuery.trim()) { - const currentIndex = getCurrentProjectIndex(); + const currentIndex = currentProject + ? filteredProjects.findIndex((p) => p.id === currentProject.id) + : -1; if (currentIndex !== -1) { setSelectedProjectIndex(currentIndex); return; @@ -44,7 +46,7 @@ export function useProjectPicker({ } setSelectedProjectIndex(0); - }, [filteredProjects.length, projectSearchQuery, currentProject]); + }, [isProjectPickerOpen, filteredProjects.length, projectSearchQuery, currentProject]); // Reset search query when dropdown closes, set to current project index when it opens useEffect(() => { @@ -52,12 +54,6 @@ export function useProjectPicker({ setProjectSearchQuery(''); setSelectedProjectIndex(0); } else { - // Set the selected project index to the current project index - const currentIndex = getCurrentProjectIndex(); - if (currentIndex !== -1) { - setSelectedProjectIndex(currentIndex); - } - // Focus the search input when dropdown opens // Small delay to ensure the dropdown is rendered setTimeout(() => {