captains-log/plan/01_CORE_MVP/plan.md

Phase 1: Core MVP - Task Management Only

Feature 1: Task Management

Overview

Implement the foundational task management system with basic CRUD operations and essential properties.

Task Properties (from PRD)

• Title (required)
• Description (optional, markdown supported)
• Priority (High/Medium/Low)
• Due date (optional)
• Status (Todo/In Progress/Done/Someday)

Technical Architecture

Backend: Rust + Axum + SQLx

• RESTful API for task operations
• SQLite for development database
• Type-safe database queries

Database Schema

CREATE TABLE tasks (
    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
    title VARCHAR NOT NULL,
    description TEXT,
    priority VARCHAR(10) DEFAULT 'medium', -- high, medium, low
    due_date DATE,
    status VARCHAR(20) DEFAULT 'todo', -- todo, in_progress, done, someday
    created_at TIMESTAMP DEFAULT NOW(),
    updated_at TIMESTAMP DEFAULT NOW(),
    completed_at TIMESTAMP
);

Frontend: Vite + React + Tailwind

• Single-page task management interface with React Router
• Quick capture form with React hooks
• Task list with inline editing using React components
• Mobile-responsive design

Testing Strategy

Backend Testing

• Unit Tests: Test individual functions and models using cargo test
• Integration Tests: Test API endpoints with test database
• Database Tests: Test SQLx queries and migrations
• Test Coverage: Aim for >80% code coverage using cargo tarpaulin

Frontend Testing

• Unit Tests: Component testing with Vitest and React Testing Library
• Integration Tests: User interaction flows with Playwright
• Accessibility Tests: Screen reader compatibility and keyboard navigation
• Mobile Testing: Responsive design validation on various screen sizes

Test Database

• Separate SQLite test database that's reset between test runs
• Test fixtures for common task scenarios
• Database migration testing

Implementation Plan

Week 1: Backend Foundation

1. Project Setup

   • Initialize Rust project with Axum
   • Setup SQLx with SQLite
   • Create database migration for tasks table
   • Basic server with health check endpoint
   • Testing: Setup test framework and test database

2. Task API Endpoints

   • POST /api/tasks - Create new task
   • GET /api/tasks - List all tasks
   • GET /api/tasks/{id} - Get single task
   • PUT /api/tasks/{id} - Update task
   • DELETE /api/tasks/{id} - Delete task
   • PATCH /api/tasks/{id}/status - Update task status
   • Testing: Integration tests for all endpoints

Week 2: Frontend Foundation

1. Vite + React Setup

   • Initialize Vite project with React template
   • Configure Tailwind CSS
   • Setup React Router for navigation
   • Setup API client utilities
   • Testing: Setup Vitest, React Testing Library, and Playwright

2. Core React Components

   • TaskCard component with React hooks
   • TaskForm component (create/edit) with form handling
   • TaskList component with state management
   • Quick capture input component
   • Testing: Unit tests for each component using React Testing Library

Week 3: Integration & Polish

1. Task Management Interface

   • Task creation form with all properties
   • Task list with status filtering
   • Inline task editing
   • Task deletion with confirmation
   • Testing: End-to-end user workflow tests

2. Mobile Responsiveness

   • Touch-friendly controls
   • Responsive layout
   • Mobile-optimized forms
   • Testing: Mobile browser testing and accessibility validation

Success Criteria

• Users can create tasks with all properties
• Tasks display in a clean, scannable list
• Users can edit task properties inline
• Users can update task status (todo → in_progress → done)
• Users can delete tasks
• Interface works well on mobile devices
• Quick capture allows rapid task entry
• Testing: All tests pass and maintain >80% backend coverage
• Testing: E2E tests cover core user workflows
• Testing: Accessibility tests pass

Definition of Done

• Working backend API with proper error handling
• Responsive frontend with mobile support
• All task CRUD operations functional
• Basic form validation
• Comprehensive test suite with good coverage
• Automated testing pipeline setup
• Manual testing completed on desktop and mobile

Test Commands

# Backend tests
cargo test
cargo tarpaulin --out Html  # Coverage report

# Frontend tests  
npm test                    # Unit tests with Vitest
npm run test:e2e           # End-to-end tests with Playwright
npm run test:coverage      # Coverage report