Duplicate tasks created due to React 19 double render and missing idempotency

[mjunaidca]

Problem

Tasks are sometimes created in duplicate when users submit the create task form.

Root Causes

1. React 19 StrictMode Double Render

In development mode, React 19's StrictMode intentionally double-invokes effects to help detect side effects. This causes useEffect hooks that make API calls to fire twice.

Location: apps/web/app/tasks/new/page.tsx

2. No Idempotency Keys

The API has no mechanism to deduplicate identical requests. Each POST to /api/projects/{id}/tasks creates a new task regardless of whether an identical request was just processed.

Location: packages/api/src/taskflow_api/routers/tasks.py:188-270

3. No Unique Constraints

The database allows multiple tasks with the same title in the same project, which is valid but means duplicates aren't caught at the DB level.

Location: packages/api/src/taskflow_api/models/task.py

Recommended Fixes

Frontend

• Add useCallback with proper dependencies or debounce submit handler
• Disable submit button while request is in-flight
• Consider using React Query or SWR with built-in deduplication

Backend

• Add optional idempotency_key field to TaskCreate schema
• Check for existing task with same key (within time window) before creating
• Return existing task if idempotency key matches

Impact

• Severity: Medium
• User Impact: Confusing UX, requires manual deletion of duplicates
• Data Impact: Pollutes task list with duplicates

Labels

• bug
• frontend
• backend