Plan for issue #4: Diff View Feature

[github-actions]

Implementation Plan: Diff View Feature

This PR contains a comprehensive implementation plan for adding a diff view feature to the AI Text Editor.

Overview

The plan adds a new diff view using CodeMirror's merge view capability, allowing users to:

• Request diffs from AI as a new prompt action type
• View changes side-by-side with the original text
• Accept/reject individual changes or all at once
• Apply approved changes to the main editor

Key Components

1. New DiffViewManager Component - Manages CodeMirror merge view instances
2. Diff Tab - New tab in AI sidebar for viewing diffs
3. Diff Action Type - New prompt action type alongside 'feedback', 'insert', 'replace'
4. Merge View Integration - Uses CodeMirror's merge addon with jsDiff

Implementation Phases

1. Add Merge View Dependencies - Add CodeMirror merge addon CSS/JS to index.html
2. Create DiffViewManager - New component for merge view management
3. Update Prompt System - Add 'diff' as valid action type
4. Update AIService - Handle diff responses from LLM
5. Update UIManager - Diff tab navigation and state
6. Main App Integration - Connect all components in script.js
7. Styling - Diff view CSS with mobile responsiveness

Estimated Time: 10-15 hours

The plan includes detailed code examples, file summaries, edge cases to handle, testing checklist, and risk mitigation strategies.

View the full plan at: plans/4.md

---

Generated with Claude Code