refactor: move Generate All into empty-state button group with subtle separator

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
chihlasm
2026-02-24 01:12:23 -05:00
parent ad85502ca1
commit 3a2470dca3

View File

@@ -51,38 +51,6 @@ export function BranchDetailView() {
return (
<div className="flex flex-col gap-4">
{/* Generate All / Stop control */}
{(() => {
const undetailedCount = selectedBranches.filter((b) => !b.steps).length
if (undetailedCount === 0) return null
return (
<div className="flex items-center justify-between">
<span className="text-xs text-muted-foreground">
{undetailedCount} branch{undetailedCount !== 1 ? 'es' : ''} need detail
</span>
{isGeneratingAll ? (
<button
type="button"
onClick={cancelGenerateAll}
className="flex items-center gap-1.5 rounded-lg border border-red-400/30 bg-red-400/10 px-3 py-1.5 text-xs font-medium text-red-400 hover:bg-red-400/20"
>
<Square className="h-3 w-3" />
Stop
</button>
) : (
<button
type="button"
onClick={generateAllBranchDetails}
disabled={isLoading}
className="flex items-center gap-1.5 rounded-lg bg-gradient-brand px-3 py-1.5 text-xs font-medium text-white shadow-lg shadow-primary/20 hover:opacity-90 disabled:opacity-50"
>
<Zap className="h-3 w-3" />
Generate All
</button>
)}
</div>
)
})()}
{/* Content area */}
<div className="space-y-4">
@@ -143,7 +111,7 @@ export function BranchDetailView() {
<p className="text-sm text-muted-foreground">
Generate AI detail for this branch
</p>
<div className="flex gap-2">
<div className="flex items-center gap-2">
<button
type="button"
onClick={() => handleGenerate(currentBranch.name)}
@@ -168,6 +136,33 @@ export function BranchDetailView() {
<SkipForward className="h-3.5 w-3.5" />
Skip
</button>
{/* Subtle separator + Generate All */}
{selectedBranches.filter((b) => !b.steps).length > 1 && (
<>
<div className="h-6 w-px bg-border" />
{isGeneratingAll ? (
<button
type="button"
onClick={cancelGenerateAll}
className="flex items-center gap-1.5 rounded-lg border border-red-400/30 bg-red-400/10 px-3 py-2 text-sm font-medium text-red-400 hover:bg-red-400/20"
>
<Square className="h-3.5 w-3.5" />
Stop
</button>
) : (
<button
type="button"
onClick={generateAllBranchDetails}
disabled={isLoading}
className="flex items-center gap-1.5 rounded-lg border border-primary/30 bg-primary/10 px-3 py-2 text-sm font-medium text-primary hover:bg-primary/20 disabled:opacity-50"
>
<Zap className="h-3.5 w-3.5" />
Generate All
</button>
)}
</>
)}
</div>
</div>
)}