id: task-119 title: Add documentation and decisions pages to web UI status: Done assignee: [] created_date: '2025-07-06' updated_date: '2025-07-06' labels: [] dependencies: [task-118]

Description

Implement dedicated pages for viewing and editing Documentation and Decisions in the web UI. Each page should display a list of markdown files with a beautiful rendered preview by default, and allow switching to an edit mode using the same markdown editor component used in task editing.

Acceptance Criteria

Documentation Page

• [x] List all markdown files from the docs/ directory
• [x] Display file names as clickable items in a clean list/grid layout
• [x] Show rendered markdown content when a file is selected
• [x] Add "Edit" button that switches to edit mode
• [x] Use the same markdown editor component from task editing
• [x] Add "Save" and "Cancel" buttons in edit mode
• [x] Support creating new documentation files
• [x] Add search/filter functionality for documentation files

Decisions Page

• [x] List all markdown files from the decisions/ directory
• [x] Display decision files with ID, title, and date
• [x] Show rendered markdown content for selected decisions
• [x] Add "Edit" button for switching to edit mode
• [x] Use the same markdown editor component from task editing
• [x] Add "Save" and "Cancel" buttons in edit mode
• [x] Support creating new decision files with auto-generated IDs
• [x] Add filtering by status (Proposed, Accepted, Rejected, Superseded)

API Endpoints

• [x] Add /api/docs endpoint for listing documentation files
• [x] Add /api/docs/:filename endpoint for reading/updating documentation
• [x] Add /api/decisions endpoint for listing decision files
• [x] Add /api/decisions/:id endpoint for reading/updating decisions

Technical Notes

• Reuse the existing markdown editor component from TaskForm
• Implement proper syntax highlighting for code blocks in rendered markdown
• Consider using a markdown parsing library like marked or remark
• Add loading states while fetching file contents
• Implement error handling for file operations
• Consider adding a breadcrumb navigation for better UX
• Files should be displayed with metadata (last modified, file size)

Implementation Notes

• Created documentation listing page with responsive grid layout in src/web/components/DocumentationList.tsx
• Created decisions listing page with grid layout and status filtering in src/web/components/DecisionsList.tsx
• Implemented detail pages for viewing and editing both documents and decisions
• Added create/edit functionality with markdown editor integration
• Integrated with CLI commands for document and decision management via API endpoints
• Implemented proper ID generation with cross-branch collision detection for decisions
• Added all required API endpoints:
  • /api/docs - List all documentation files
  • /api/docs/:filename - Read/update specific documentation
  • /api/decisions - List all decision files
  • /api/decisions/:id - Read/update specific decisions
• Used the existing markdown editor component from TaskForm for consistency
• Added proper loading states and error handling throughout
• Implemented search functionality for documentation files
• Added status filtering for decisions (Proposed, Accepted, Rejected, Superseded)
• Enhanced UI with proper spacing, transitions, and responsive design
• Added metadata display including last modified dates and file information