feat: new workspace screen with sticky search combobox design

- Replace workspace setup dialog with full-screen new workspace route
- Restyle Combobox SearchInput to match CombinedModelSelector Level 2 design:
  borderless sticky search bar above scroll area instead of inline bordered box
- CombinedModelSelector now uses shared SearchInput, removing duplicate ProviderSearchInput
- Fix TooltipTrigger children type to accept render functions (remove PropsWithChildren wrapper)
- Fix empty rightControls View causing gap between dictation and send buttons
- Add branch picker with searchable Combobox and GitBranch icons
- Muted icon buttons (attachment, dictation, voice mode) that brighten on hover

packages/app/src/components/combined-model-selector.tsx

@@ -2,13 +2,11 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import {
   View,
   Text,
-  TextInput,
   Pressable,
   Platform,
   ActivityIndicator,
   type GestureResponderEvent,
 } from "react-native";
-import { BottomSheetTextInput } from "@gorhom/bottom-sheet";
 import { StyleSheet, useUnistyles } from "react-native-unistyles";
 import {
   ArrowLeft,
@@ -24,7 +22,7 @@ import type {
 import type { AgentProviderDefinition } from "@server/server/agent/provider-manifest";
 const IS_WEB = Platform.OS === "web";
 
-import { Combobox, ComboboxItem } from "@/components/ui/combobox";
+import { Combobox, ComboboxItem, SearchInput } from "@/components/ui/combobox";
 import { Tooltip, TooltipTrigger, TooltipContent } from "@/components/ui/tooltip";
 import { getProviderIcon } from "@/components/provider-icons";
 import type { FavoriteModelRow } from "@/hooks/use-form-preferences";
@@ -347,45 +345,6 @@ function GroupedProviderRows({
   );
 }
 
-function ProviderSearchInput({
-  value,
-  onChangeText,
-  autoFocus = false,
-}: {
-  value: string;
-  onChangeText: (text: string) => void;
-  autoFocus?: boolean;
-}) {
-  const { theme } = useUnistyles();
-  const inputRef = useRef<TextInput>(null);
-  const InputComponent = Platform.OS === "web" ? TextInput : BottomSheetTextInput;
-
-  useEffect(() => {
-    if (autoFocus && Platform.OS === "web" && inputRef.current) {
-      const timer = setTimeout(() => {
-        inputRef.current?.focus();
-      }, 50);
-      return () => clearTimeout(timer);
-    }
-  }, [autoFocus]);
-
-  return (
-    <View style={styles.providerSearchContainer}>
-      <Search size={theme.iconSize.md} color={theme.colors.foregroundMuted} />
-      <InputComponent
-        ref={inputRef as any}
-        // @ts-expect-error - outlineStyle is web-only
-        style={[styles.providerSearchInput, Platform.OS === "web" && { outlineStyle: "none" }]}
-        placeholder="Search models..."
-        placeholderTextColor={theme.colors.foregroundMuted}
-        value={value}
-        onChangeText={onChangeText}
-        autoCapitalize="none"
-        autoCorrect={false}
-      />
-    </View>
-  );
-}
 
 function SelectorContent({
   view,
@@ -674,7 +633,8 @@ export function CombinedModelSelector({
                   }}
                 />
               ) : null}
-              <ProviderSearchInput
+              <SearchInput
+                placeholder="Search models..."
                 value={searchQuery}
                 onChangeText={setSearchQuery}
                 autoFocus={Platform.OS === "web"}
@@ -793,9 +753,6 @@ const styles = StyleSheet.create((theme) => ({
     color: theme.colors.foregroundMuted,
   },
   level2Header: {
-    backgroundColor: theme.colors.surface1,
-    borderBottomWidth: 1,
-    borderBottomColor: theme.colors.border,
   },
   backButton: {
     flexDirection: "row",
@@ -853,17 +810,4 @@ const styles = StyleSheet.create((theme) => ({
     color: theme.colors.foregroundMuted,
     fontSize: theme.fontSize.sm,
   },
-  providerSearchContainer: {
-    flexDirection: "row",
-    alignItems: "center",
-    paddingHorizontal: theme.spacing[3],
-    gap: theme.spacing[2],
-    ...(IS_WEB ? {} : { marginHorizontal: theme.spacing[1] }),
-  },
-  providerSearchInput: {
-    flex: 1,
-    paddingVertical: theme.spacing[3],
-    color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
-  },
 }));