feat: Allow drag-to-create dependencies between any non-completed features (#656)

* feat: Allow drag-to-create dependencies between any non-completed features

Previously, the card drag-to-create-dependency feature only worked between
backlog features. This expands the functionality to allow creating dependency
links between features in any status (except completed).

Changes:
- Make all non-completed cards droppable for dependency linking
- Update drag-drop hook to allow links between any status
- Add status badges to the dependency link dialog for better context

* refactor: use barrel export for StatusBadge import

---------

Co-authored-by: Claude <noreply@anthropic.com>
This commit is contained in:
Stefan de Vogelaere
2026-01-23 01:42:51 +01:00
committed by GitHub
parent c65f931326
commit afb6e14811
3 changed files with 16 additions and 7 deletions

View File

@@ -136,8 +136,9 @@ export const KanbanCard = memo(function KanbanCard({
});
// Make the card a drop target for creating dependency links
// Only backlog cards can be link targets (to avoid complexity with running features)
const isDroppable = !isOverlay && feature.status === 'backlog' && !isSelectionMode;
// All non-completed cards can be link targets to allow flexible dependency creation
// (completed features are excluded as they're already done)
const isDroppable = !isOverlay && feature.status !== 'completed' && !isSelectionMode;
const { setNodeRef: setDroppableRef, isOver } = useDroppable({
id: `card-drop-${feature.id}`,
disabled: !isDroppable,

View File

@@ -12,6 +12,8 @@ import { Button } from '@/components/ui/button';
import { ArrowDown, ArrowUp, Link2, X } from 'lucide-react';
import type { Feature } from '@/store/app-store';
import { cn } from '@/lib/utils';
import { StatusBadge } from '../components';
import type { FeatureStatusWithPipeline } from '@automaker/types';
export type DependencyLinkType = 'parent' | 'child';
@@ -57,7 +59,10 @@ export function DependencyLinkDialog({
<div className="py-4 space-y-4">
{/* Dragged feature */}
<div className="p-3 rounded-lg border bg-muted/30">
<div className="text-xs text-muted-foreground mb-1">Dragged Feature</div>
<div className="flex items-center justify-between mb-1">
<span className="text-xs text-muted-foreground">Dragged Feature</span>
<StatusBadge status={draggedFeature.status as FeatureStatusWithPipeline} size="sm" />
</div>
<div className="text-sm font-medium line-clamp-3 break-words">
{draggedFeature.description}
</div>
@@ -71,7 +76,10 @@ export function DependencyLinkDialog({
{/* Target feature */}
<div className="p-3 rounded-lg border bg-muted/30">
<div className="text-xs text-muted-foreground mb-1">Target Feature</div>
<div className="flex items-center justify-between mb-1">
<span className="text-xs text-muted-foreground">Target Feature</span>
<StatusBadge status={targetFeature.status as FeatureStatusWithPipeline} size="sm" />
</div>
<div className="text-sm font-medium line-clamp-3 break-words">
{targetFeature.description}
</div>

View File

@@ -88,10 +88,10 @@ export function useBoardDragDrop({
const targetFeature = features.find((f) => f.id === targetFeatureId);
if (!targetFeature) return;
// Only allow linking backlog features (both must be in backlog)
if (draggedFeature.status !== 'backlog' || targetFeature.status !== 'backlog') {
// Don't allow linking completed features (they're already done)
if (draggedFeature.status === 'completed' || targetFeature.status === 'completed') {
toast.error('Cannot link features', {
description: 'Both features must be in the backlog to create a dependency link.',
description: 'Completed features cannot be linked.',
});
return;
}