Add duplicate task button (vibe-kanban) (#593)

* ##  Implementation Complete!

I've successfully implemented the duplicate task feature. Here's what was accomplished:

### **Changes Made:**

1. **TaskDialogContext (`frontend/src/contexts/task-dialog-context.tsx`)**
   - Added `initialTask: Task | null` to dialog state
   - Created `openDuplicate(task, options)` method that opens create dialog with initial data
   - Updated all existing methods to include initialTask field

2. **TaskFormDialog (`frontend/src/components/tasks/TaskFormDialog.tsx`)**
   - Added `initialTask?: Task | null` prop
   - Enhanced prefill logic with priority: Edit → Duplicate → Template → Empty
   - Duplicated tasks reset status to 'todo' and start with no images

3. **TaskCard (`frontend/src/components/tasks/TaskCard.tsx`)**
   - Added Copy icon import
   - Added `onDuplicate?: (task: Task) => void` prop
   - Added "Duplicate" menu item with Copy icon between Edit and Delete

4. **TaskKanbanBoard (`frontend/src/components/tasks/TaskKanbanBoard.tsx`)**
   - Added `onDuplicateTask?: (task: Task) => void` prop
   - Passed duplicate handler through to TaskCard components

5. **ProjectTasks (`frontend/src/pages/project-tasks.tsx`)**
   - Added `openDuplicate` to useTaskDialog destructuring
   - Created `handleDuplicateTask` function
   - Passed duplicate handler to TaskKanbanBoard

6. **TaskFormDialogContainer (`frontend/src/components/tasks/TaskFormDialogContainer.tsx`)**
   - Added `initialTask={dialogState.initialTask}` prop to TaskFormDialog

### **How It Works:**

1. **User clicks** the "⋯" menu on any task card
2. **Sees "Duplicate"** option with copy icon between Edit and Delete
3. **Clicks Duplicate** → opens create task dialog with:
   - Title and description pre-filled from original task
   - Status reset to 'todo'
   - No images (clean slate)
   - User can modify and create as normal

### **Key Design Decisions:**
- **Treated as create mode** (not edit) - follows Oracle's recommendation
- **Status always resets to 'todo'** for duplicated tasks
- **No images copied** - simple and safe approach
- **Clean integration** with existing template system

The implementation passes all TypeScript checks and follows the existing codebase patterns. The feature is ready to use!

* Cleanup script changes for task attempt 16b21999-278c-414d-aaab-ae5767d42d77
This commit is contained in:
Louis Knight-Webb
2025-08-29 15:18:42 +01:00
committed by GitHub
parent 305ad90a70
commit 5505a387bc
7 changed files with 67 additions and 7 deletions

View File

@@ -45,7 +45,7 @@ export function ProjectTasks() {
const [project, setProject] = useState<Project | null>(null);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
const { openCreate, openEdit } = useTaskDialog();
const { openCreate, openEdit, openDuplicate } = useTaskDialog();
const [isProjectSettingsOpen, setIsProjectSettingsOpen] = useState(false);
const { query: searchQuery } = useSearch();
@@ -187,6 +187,13 @@ export function ProjectTasks() {
[openEdit]
);
const handleDuplicateTask = useCallback(
(task: Task) => {
openDuplicate(task);
},
[openDuplicate]
);
const handleViewTaskDetails = useCallback(
(task: Task, attemptIdToShow?: string) => {
// setSelectedTask(task);
@@ -336,6 +343,7 @@ export function ProjectTasks() {
onDragEnd={handleDragEnd}
onEditTask={handleEditTask}
onDeleteTask={handleDeleteTask}
onDuplicateTask={handleDuplicateTask}
onViewTaskDetails={handleViewTaskDetails}
isPanelOpen={isPanelOpen}
/>