fix(ui): handle undefined branch names in autocomplete components

apps/ui/src/components/ui/autocomplete.tsx

@@ -87,9 +87,11 @@ export function Autocomplete({
 
   // Filter options based on input
   const filteredOptions = React.useMemo(() => {
-    if (!inputValue) return normalizedOptions;
+    // Filter out options with undefined/null values
+    const validOptions = normalizedOptions.filter((opt) => opt.value != null);
+    if (!inputValue) return validOptions;
     const lower = inputValue.toLowerCase();
-    return normalizedOptions.filter(
+    return validOptions.filter(
       (opt) => opt.value.toLowerCase().includes(lower) || opt.label?.toLowerCase().includes(lower)
     );
   }, [normalizedOptions, inputValue]);
@@ -98,7 +100,7 @@ export function Autocomplete({
   const isNewValue =
     allowCreate &&
     inputValue.trim() &&
-    !normalizedOptions.some((opt) => opt.value.toLowerCase() === inputValue.toLowerCase());
+    !normalizedOptions.some((opt) => opt.value?.toLowerCase() === inputValue.toLowerCase());
 
   // Get display value
   const displayValue = React.useMemo(() => {
@@ -184,7 +186,7 @@ export function Autocomplete({
                     setInputValue('');
                     setOpen(false);
                   }}
-                  data-testid={`${itemTestIdPrefix}-${option.value.toLowerCase().replace(/[\s/\\]+/g, '-')}`}
+                  data-testid={`${itemTestIdPrefix}-${(option.value ?? '').toLowerCase().replace(/[\s/\\]+/g, '-')}`}
                 >
                   {Icon && <Icon className="w-4 h-4 mr-2" />}
                   {option.label}

apps/ui/src/components/ui/branch-autocomplete.tsx

@@ -27,7 +27,9 @@ export function BranchAutocomplete({
 }: BranchAutocompleteProps) {
   // Always include "main" at the top of suggestions
   const branchOptions: AutocompleteOption[] = React.useMemo(() => {
-    const branchSet = new Set(['main', ...branches]);
+    // Filter out undefined/null branches
+    const validBranches = branches.filter((b): b is string => b != null && b !== '');
+    const branchSet = new Set(['main', ...validBranches]);
     return Array.from(branchSet).map((branch) => {
       const cardCount = branchCardCounts?.[branch];
       // Show card count if available, otherwise show "default" for main branch only

apps/ui/src/components/views/board-view.tsx

@@ -349,7 +349,7 @@ export function BoardView() {
         const result = await api.worktree.listBranches(currentProject.path);
         if (result.success && result.result?.branches) {
           const localBranches = result.result.branches
-            .filter((b) => !b.isRemote)
+            .filter((b) => !b.isRemote && b.name)
             .map((b) => b.name);
           setBranchSuggestions(localBranches);
         }

apps/ui/src/components/views/board-view/dialogs/create-pr-dialog.tsx

@@ -67,7 +67,10 @@ export function CreatePRDialog({
   // Filter out current worktree branch from the list
   const branches = useMemo(() => {
     if (!branchesData?.branches) return [];
-    return branchesData.branches.map((b) => b.name).filter((name) => name !== worktree?.branch);
+    return branchesData.branches
+      .filter((b) => b.name)
+      .map((b) => b.name)
+      .filter((name) => name !== worktree?.branch);
   }, [branchesData?.branches, worktree?.branch]);
 
   // Common state reset function to avoid duplication

apps/ui/src/components/views/board-view/dialogs/merge-worktree-dialog.tsx

@@ -56,7 +56,7 @@ export function MergeWorktreeDialog({
             if (result.success && result.result?.branches) {
               // Filter out the source branch (can't merge into itself) and remote branches
               const branches = result.result.branches
-                .filter((b: BranchInfo) => !b.isRemote && b.name !== worktree.branch)
+                .filter((b: BranchInfo) => !b.isRemote && b.name && b.name !== worktree.branch)
                 .map((b: BranchInfo) => b.name);
               setAvailableBranches(branches);
             }

apps/ui/src/components/views/graph-view-page.tsx

@@ -134,7 +134,7 @@ export function GraphViewPage() {
         const result = await api.worktree.listBranches(currentProject.path);
         if (result.success && result.result?.branches) {
           const localBranches = result.result.branches
-            .filter((b) => !b.isRemote)
+            .filter((b) => !b.isRemote && b.name)
             .map((b) => b.name);
           setBranchSuggestions(localBranches);
         }