Use generic branchselector in PR dialog (#680)

frontend/src/components/dialogs/tasks/CreatePRDialog.tsx

@@ -10,17 +10,12 @@ import { Label } from '@radix-ui/react-label';
 import { Textarea } from '@/components/ui/textarea.tsx';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
-import {
+import BranchSelector from '@/components/tasks/BranchSelector';
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from '@/components/ui/select';
 import { useCallback, useEffect, useState } from 'react';
 import { attemptsApi } from '@/lib/api.ts';
 
 import {
+  GitBranch,
   GitHubServiceError,
   TaskAttempt,
   TaskWithAttemptStatus,
@@ -37,9 +32,7 @@ const CreatePrDialog = NiceModal.create(() => {
   const [prBaseBranch, setPrBaseBranch] = useState('');
   const [creatingPR, setCreatingPR] = useState(false);
   const [error, setError] = useState<string | null>(null);
-  const [branches, setBranches] = useState<
+  const [branches, setBranches] = useState<GitBranch[]>([]);
-    Array<{ name: string; is_current: boolean; is_remote: boolean }>
-  >([]);
   const [branchesLoading, setBranchesLoading] = useState(false);
 
   useEffect(() => {
@@ -161,29 +154,17 @@ const CreatePrDialog = NiceModal.create(() => {
             </div>
             <div className="space-y-2">
               <Label htmlFor="pr-base">Base Branch</Label>
-              <Select
+              <BranchSelector
-                value={prBaseBranch}
+                branches={branches}
-                onValueChange={setPrBaseBranch}
+                selectedBranch={prBaseBranch}
-                disabled={branchesLoading}
+                onBranchSelect={setPrBaseBranch}
-              >
+                placeholder={
-                <SelectTrigger>
+                  branchesLoading ? 'Loading branches...' : 'Select base branch'
-                  <SelectValue
+                }
-                    placeholder={
+                className={
-                      branchesLoading
+                  branchesLoading ? 'opacity-50 cursor-not-allowed' : ''
-                        ? 'Loading branches...'
+                }
-                        : 'Select base branch'
+              />
-                    }
-                  />
-                </SelectTrigger>
-                <SelectContent>
-                  {branches.map((branch) => (
-                    <SelectItem key={branch.name} value={branch.name}>
-                      {branch.name}
-                      {branch.is_current && ' (current)'}
-                    </SelectItem>
-                  ))}
-                </SelectContent>
-              </Select>
             </div>
             {error && (
               <div className="text-sm text-destructive bg-red-50 p-2 rounded">