ros/automaker
1
0
Fork 0
mirror of https://github.com/AutoMaker-Org/automaker.git synced 2026-02-02 08:33:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/v0.14.0rc' into feature/v0.14.0rc-1768981415660-tt2v

Browse Source 
# Conflicts:
#	apps/ui/src/components/views/project-settings-view/config/navigation.ts
#	apps/ui/src/components/views/project-settings-view/hooks/use-project-settings-view.ts
This commit is contained in:
Shirone
2026-01-21 17:46:22 +01:00
parent 662f854203 f2860d9366
commit a45ee59b7d
61 changed files with 4752 additions and 213 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
apps/ui/src/components/views/board-view/components/kanban-card/card-badges.tsx
View File

@@ -3,9 +3,10 @@ import { memo, useEffect, useMemo, useState } from 'react';
import { Feature, useAppStore } from '@/store/app-store';
import { cn } from '@/lib/utils';
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
import { AlertCircle, Lock, Hand, Sparkles } from 'lucide-react';
import { AlertCircle, Lock, Hand, Sparkles, SkipForward } from 'lucide-react';
import { getBlockingDependencies } from '@automaker/dependency-resolver';
import { useShallow } from 'zustand/react/shallow';
import { usePipelineConfig } from '@/hooks/queries/use-pipeline';
/** Uniform badge style for all card badges */
const uniformBadgeClass =
@@ -51,9 +52,13 @@ export const CardBadges = memo(function CardBadges({ feature }: CardBadgesProps)
interface PriorityBadgesProps {
feature: Feature;
projectPath?: string;
}
export const PriorityBadges = memo(function PriorityBadges({ feature }: PriorityBadgesProps) {
export const PriorityBadges = memo(function PriorityBadges({
feature,
projectPath,
}: PriorityBadgesProps) {
const { enableDependencyBlocking, features } = useAppStore(
useShallow((state) => ({
enableDependencyBlocking: state.enableDependencyBlocking,
@@ -62,6 +67,9 @@ export const PriorityBadges = memo(function PriorityBadges({ feature }: Priority
);
const [currentTime, setCurrentTime] = useState(() => Date.now());
// Fetch pipeline config to check if there are pipelines to exclude
const { data: pipelineConfig } = usePipelineConfig(projectPath);
// Calculate blocking dependencies (if feature is in backlog and has incomplete dependencies)
const blockingDependencies = useMemo(() => {
if (!enableDependencyBlocking || feature.status !== 'backlog') {
@@ -108,7 +116,19 @@ export const PriorityBadges = memo(function PriorityBadges({ feature }: Priority
const showManualVerification =
feature.skipTests && !feature.error && feature.status === 'backlog';
const showBadges = feature.priority || showManualVerification || isBlocked || isJustFinished;
// Check if feature has excluded pipeline steps
const excludedStepCount = feature.excludedPipelineSteps?.length || 0;
const totalPipelineSteps = pipelineConfig?.steps?.length || 0;
const hasPipelineExclusions =
excludedStepCount > 0 && totalPipelineSteps > 0 && feature.status === 'backlog';
const allPipelinesExcluded = hasPipelineExclusions && excludedStepCount >= totalPipelineSteps;
const showBadges =
feature.priority ||
showManualVerification ||
isBlocked ||
isJustFinished ||
hasPipelineExclusions;
if (!showBadges) {
return null;
@@ -227,6 +247,39 @@ export const PriorityBadges = memo(function PriorityBadges({ feature }: Priority
</Tooltip>
</TooltipProvider>
)}
{/* Pipeline exclusion badge */}
{hasPipelineExclusions && (
<TooltipProvider delayDuration={200}>
<Tooltip>
<TooltipTrigger asChild>
<div
className={cn(
uniformBadgeClass,
allPipelinesExcluded
? 'bg-violet-500/20 border-violet-500/50 text-violet-500'
: 'bg-violet-500/10 border-violet-500/30 text-violet-400'
)}
data-testid={`pipeline-exclusion-badge-${feature.id}`}
>
<SkipForward className="w-3.5 h-3.5" />
</div>
</TooltipTrigger>
<TooltipContent side="bottom" className="text-xs max-w-[250px]">
<p className="font-medium mb-1">
{allPipelinesExcluded
? 'All pipelines skipped'
: `${excludedStepCount} of ${totalPipelineSteps} pipeline${totalPipelineSteps !== 1 ? 's' : ''} skipped`}
</p>
<p className="text-muted-foreground">
{allPipelinesExcluded
? 'This feature will skip all custom pipeline steps'
: 'Some custom pipeline steps will be skipped for this feature'}
</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
)}
</div>
);
});

2
apps/ui/src/components/views/board-view/components/kanban-card/kanban-card.tsx
View File

@@ -236,7 +236,7 @@ export const KanbanCard = memo(function KanbanCard({
</div>
{/* Priority and Manual Verification badges */}
<PriorityBadges feature={feature} />
<PriorityBadges feature={feature} projectPath={currentProject?.path} />
{/* Card Header */}
<CardHeaderSection

43
apps/ui/src/components/views/board-view/dialogs/add-feature-dialog.tsx
View File

@@ -45,6 +45,7 @@ import {
AncestorContextSection,
EnhanceWithAI,
EnhancementHistoryButton,
PipelineExclusionControls,
type BaseHistoryEntry,
} from '../shared';
import type { WorkMode } from '../shared';
@@ -101,6 +102,7 @@ type FeatureData = {
requirePlanApproval: boolean;
dependencies?: string[];
childDependencies?: string[]; // Feature IDs that should depend on this feature
excludedPipelineSteps?: string[]; // Pipeline step IDs to skip for this feature
workMode: WorkMode;
};
@@ -118,6 +120,10 @@ interface AddFeatureDialogProps {
isMaximized: boolean;
parentFeature?: Feature | null;
allFeatures?: Feature[];
/**
* Path to the current project for loading pipeline config.
*/
projectPath?: string;
/**
* When a non-main worktree is selected in the board header, this will be set to that worktree's branch.
* When set, the dialog will default to 'custom' work mode with this branch pre-filled.
@@ -151,6 +157,7 @@ export function AddFeatureDialog({
isMaximized,
parentFeature = null,
allFeatures = [],
projectPath,
selectedNonMainWorktreeBranch,
forceCurrentBranchMode,
}: AddFeatureDialogProps) {
@@ -194,9 +201,20 @@ export function AddFeatureDialog({
const [parentDependencies, setParentDependencies] = useState<string[]>([]);
const [childDependencies, setChildDependencies] = useState<string[]>([]);
// Pipeline exclusion state
const [excludedPipelineSteps, setExcludedPipelineSteps] = useState<string[]>([]);
// Get defaults from store
const { defaultPlanningMode, defaultRequirePlanApproval, useWorktrees, defaultFeatureModel } =
useAppStore();
const {
defaultPlanningMode,
defaultRequirePlanApproval,
useWorktrees,
defaultFeatureModel,
currentProject,
} = useAppStore();
// Use project-level default feature model if set, otherwise fall back to global
const effectiveDefaultFeatureModel = currentProject?.defaultFeatureModel ?? defaultFeatureModel;
// Track previous open state to detect when dialog opens
const wasOpenRef = useRef(false);
@@ -216,7 +234,7 @@ export function AddFeatureDialog({
);
setPlanningMode(defaultPlanningMode);
setRequirePlanApproval(defaultRequirePlanApproval);
setModelEntry(defaultFeatureModel);
setModelEntry(effectiveDefaultFeatureModel);
// Initialize description history (empty for new feature)
setDescriptionHistory([]);
@@ -234,6 +252,9 @@ export function AddFeatureDialog({
// Reset dependency selections
setParentDependencies([]);
setChildDependencies([]);
// Reset pipeline exclusions (all pipelines enabled by default)
setExcludedPipelineSteps([]);
}
}, [
open,
@@ -241,7 +262,7 @@ export function AddFeatureDialog({
defaultBranch,
defaultPlanningMode,
defaultRequirePlanApproval,
defaultFeatureModel,
effectiveDefaultFeatureModel,
useWorktrees,
selectedNonMainWorktreeBranch,
forceCurrentBranchMode,
@@ -328,6 +349,7 @@ export function AddFeatureDialog({
requirePlanApproval,
dependencies: finalDependencies,
childDependencies: childDependencies.length > 0 ? childDependencies : undefined,
excludedPipelineSteps: excludedPipelineSteps.length > 0 ? excludedPipelineSteps : undefined,
workMode,
};
};
@@ -343,7 +365,7 @@ export function AddFeatureDialog({
// When a non-main worktree is selected, use its branch name for custom mode
setBranchName(selectedNonMainWorktreeBranch || '');
setPriority(2);
setModelEntry(defaultFeatureModel);
setModelEntry(effectiveDefaultFeatureModel);
setWorkMode(
getDefaultWorkMode(useWorktrees, selectedNonMainWorktreeBranch, forceCurrentBranchMode)
);
@@ -354,6 +376,7 @@ export function AddFeatureDialog({
setDescriptionHistory([]);
setParentDependencies([]);
setChildDependencies([]);
setExcludedPipelineSteps([]);
onOpenChange(false);
};
@@ -696,6 +719,16 @@ export function AddFeatureDialog({
</div>
</div>
)}
{/* Pipeline Exclusion Controls */}
<div className="pt-2">
<PipelineExclusionControls
projectPath={projectPath}
excludedPipelineSteps={excludedPipelineSteps}
onExcludedStepsChange={setExcludedPipelineSteps}
testIdPrefix="add-feature-pipeline"
/>
</div>
</div>
</div>

23
apps/ui/src/components/views/board-view/dialogs/edit-feature-dialog.tsx
View File

@@ -36,6 +36,7 @@ import {
PlanningModeSelect,
EnhanceWithAI,
EnhancementHistoryButton,
PipelineExclusionControls,
type EnhancementMode,
} from '../shared';
import type { WorkMode } from '../shared';
@@ -67,6 +68,7 @@ interface EditFeatureDialogProps {
requirePlanApproval: boolean;
dependencies?: string[];
childDependencies?: string[]; // Feature IDs that should depend on this feature
excludedPipelineSteps?: string[]; // Pipeline step IDs to skip for this feature
},
descriptionHistorySource?: 'enhance' | 'edit',
enhancementMode?: EnhancementMode,
@@ -78,6 +80,7 @@ interface EditFeatureDialogProps {
currentBranch?: string;
isMaximized: boolean;
allFeatures: Feature[];
projectPath?: string;
}
export function EditFeatureDialog({
@@ -90,6 +93,7 @@ export function EditFeatureDialog({
currentBranch,
isMaximized,
allFeatures,
projectPath,
}: EditFeatureDialogProps) {
const navigate = useNavigate();
const [editingFeature, setEditingFeature] = useState<Feature | null>(feature);
@@ -146,6 +150,11 @@ export function EditFeatureDialog({
return allFeatures.filter((f) => f.dependencies?.includes(feature.id)).map((f) => f.id);
});
// Pipeline exclusion state
const [excludedPipelineSteps, setExcludedPipelineSteps] = useState<string[]>(
feature?.excludedPipelineSteps ?? []
);
useEffect(() => {
setEditingFeature(feature);
if (feature) {
@@ -171,6 +180,8 @@ export function EditFeatureDialog({
.map((f) => f.id);
setChildDependencies(childDeps);
setOriginalChildDependencies(childDeps);
// Reset pipeline exclusion state
setExcludedPipelineSteps(feature.excludedPipelineSteps ?? []);
} else {
setEditFeaturePreviewMap(new Map());
setDescriptionChangeSource(null);
@@ -179,6 +190,7 @@ export function EditFeatureDialog({
setParentDependencies([]);
setChildDependencies([]);
setOriginalChildDependencies([]);
setExcludedPipelineSteps([]);
}
}, [feature, allFeatures]);
@@ -232,6 +244,7 @@ export function EditFeatureDialog({
workMode,
dependencies: parentDependencies,
childDependencies: childDepsChanged ? childDependencies : undefined,
excludedPipelineSteps: excludedPipelineSteps.length > 0 ? excludedPipelineSteps : undefined,
};
// Determine if description changed and what source to use
@@ -618,6 +631,16 @@ export function EditFeatureDialog({
</div>
</div>
)}
{/* Pipeline Exclusion Controls */}
<div className="pt-2">
<PipelineExclusionControls
projectPath={projectPath}
excludedPipelineSteps={excludedPipelineSteps}
onExcludedStepsChange={setExcludedPipelineSteps}
testIdPrefix="edit-feature-pipeline"
/>
</div>
</div>
</div>

47
apps/ui/src/components/views/board-view/dialogs/mass-edit-dialog.tsx
View File

@@ -13,7 +13,13 @@ import { Label } from '@/components/ui/label';
import { AlertCircle } from 'lucide-react';
import { modelSupportsThinking } from '@/lib/utils';
import { Feature, ModelAlias, ThinkingLevel, PlanningMode } from '@/store/app-store';
import { TestingTabContent, PrioritySelect, PlanningModeSelect, WorkModeSelector } from '../shared';
import {
TestingTabContent,
PrioritySelect,
PlanningModeSelect,
WorkModeSelector,
PipelineExclusionControls,
} from '../shared';
import type { WorkMode } from '../shared';
import { PhaseModelSelector } from '@/components/views/settings-view/model-defaults/phase-model-selector';
import { isCursorModel, isClaudeModel, type PhaseModelEntry } from '@automaker/types';
@@ -28,6 +34,7 @@ interface MassEditDialogProps {
branchSuggestions: string[];
branchCardCounts?: Record<string, number>;
currentBranch?: string;
projectPath?: string;
}
interface ApplyState {
@@ -38,11 +45,13 @@ interface ApplyState {
priority: boolean;
skipTests: boolean;
branchName: boolean;
excludedPipelineSteps: boolean;
}
function getMixedValues(features: Feature[]): Record<string, boolean> {
if (features.length === 0) return {};
const first = features[0];
const firstExcludedSteps = JSON.stringify(first.excludedPipelineSteps || []);
return {
model: !features.every((f) => f.model === first.model),
thinkingLevel: !features.every((f) => f.thinkingLevel === first.thinkingLevel),
@@ -53,6 +62,9 @@ function getMixedValues(features: Feature[]): Record<string, boolean> {
priority: !features.every((f) => f.priority === first.priority),
skipTests: !features.every((f) => f.skipTests === first.skipTests),
branchName: !features.every((f) => f.branchName === first.branchName),
excludedPipelineSteps: !features.every(
(f) => JSON.stringify(f.excludedPipelineSteps || []) === firstExcludedSteps
),
};
}
@@ -111,6 +123,7 @@ export function MassEditDialog({
branchSuggestions,
branchCardCounts,
currentBranch,
projectPath,
}: MassEditDialogProps) {
const [isApplying, setIsApplying] = useState(false);
@@ -123,6 +136,7 @@ export function MassEditDialog({
priority: false,
skipTests: false,
branchName: false,
excludedPipelineSteps: false,
});
// Field values
@@ -146,6 +160,11 @@ export function MassEditDialog({
return getInitialValue(selectedFeatures, 'branchName', '') as string;
});
// Pipeline exclusion state
const [excludedPipelineSteps, setExcludedPipelineSteps] = useState<string[]>(() => {
return getInitialValue(selectedFeatures, 'excludedPipelineSteps', []) as string[];
});
// Calculate mixed values
const mixedValues = useMemo(() => getMixedValues(selectedFeatures), [selectedFeatures]);
@@ -160,6 +179,7 @@ export function MassEditDialog({
priority: false,
skipTests: false,
branchName: false,
excludedPipelineSteps: false,
});
setModel(getInitialValue(selectedFeatures, 'model', 'claude-sonnet') as ModelAlias);
setThinkingLevel(getInitialValue(selectedFeatures, 'thinkingLevel', 'none') as ThinkingLevel);
@@ -172,6 +192,10 @@ export function MassEditDialog({
const initialBranchName = getInitialValue(selectedFeatures, 'branchName', '') as string;
setBranchName(initialBranchName);
setWorkMode(initialBranchName ? 'custom' : 'current');
// Reset pipeline exclusions
setExcludedPipelineSteps(
getInitialValue(selectedFeatures, 'excludedPipelineSteps', []) as string[]
);
}
}, [open, selectedFeatures]);
@@ -190,6 +214,10 @@ export function MassEditDialog({
// For 'custom' mode, use the specified branch name
updates.branchName = workMode === 'custom' ? branchName : '';
}
if (applyState.excludedPipelineSteps) {
updates.excludedPipelineSteps =
excludedPipelineSteps.length > 0 ? excludedPipelineSteps : undefined;
}
if (Object.keys(updates).length === 0) {
onClose();
@@ -353,6 +381,23 @@ export function MassEditDialog({
testIdPrefix="mass-edit-work-mode"
/>
</FieldWrapper>
{/* Pipeline Exclusion */}
<FieldWrapper
label="Pipeline Steps"
isMixed={mixedValues.excludedPipelineSteps}
willApply={applyState.excludedPipelineSteps}
onApplyChange={(apply) =>
setApplyState((prev) => ({ ...prev, excludedPipelineSteps: apply }))
}
>
<PipelineExclusionControls
projectPath={projectPath}
excludedPipelineSteps={excludedPipelineSteps}
onExcludedStepsChange={setExcludedPipelineSteps}
testIdPrefix="mass-edit-pipeline"
/>
</FieldWrapper>
</div>
<DialogFooter>

1
apps/ui/src/components/views/board-view/shared/index.ts
View File

@@ -11,3 +11,4 @@ export * from './planning-mode-select';
export * from './ancestor-context-section';
export * from './work-mode-selector';
export * from './enhancement';
export * from './pipeline-exclusion-controls';

113
apps/ui/src/components/views/board-view/shared/pipeline-exclusion-controls.tsx Normal file
View File

@@ -0,0 +1,113 @@
import { Label } from '@/components/ui/label';
import { Switch } from '@/components/ui/switch';
import { GitBranch, Workflow } from 'lucide-react';
import { usePipelineConfig } from '@/hooks/queries/use-pipeline';
import { cn } from '@/lib/utils';
interface PipelineExclusionControlsProps {
projectPath: string | undefined;
excludedPipelineSteps: string[];
onExcludedStepsChange: (excludedSteps: string[]) => void;
testIdPrefix?: string;
disabled?: boolean;
}
/**
* Component for selecting which custom pipeline steps should be excluded for a feature.
* Each pipeline step is shown as a toggleable switch, defaulting to enabled (included).
* Disabling a step adds it to the exclusion list.
*/
export function PipelineExclusionControls({
projectPath,
excludedPipelineSteps,
onExcludedStepsChange,
testIdPrefix = 'pipeline-exclusion',
disabled = false,
}: PipelineExclusionControlsProps) {
const { data: pipelineConfig, isLoading } = usePipelineConfig(projectPath);
// Sort steps by order
const sortedSteps = [...(pipelineConfig?.steps || [])].sort((a, b) => a.order - b.order);
// If no pipeline steps exist or loading, don't render anything
if (isLoading || sortedSteps.length === 0) {
return null;
}
const toggleStep = (stepId: string) => {
const isCurrentlyExcluded = excludedPipelineSteps.includes(stepId);
if (isCurrentlyExcluded) {
// Remove from exclusions (enable the step)
onExcludedStepsChange(excludedPipelineSteps.filter((id) => id !== stepId));
} else {
// Add to exclusions (disable the step)
onExcludedStepsChange([...excludedPipelineSteps, stepId]);
}
};
const allExcluded = sortedSteps.every((step) => excludedPipelineSteps.includes(step.id));
return (
<div className="space-y-3">
<div className="flex items-center gap-2">
<Workflow className="w-4 h-4 text-muted-foreground" />
<Label className="text-sm font-medium">Custom Pipeline Steps</Label>
</div>
<div className="space-y-2">
{sortedSteps.map((step) => {
const isIncluded = !excludedPipelineSteps.includes(step.id);
return (
<div
key={step.id}
className={cn(
'flex items-center justify-between gap-3 px-3 py-2 rounded-md border',
isIncluded
? 'border-border/50 bg-muted/30'
: 'border-border/30 bg-muted/10 opacity-60'
)}
>
<div className="flex items-center gap-2 min-w-0 flex-1">
<div
className={cn(
'w-2 h-2 rounded-full flex-shrink-0',
step.colorClass || 'bg-gray-400'
)}
style={{
backgroundColor: step.colorClass?.startsWith('#') ? step.colorClass : undefined,
}}
/>
<span
className={cn(
'text-sm truncate',
isIncluded ? 'text-foreground' : 'text-muted-foreground'
)}
>
{step.name}
</span>
</div>
<Switch
checked={isIncluded}
onCheckedChange={() => toggleStep(step.id)}
disabled={disabled}
data-testid={`${testIdPrefix}-step-${step.id}`}
aria-label={`${isIncluded ? 'Disable' : 'Enable'} ${step.name} pipeline step`}
/>
</div>
);
})}
</div>
{allExcluded && (
<p className="text-xs text-muted-foreground flex items-center gap-1.5">
<GitBranch className="w-3.5 h-3.5" />
All pipeline steps disabled. Feature will skip directly to verification.
</p>
)}
<p className="text-xs text-muted-foreground">
Enabled steps will run after implementation. Disable steps to skip them for this feature.
</p>
</div>
);
}

83
apps/ui/src/components/views/board-view/worktree-panel/components/worktree-actions-dropdown.tsx
View File

@@ -33,10 +33,11 @@ import {
SplitSquareHorizontal,
Undo2,
Zap,
FlaskConical,
} from 'lucide-react';
import { toast } from 'sonner';
import { cn } from '@/lib/utils';
import type { WorktreeInfo, DevServerInfo, PRInfo, GitRepoStatus } from '../types';
import type { WorktreeInfo, DevServerInfo, PRInfo, GitRepoStatus, TestSessionInfo } from '../types';
import { TooltipWrapper } from './tooltip-wrapper';
import { useAvailableEditors, useEffectiveDefaultEditor } from '../hooks/use-available-editors';
import {
@@ -63,6 +64,14 @@ interface WorktreeActionsDropdownProps {
standalone?: boolean;
/** Whether auto mode is running for this worktree */
isAutoModeRunning?: boolean;
/** Whether a test command is configured in project settings */
hasTestCommand?: boolean;
/** Whether tests are being started for this worktree */
isStartingTests?: boolean;
/** Whether tests are currently running for this worktree */
isTestRunning?: boolean;
/** Active test session info for this worktree */
testSessionInfo?: TestSessionInfo;
onOpenChange: (open: boolean) => void;
onPull: (worktree: WorktreeInfo) => void;
onPush: (worktree: WorktreeInfo) => void;
@@ -84,6 +93,12 @@ interface WorktreeActionsDropdownProps {
onRunInitScript: (worktree: WorktreeInfo) => void;
onToggleAutoMode?: (worktree: WorktreeInfo) => void;
onMerge: (worktree: WorktreeInfo) => void;
/** Start running tests for this worktree */
onStartTests?: (worktree: WorktreeInfo) => void;
/** Stop running tests for this worktree */
onStopTests?: (worktree: WorktreeInfo) => void;
/** View test logs for this worktree */
onViewTestLogs?: (worktree: WorktreeInfo) => void;
hasInitScript: boolean;
}
@@ -101,6 +116,10 @@ export function WorktreeActionsDropdown({
gitRepoStatus,
standalone = false,
isAutoModeRunning = false,
hasTestCommand = false,
isStartingTests = false,
isTestRunning = false,
testSessionInfo,
onOpenChange,
onPull,
onPush,
@@ -122,6 +141,9 @@ export function WorktreeActionsDropdown({
onRunInitScript,
onToggleAutoMode,
onMerge,
onStartTests,
onStopTests,
onViewTestLogs,
hasInitScript,
}: WorktreeActionsDropdownProps) {
// Get available editors for the "Open In" submenu
@@ -231,6 +253,65 @@ export function WorktreeActionsDropdown({
<DropdownMenuSeparator />
</>
)}
{/* Test Runner section - only show when test command is configured */}
{hasTestCommand && onStartTests && (
<>
{isTestRunning ? (
<>
<DropdownMenuLabel className="text-xs flex items-center gap-2">
<span className="w-2 h-2 rounded-full bg-blue-500 animate-pulse" />
Tests Running
</DropdownMenuLabel>
{onViewTestLogs && (
<DropdownMenuItem onClick={() => onViewTestLogs(worktree)} className="text-xs">
<ScrollText className="w-3.5 h-3.5 mr-2" />
View Test Logs
</DropdownMenuItem>
)}
{onStopTests && (
<DropdownMenuItem
onClick={() => onStopTests(worktree)}
className="text-xs text-destructive focus:text-destructive"
>
<Square className="w-3.5 h-3.5 mr-2" />
Stop Tests
</DropdownMenuItem>
)}
<DropdownMenuSeparator />
</>
) : (
<>
<DropdownMenuItem
onClick={() => onStartTests(worktree)}
disabled={isStartingTests}
className="text-xs"
>
<FlaskConical
className={cn('w-3.5 h-3.5 mr-2', isStartingTests && 'animate-pulse')}
/>
{isStartingTests ? 'Starting Tests...' : 'Run Tests'}
</DropdownMenuItem>
{onViewTestLogs && testSessionInfo && (
<DropdownMenuItem onClick={() => onViewTestLogs(worktree)} className="text-xs">
<ScrollText className="w-3.5 h-3.5 mr-2" />
View Last Test Results
{testSessionInfo.status === 'passed' && (
<span className="ml-auto text-[10px] bg-green-500/20 text-green-600 px-1.5 py-0.5 rounded">
passed
</span>
)}
{testSessionInfo.status === 'failed' && (
<span className="ml-auto text-[10px] bg-red-500/20 text-red-600 px-1.5 py-0.5 rounded">
failed
</span>
)}
</DropdownMenuItem>
)}
<DropdownMenuSeparator />
</>
)}
</>
)}
{/* Auto Mode toggle */}
{onToggleAutoMode && (
<>

37
apps/ui/src/components/views/board-view/worktree-panel/components/worktree-tab.tsx
View File

@@ -5,7 +5,14 @@ import { Spinner } from '@/components/ui/spinner';
import { cn } from '@/lib/utils';
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
import { useDroppable } from '@dnd-kit/core';
import type { WorktreeInfo, BranchInfo, DevServerInfo, PRInfo, GitRepoStatus } from '../types';
import type {
WorktreeInfo,
BranchInfo,
DevServerInfo,
PRInfo,
GitRepoStatus,
TestSessionInfo,
} from '../types';
import { BranchSwitchDropdown } from './branch-switch-dropdown';
import { WorktreeActionsDropdown } from './worktree-actions-dropdown';
@@ -33,6 +40,12 @@ interface WorktreeTabProps {
gitRepoStatus: GitRepoStatus;
/** Whether auto mode is running for this worktree */
isAutoModeRunning?: boolean;
/** Whether tests are being started for this worktree */
isStartingTests?: boolean;
/** Whether tests are currently running for this worktree */
isTestRunning?: boolean;
/** Active test session info for this worktree */
testSessionInfo?: TestSessionInfo;
onSelectWorktree: (worktree: WorktreeInfo) => void;
onBranchDropdownOpenChange: (open: boolean) => void;
onActionsDropdownOpenChange: (open: boolean) => void;
@@ -59,7 +72,15 @@ interface WorktreeTabProps {
onViewDevServerLogs: (worktree: WorktreeInfo) => void;
onRunInitScript: (worktree: WorktreeInfo) => void;
onToggleAutoMode?: (worktree: WorktreeInfo) => void;
/** Start running tests for this worktree */
onStartTests?: (worktree: WorktreeInfo) => void;
/** Stop running tests for this worktree */
onStopTests?: (worktree: WorktreeInfo) => void;
/** View test logs for this worktree */
onViewTestLogs?: (worktree: WorktreeInfo) => void;
hasInitScript: boolean;
/** Whether a test command is configured in project settings */
hasTestCommand?: boolean;
}
export function WorktreeTab({
@@ -85,6 +106,9 @@ export function WorktreeTab({
hasRemoteBranch,
gitRepoStatus,
isAutoModeRunning = false,
isStartingTests = false,
isTestRunning = false,
testSessionInfo,
onSelectWorktree,
onBranchDropdownOpenChange,
onActionsDropdownOpenChange,
@@ -111,7 +135,11 @@ export function WorktreeTab({
onViewDevServerLogs,
onRunInitScript,
onToggleAutoMode,
onStartTests,
onStopTests,
onViewTestLogs,
hasInitScript,
hasTestCommand = false,
}: WorktreeTabProps) {
// Make the worktree tab a drop target for feature cards
const { setNodeRef, isOver } = useDroppable({
@@ -395,6 +423,10 @@ export function WorktreeTab({
devServerInfo={devServerInfo}
gitRepoStatus={gitRepoStatus}
isAutoModeRunning={isAutoModeRunning}
hasTestCommand={hasTestCommand}
isStartingTests={isStartingTests}
isTestRunning={isTestRunning}
testSessionInfo={testSessionInfo}
onOpenChange={onActionsDropdownOpenChange}
onPull={onPull}
onPush={onPush}
@@ -416,6 +448,9 @@ export function WorktreeTab({
onViewDevServerLogs={onViewDevServerLogs}
onRunInitScript={onRunInitScript}
onToggleAutoMode={onToggleAutoMode}
onStartTests={onStartTests}
onStopTests={onStopTests}
onViewTestLogs={onViewTestLogs}
hasInitScript={hasInitScript}
/>
</div>

13
apps/ui/src/components/views/board-view/worktree-panel/types.ts
View File

@@ -30,6 +30,19 @@ export interface DevServerInfo {
url: string;
}
export interface TestSessionInfo {
sessionId: string;
worktreePath: string;
/** The test command being run (from project settings) */
command: string;
status: 'pending' | 'running' | 'passed' | 'failed' | 'cancelled';
testFile?: string;
startedAt: string;
finishedAt?: string;
exitCode?: number | null;
duration?: number;
}
export interface FeatureInfo {
id: string;
branchName?: string;

243
apps/ui/src/components/views/board-view/worktree-panel/worktree-panel.tsx
View File

@@ -6,8 +6,15 @@ import { pathsEqual } from '@/lib/utils';
import { toast } from 'sonner';
import { getHttpApiClient } from '@/lib/http-api-client';
import { useIsMobile } from '@/hooks/use-media-query';
import { useWorktreeInitScript } from '@/hooks/queries';
import type { WorktreePanelProps, WorktreeInfo } from './types';
import { useWorktreeInitScript, useProjectSettings } from '@/hooks/queries';
import { useTestRunnerEvents } from '@/hooks/use-test-runners';
import { useTestRunnersStore } from '@/store/test-runners-store';
import type {
TestRunnerStartedEvent,
TestRunnerOutputEvent,
TestRunnerCompletedEvent,
} from '@/types/electron';
import type { WorktreePanelProps, WorktreeInfo, TestSessionInfo } from './types';
import {
useWorktrees,
useDevServers,
@@ -25,6 +32,7 @@ import {
import { useAppStore } from '@/store/app-store';
import { ViewWorktreeChangesDialog, PushToRemoteDialog, MergeWorktreeDialog } from '../dialogs';
import { ConfirmDialog } from '@/components/ui/confirm-dialog';
import { TestLogsPanel } from '@/components/ui/test-logs-panel';
import { Undo2 } from 'lucide-react';
import { getElectronAPI } from '@/lib/electron';
@@ -161,6 +169,194 @@ export function WorktreePanel({
const { data: initScriptData } = useWorktreeInitScript(projectPath);
const hasInitScript = initScriptData?.exists ?? false;
// Check if test command is configured in project settings
const { data: projectSettings } = useProjectSettings(projectPath);
const hasTestCommand = !!projectSettings?.testCommand;
// Test runner state management
// Use the test runners store to get global state for all worktrees
const testRunnersStore = useTestRunnersStore();
const [isStartingTests, setIsStartingTests] = useState(false);
// Subscribe to test runner events to update store state in real-time
// This ensures the UI updates when tests start, output is received, or tests complete
useTestRunnerEvents(
// onStarted - a new test run has begun
useCallback(
(event: TestRunnerStartedEvent) => {
testRunnersStore.startSession({
sessionId: event.sessionId,
worktreePath: event.worktreePath,
command: event.command,
status: 'running',
testFile: event.testFile,
startedAt: event.timestamp,
});
},
[testRunnersStore]
),
// onOutput - test output received
useCallback(
(event: TestRunnerOutputEvent) => {
testRunnersStore.appendOutput(event.sessionId, event.content);
},
[testRunnersStore]
),
// onCompleted - test run finished
useCallback(
(event: TestRunnerCompletedEvent) => {
testRunnersStore.completeSession(
event.sessionId,
event.status,
event.exitCode,
event.duration
);
// Show toast notification for test completion
const statusEmoji =
event.status === 'passed' ? '✅' : event.status === 'failed' ? '❌' : '⏹️';
const statusText =
event.status === 'passed' ? 'passed' : event.status === 'failed' ? 'failed' : 'stopped';
toast(`${statusEmoji} Tests ${statusText}`, {
description: `Exit code: ${event.exitCode ?? 'N/A'}`,
duration: 4000,
});
},
[testRunnersStore]
)
);
// Test logs panel state
const [testLogsPanelOpen, setTestLogsPanelOpen] = useState(false);
const [testLogsPanelWorktree, setTestLogsPanelWorktree] = useState<WorktreeInfo | null>(null);
// Helper to check if tests are running for a specific worktree
const isTestRunningForWorktree = useCallback(
(worktree: WorktreeInfo): boolean => {
return testRunnersStore.isWorktreeRunning(worktree.path);
},
[testRunnersStore]
);
// Helper to get test session info for a specific worktree
const getTestSessionInfo = useCallback(
(worktree: WorktreeInfo): TestSessionInfo | undefined => {
const session = testRunnersStore.getActiveSession(worktree.path);
if (!session) {
// Check for completed sessions to show last result
const allSessions = Object.values(testRunnersStore.sessions).filter(
(s) => s.worktreePath === worktree.path
);
const lastSession = allSessions.sort(
(a, b) => new Date(b.startedAt).getTime() - new Date(a.startedAt).getTime()
)[0];
if (lastSession) {
return {
sessionId: lastSession.sessionId,
worktreePath: lastSession.worktreePath,
command: lastSession.command,
status: lastSession.status as TestSessionInfo['status'],
testFile: lastSession.testFile,
startedAt: lastSession.startedAt,
finishedAt: lastSession.finishedAt,
exitCode: lastSession.exitCode,
duration: lastSession.duration,
};
}
return undefined;
}
return {
sessionId: session.sessionId,
worktreePath: session.worktreePath,
command: session.command,
status: session.status as TestSessionInfo['status'],
testFile: session.testFile,
startedAt: session.startedAt,
finishedAt: session.finishedAt,
exitCode: session.exitCode,
duration: session.duration,
};
},
[testRunnersStore]
);
// Handler to start tests for a worktree
const handleStartTests = useCallback(
async (worktree: WorktreeInfo) => {
setIsStartingTests(true);
try {
const api = getElectronAPI();
if (!api?.worktree?.startTests) {
toast.error('Test runner API not available');
return;
}
const result = await api.worktree.startTests(worktree.path, { projectPath });
if (result.success) {
toast.success('Tests started', {
description: `Running tests in ${worktree.branch}`,
});
} else {
toast.error('Failed to start tests', {
description: result.error || 'Unknown error',
});
}
} catch (error) {
toast.error('Failed to start tests', {
description: error instanceof Error ? error.message : 'Unknown error',
});
} finally {
setIsStartingTests(false);
}
},
[projectPath]
);
// Handler to stop tests for a worktree
const handleStopTests = useCallback(
async (worktree: WorktreeInfo) => {
try {
const session = testRunnersStore.getActiveSession(worktree.path);
if (!session) {
toast.error('No active test session to stop');
return;
}
const api = getElectronAPI();
if (!api?.worktree?.stopTests) {
toast.error('Test runner API not available');
return;
}
const result = await api.worktree.stopTests(session.sessionId);
if (result.success) {
toast.success('Tests stopped', {
description: `Stopped tests in ${worktree.branch}`,
});
} else {
toast.error('Failed to stop tests', {
description: result.error || 'Unknown error',
});
}
} catch (error) {
toast.error('Failed to stop tests', {
description: error instanceof Error ? error.message : 'Unknown error',
});
}
},
[testRunnersStore]
);
// Handler to view test logs for a worktree
const handleViewTestLogs = useCallback((worktree: WorktreeInfo) => {
setTestLogsPanelWorktree(worktree);
setTestLogsPanelOpen(true);
}, []);
// Handler to close test logs panel
const handleCloseTestLogsPanel = useCallback(() => {
setTestLogsPanelOpen(false);
}, []);
// View changes dialog state
const [viewChangesDialogOpen, setViewChangesDialogOpen] = useState(false);
const [viewChangesWorktree, setViewChangesWorktree] = useState<WorktreeInfo | null>(null);
@@ -392,6 +588,10 @@ export function WorktreePanel({
devServerInfo={getDevServerInfo(selectedWorktree)}
gitRepoStatus={gitRepoStatus}
isAutoModeRunning={isAutoModeRunningForWorktree(selectedWorktree)}
hasTestCommand={hasTestCommand}
isStartingTests={isStartingTests}
isTestRunning={isTestRunningForWorktree(selectedWorktree)}
testSessionInfo={getTestSessionInfo(selectedWorktree)}
onOpenChange={handleActionsDropdownOpenChange(selectedWorktree)}
onPull={handlePull}
onPush={handlePush}
@@ -413,6 +613,9 @@ export function WorktreePanel({
onViewDevServerLogs={handleViewDevServerLogs}
onRunInitScript={handleRunInitScript}
onToggleAutoMode={handleToggleAutoMode}
onStartTests={handleStartTests}
onStopTests={handleStopTests}
onViewTestLogs={handleViewTestLogs}
hasInitScript={hasInitScript}
/>
)}
@@ -494,6 +697,17 @@ export function WorktreePanel({
onMerged={handleMerged}
onCreateConflictResolutionFeature={onCreateMergeConflictResolutionFeature}
/>
{/* Test Logs Panel */}
<TestLogsPanel
open={testLogsPanelOpen}
onClose={handleCloseTestLogsPanel}
worktreePath={testLogsPanelWorktree?.path ?? null}
branch={testLogsPanelWorktree?.branch}
onStopTests={
testLogsPanelWorktree ? () => handleStopTests(testLogsPanelWorktree) : undefined
}
/>
</div>
);
}
@@ -530,6 +744,9 @@ export function WorktreePanel({
hasRemoteBranch={hasRemoteBranch}
gitRepoStatus={gitRepoStatus}
isAutoModeRunning={isAutoModeRunningForWorktree(mainWorktree)}
isStartingTests={isStartingTests}
isTestRunning={isTestRunningForWorktree(mainWorktree)}
testSessionInfo={getTestSessionInfo(mainWorktree)}
onSelectWorktree={handleSelectWorktree}
onBranchDropdownOpenChange={handleBranchDropdownOpenChange(mainWorktree)}
onActionsDropdownOpenChange={handleActionsDropdownOpenChange(mainWorktree)}
@@ -556,7 +773,11 @@ export function WorktreePanel({
onViewDevServerLogs={handleViewDevServerLogs}
onRunInitScript={handleRunInitScript}
onToggleAutoMode={handleToggleAutoMode}
onStartTests={handleStartTests}
onStopTests={handleStopTests}
onViewTestLogs={handleViewTestLogs}
hasInitScript={hasInitScript}
hasTestCommand={hasTestCommand}
/>
)}
</div>
@@ -596,6 +817,9 @@ export function WorktreePanel({
hasRemoteBranch={hasRemoteBranch}
gitRepoStatus={gitRepoStatus}
isAutoModeRunning={isAutoModeRunningForWorktree(worktree)}
isStartingTests={isStartingTests}
isTestRunning={isTestRunningForWorktree(worktree)}
testSessionInfo={getTestSessionInfo(worktree)}
onSelectWorktree={handleSelectWorktree}
onBranchDropdownOpenChange={handleBranchDropdownOpenChange(worktree)}
onActionsDropdownOpenChange={handleActionsDropdownOpenChange(worktree)}
@@ -622,7 +846,11 @@ export function WorktreePanel({
onViewDevServerLogs={handleViewDevServerLogs}
onRunInitScript={handleRunInitScript}
onToggleAutoMode={handleToggleAutoMode}
onStartTests={handleStartTests}
onStopTests={handleStopTests}
onViewTestLogs={handleViewTestLogs}
hasInitScript={hasInitScript}
hasTestCommand={hasTestCommand}
/>
);
})}
@@ -703,6 +931,17 @@ export function WorktreePanel({
onMerged={handleMerged}
onCreateConflictResolutionFeature={onCreateMergeConflictResolutionFeature}
/>
{/* Test Logs Panel */}
<TestLogsPanel
open={testLogsPanelOpen}
onClose={handleCloseTestLogsPanel}
worktreePath={testLogsPanelWorktree?.path ?? null}
branch={testLogsPanelWorktree?.branch}
onStopTests={
testLogsPanelWorktree ? () => handleStopTests(testLogsPanelWorktree) : undefined
}
/>
</div>
);
}