feat: add managed git worktrees (#6674)

packages/app/src/components/session/session-new-view.tsx

@@ -1,12 +1,41 @@
-import { Show } from "solid-js"
+import { Show, createMemo } from "solid-js"
 import { DateTime } from "luxon"
 import { useSync } from "@/context/sync"
 import { Icon } from "@opencode-ai/ui/icon"
 import { getDirectory, getFilename } from "@opencode-ai/util/path"
+import { Select } from "@opencode-ai/ui/select"
 
-export function NewSessionView() {
+const MAIN_WORKTREE = "main"
+const CREATE_WORKTREE = "create"
+
+interface NewSessionViewProps {
+  worktree: string
+  onWorktreeChange: (value: string) => void
+}
+
+export function NewSessionView(props: NewSessionViewProps) {
   const sync = useSync()
 
+  const sandboxes = createMemo(() => sync.project?.sandboxes ?? [])
+  const options = createMemo(() => [MAIN_WORKTREE, ...sandboxes(), CREATE_WORKTREE])
+  const current = createMemo(() => {
+    const selection = props.worktree
+    if (options().includes(selection)) return selection
+    return MAIN_WORKTREE
+  })
+
+  const label = (value: string) => {
+    if (value === MAIN_WORKTREE) {
+      const branch = sync.data.vcs?.branch
+      if (branch) return `Current branch (${branch})`
+      return "Main branch"
+    }
+
+    if (value === CREATE_WORKTREE) return "Create new worktree"
+
+    return getFilename(value)
+  }
+
   return (
     <div class="size-full flex flex-col pb-45 justify-end items-start gap-4 flex-[1_0_0] self-stretch max-w-200 mx-auto px-6">
       <div class="text-20-medium text-text-weaker">New session</div>
@@ -17,6 +46,21 @@ export function NewSessionView() {
           <span class="text-text-strong">{getFilename(sync.data.path.directory)}</span>
         </div>
       </div>
+      <div class="flex justify-center items-center gap-1">
+        <Icon name="branch" size="small" />
+        <Select
+          options={options()}
+          current={current()}
+          value={(x) => x}
+          label={label}
+          onSelect={(value) => {
+            props.onWorktreeChange(value ?? MAIN_WORKTREE)
+          }}
+          size="normal"
+          variant="ghost"
+          class="text-12-medium"
+        />
+      </div>
       <Show when={sync.project}>
         {(project) => (
           <div class="flex justify-center items-center gap-3">