# Context Management Implementation Plan

**Date:** January 25, 2026  
**Version:** 0.1.3+ → 0.2.0  
**Status:** 📋 APPROVED - READY FOR IMPLEMENTATION

---

## 📚 Approved Plans Summary

### **1. CONTEXT_FLOW_ANALYSIS.md**

**Key Findings:**
- ✅ Analyzed 12 distinct user interaction flows
- 🔴 Identified critical issues:
  - Chat history NOT sent to Writing mode
  - Writing mode notes ignored (don't update plan)
  - Block refinement missing context
  - Direct writing mode cannot execute (no plan)
- ✅ Mapped all context storage mechanisms
- ✅ Provided recommendations for fixes

**Critical Issues to Fix:**

| Issue | Severity | Impact |
|-------|----------|--------|
| Chat history not sent to Writing mode | 🔴 Critical | AI loses conversation context |
| Writing mode notes ignored | 🔴 Critical | User instructions silently ignored |
| Block refinement missing context | 🟡 Medium | AI doesn't understand original intent |
| Direct writing mode fails | 🟡 Medium | Confusing UX, no error handling |

---

### **2. AGENTIC_CONTEXT_STRATEGY.md**

**Key Solutions:**
- ✅ AI-powered context summarization (not hardcoded)
- ✅ AI-powered intent detection (language-agnostic)
- ✅ Cost-effective (~$0.0001 per summarization)
- ✅ Seamless agentic UX (proactive suggestions)
- ✅ Works in all languages (Indonesian, Arabic, Chinese, etc.)

**Core Philosophy:**
> "If AI is smart enough to write articles, it's smart enough to manage its own context."

**New Actions:**

| Action | Purpose | Cost | When |
|--------|---------|------|------|
| `summarize_context` | Condense chat history | $0.0001 | Before outline (if chat > 6 msgs) |
| `detect_intent` | Understand user's next step | $0.00002 | After each user message |

---

## 🎯 Implementation Goals

### **Primary Objectives**

1. **Fix Context Loss Issues**
   - Send chat history to ALL endpoints
   - Include context in block refinement
   - Handle writing mode properly

2. **Implement Agentic Context Management**
   - AI-powered summarization
   - AI-powered intent detection
   - Language-agnostic (no hardcoded keywords)

3. **Enhance User Experience**
   - Proactive action suggestions
   - Seamless mode transitions
   - Transparent context operations

4. **Maintain Cost Efficiency**
   - Total added cost: ~$0.34/month for 100 articles
   - 76% token reduction vs full history
   - Track all costs transparently

---

## 📋 Implementation Phases

### **Phase 1: Critical Fixes** (Priority: 🔴 HIGH)

**Goal:** Fix context loss issues identified in CONTEXT_FLOW_ANALYSIS.md

#### **1.1 Send Chat History Everywhere**

**Files to Modify:**
- `assets/js/sidebar.js`

**Changes:**

```javascript
// In ALL API request payloads, add chatHistory
const basePayload = {
    messages: messages,
    postId: postId,
    chatHistory: messages.filter(m => m.role !== 'system'), // ✅ Add this
    postConfig: postConfig,
    type: agentMode
};

// Apply to:
// - handleExecuteArticle() → /execute-article
// - handleRefineBlock() → /refine-block
// - handleGenerateMeta() → /generate-meta
// - Any other endpoints that don't currently send chatHistory
```

**Backend Files to Modify:**
- `includes/class-gutenberg-sidebar.php`

**Changes:**

```php
// In handle_execute_article()
$chat_history = $params['chatHistory'] ?? array();
if (!empty($chat_history)) {
    $chat_history_context = $this->build_chat_history_context($chat_history);
    // Append to system prompt
}

// In handle_refine_block()
$chat_history = $params['chatHistory'] ?? array();
$plan = get_post_meta($post_id, '_wpaw_plan', true);
// Include both in refinement context

// In handle_generate_meta()
$chat_history = $params['chatHistory'] ?? array();
// Include for better meta description context
```

**Testing:**
- [ ] Test Chat → Writing mode (verify context preserved)
- [ ] Test block refinement (verify original intent understood)
- [ ] Test meta generation (verify context used)

**Estimated Time:** 2-3 hours

---

#### **1.2 Handle Writing Mode Properly**

**Problem:** User can switch to Writing mode without a plan, then cannot execute.

**Solution:** Show clear guidance and prevent confusion.

**Files to Modify:**
- `assets/js/sidebar.js`

**Changes:**

```javascript
// In renderWritingMode()
const renderWritingModeContent = () => {
    if (!currentPlan) {
        return (
            <div className="writing-mode-empty">
                <div className="empty-state">
                    <span className="icon">📝</span>
                    <h3>No Outline Yet</h3>
                    <p>Writing mode requires an outline to structure your article.</p>
                    <button 
                        onClick={() => setAgentMode('planning')} 
                        className="primary"
                    >
                        📝 Create Outline First
                    </button>
                    <p className="hint">
                        Or switch to <button onClick={() => setAgentMode('chat')} className="link">Chat mode</button> to discuss your ideas.
                    </p>
                </div>
            </div>
        );
    }
    
    // Normal writing mode UI...
};

// In handleExecuteArticle()
if (!currentPlan) {
    showError('Please create an outline first. Switch to Planning mode.');
    return;
}
```

**CSS to Add:**
- `assets/css/sidebar.css`

```css
.writing-mode-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 300px;
}

.empty-state {
    text-align: center;
    max-width: 400px;
    padding: 2rem;
}

.empty-state .icon {
    font-size: 3rem;
    display: block;
    margin-bottom: 1rem;
}

.empty-state h3 {
    margin: 0 0 0.5rem 0;
    font-size: 1.5rem;
}

.empty-state p {
    color: #666;
    margin: 0.5rem 0;
}

.empty-state .hint {
    font-size: 0.9rem;
    margin-top: 1rem;
}
```

**Testing:**
- [ ] Test switching to Writing mode without plan
- [ ] Verify clear guidance shown
- [ ] Test "Create Outline First" button
- [ ] Test switching back to Chat mode

**Estimated Time:** 1-2 hours

---

#### **1.3 Handle Writing Mode Notes**

**Problem:** User adds notes in Writing mode, but notes don't update the plan.

**Solution:** Either update plan or show clear warning.

**Recommended Approach:** Show warning (simpler, clearer UX)

**Files to Modify:**
- `assets/js/sidebar.js`

**Changes:**

```javascript
// In Writing mode, when user sends a message
const handleWritingModeMessage = async (userMessage) => {
    // Show info message
    addSystemMessage(
        '💡 Note: To modify the outline, switch to Planning mode. ' +
        'Writing mode messages are for discussion only.'
    );
    
    // Still send to chat endpoint for conversation
    await sendChatMessage(userMessage);
};

// Add mode indicator in input area
const renderInputArea = () => {
    return (
        <div className="input-area">
            {agentMode === 'writing' && currentPlan && (
                <div className="mode-notice">
                    💬 Chat mode active. To modify outline, switch to Planning mode.
                </div>
            )}
            <textarea {...} />
        </div>
    );
};
```

**Alternative Approach (Advanced):** Auto-update plan
- Detect if message is requesting plan changes
- Send to `/update-plan` endpoint
- Regenerate plan with modifications
- More complex, implement in Phase 3

**Testing:**
- [ ] Test adding notes in Writing mode
- [ ] Verify warning shown
- [ ] Verify notes don't silently fail

**Estimated Time:** 1 hour

---

### **Phase 2: Agentic Infrastructure** (Priority: 🟡 MEDIUM)

**Goal:** Implement AI-powered context management from AGENTIC_CONTEXT_STRATEGY.md

#### **2.1 Backend: Add Summarization Endpoint**

**Files to Modify:**
- `includes/class-gutenberg-sidebar.php`

**New Endpoint:**

```php
/**
 * Register summarize-context endpoint.
 */
register_rest_route(
    'wp-agentic-writer/v1',
    '/summarize-context',
    array(
        'methods' => 'POST',
        'callback' => array($this, 'handle_summarize_context'),
        'permission_callback' => array($this, 'check_permissions'),
    )
);

/**
 * Handle context summarization request.
 *
 * @param WP_REST_Request $request REST request.
 * @return WP_REST_Response|WP_Error Response.
 */
public function handle_summarize_context($request) {
    $params = $request->get_json_params();
    $chat_history = $params['chatHistory'] ?? array();
    $post_id = $params['postId'] ?? 0;
    
    // Short history doesn't need summarization
    if (empty($chat_history) || count($chat_history) < 4) {
        return new WP_REST_Response(
            array(
                'summary' => '',
                'use_full_history' => true,
                'cost' => 0,
            ),
            200
        );
    }
    
    // Build history text
    $history_text = '';
    foreach ($chat_history as $msg) {
        $role = ucfirst($msg['role'] ?? 'Unknown');
        $content = $msg['content'] ?? '';
        $history_text .= "{$role}: {$content}\n\n";
    }
    
    // Build summarization prompt
    $prompt = "Summarize this conversation into key points that capture the user's intent and requirements.

Focus on:
- Main topic
- Specific focus areas
- Rejected/excluded topics
- User preferences (tone, audience, etc.)

Keep the summary concise (max 200 words) but preserve critical context.
Write in the same language as the conversation.

Output format:
TOPIC: [main topic]
FOCUS: [what to include]
EXCLUDE: [what to avoid]
PREFERENCES: [any specific requirements]

Conversation:
{$history_text}";
    
    // Call AI with cheap model
    $provider = WP_Agentic_Writer_OpenRouter_Provider::get_instance();
    $messages = array(
        array(
            'role' => 'user',
            'content' => $prompt,
        ),
    );
    
    $response = $provider->chat($messages, array(), 'summarize');
    
    if (is_wp_error($response)) {
        return $response;
    }
    
    // Track cost
    do_action(
        'wp_aw_after_api_request',
        $post_id,
        $response['model'] ?? '',
        'summarize_context',
        $response['input_tokens'] ?? 0,
        $response['output_tokens'] ?? 0,
        $response['cost'] ?? 0
    );
    
    return new WP_REST_Response(
        array(
            'summary' => $response['content'] ?? '',
            'use_full_history' => false,
            'cost' => $response['cost'] ?? 0,
            'tokens_saved' => count($chat_history) * 500 - ($response['output_tokens'] ?? 0),
        ),
        200
    );
}
```

**Testing:**
- [ ] Test with short history (< 4 messages) → returns use_full_history
- [ ] Test with long history (> 6 messages) → returns summary
- [ ] Test in multiple languages (English, Indonesian)
- [ ] Verify cost tracking

**Estimated Time:** 2-3 hours

---

#### **2.2 Backend: Add Intent Detection Endpoint**

**Files to Modify:**
- `includes/class-gutenberg-sidebar.php`

**New Endpoint:**

```php
/**
 * Register detect-intent endpoint.
 */
register_rest_route(
    'wp-agentic-writer/v1',
    '/detect-intent',
    array(
        'methods' => 'POST',
        'callback' => array($this, 'handle_detect_intent'),
        'permission_callback' => array($this, 'check_permissions'),
    )
);

/**
 * Handle intent detection request.
 *
 * @param WP_REST_Request $request REST request.
 * @return WP_REST_Response|WP_Error Response.
 */
public function handle_detect_intent($request) {
    $params = $request->get_json_params();
    $last_message = $params['lastMessage'] ?? '';
    $has_plan = $params['hasPlan'] ?? false;
    $current_mode = $params['currentMode'] ?? 'chat';
    $post_id = $params['postId'] ?? 0;
    
    if (empty($last_message)) {
        return new WP_REST_Response(
            array('intent' => 'continue_chat'),
            200
        );
    }
    
    // Build intent detection prompt
    $prompt = "Based on the user's message, determine their intent. Choose ONE:

1. \"create_outline\" - User wants to create an article outline/structure
2. \"start_writing\" - User wants to write the full article
3. \"refine_content\" - User wants to improve existing content
4. \"continue_chat\" - User wants to continue discussing/exploring
5. \"clarify\" - User is asking questions or needs clarification

Consider:
- The user's explicit request
- Whether they have an outline already (has_plan: " . ($has_plan ? 'true' : 'false') . ")
- Current mode (current_mode: {$current_mode})

User's message: \"{$last_message}\"

Respond with ONLY the intent code (e.g., \"create_outline\"). No explanation.";
    
    // Call AI with cheap model
    $provider = WP_Agentic_Writer_OpenRouter_Provider::get_instance();
    $messages = array(
        array(
            'role' => 'user',
            'content' => $prompt,
        ),
    );
    
    $response = $provider->chat($messages, array(), 'intent_detection');
    
    if (is_wp_error($response)) {
        return $response;
    }
    
    // Track cost
    do_action(
        'wp_aw_after_api_request',
        $post_id,
        $response['model'] ?? '',
        'detect_intent',
        $response['input_tokens'] ?? 0,
        $response['output_tokens'] ?? 0,
        $response['cost'] ?? 0
    );
    
    // Clean up response
    $intent = trim(strtolower($response['content'] ?? 'continue_chat'));
    $intent = str_replace('"', '', $intent); // Remove quotes if present
    
    // Validate intent
    $valid_intents = array('create_outline', 'start_writing', 'refine_content', 'continue_chat', 'clarify');
    if (!in_array($intent, $valid_intents)) {
        $intent = 'continue_chat';
    }
    
    return new WP_REST_Response(
        array(
            'intent' => $intent,
            'cost' => $response['cost'] ?? 0,
        ),
        200
    );
}
```

**Testing:**
- [ ] Test with "create outline" messages (various languages)
- [ ] Test with "write article" messages
- [ ] Test with questions/clarifications
- [ ] Verify correct intent returned
- [ ] Verify cost tracking

**Estimated Time:** 2-3 hours

---

#### **2.3 Backend: Update Cost Tracking**

**Files to Modify:**
- `includes/class-cost-tracker.php`

**Changes:**

```php
// Add new operation types
private function get_operation_label($operation) {
    $labels = array(
        'chat' => 'Chat',
        'planning' => 'Planning',
        'execution' => 'Article Writing',
        'refinement' => 'Block Refinement',
        'meta_description' => 'Meta Description',
        'keyword_suggestion' => 'Keyword Suggestion',
        'web_search' => 'Web Search',
        'summarize_context' => 'Context Summarization', // ✅ New
        'detect_intent' => 'Intent Detection',           // ✅ New
    );
    
    return $labels[$operation] ?? ucfirst($operation);
}
```

**Testing:**
- [ ] Verify new operations tracked in cost table
- [ ] Verify cost breakdown shows summarization/intent costs
- [ ] Test cost report includes new operations

**Estimated Time:** 30 minutes

---

#### **2.4 Frontend: Implement Summarization**

**Files to Modify:**
- `assets/js/sidebar.js`

**New Functions:**

```javascript
/**
 * Summarize chat history using AI.
 *
 * @param {Array} chatHistory - Full chat history.
 * @returns {Promise<Object>} Summary result.
 */
const summarizeChatHistory = async (chatHistory) => {
    try {
        const response = await fetch('/wp-json/wp-agentic-writer/v1/summarize-context', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'X-WP-Nonce': wpAgenticWriter.nonce,
            },
            body: JSON.stringify({
                chatHistory: chatHistory,
                postId: postId,
            }),
        });
        
        if (!response.ok) {
            throw new Error('Failed to summarize context');
        }
        
        const data = await response.json();
        return data;
    } catch (error) {
        console.error('Summarization error:', error);
        return {
            summary: '',
            use_full_history: true,
            cost: 0,
        };
    }
};

/**
 * Build optimized context for API requests.
 *
 * @param {Array} messages - Current messages.
 * @returns {Promise<Array>} Optimized context.
 */
const buildOptimizedContext = async (messages) => {
    // Short history - use as is
    if (messages.length <= 6) {
        return messages;
    }
    
    // Show optimization status
    setStatusMessage('⚡ Optimizing context...');
    
    // Summarize
    const { summary, use_full_history, cost, tokens_saved } = await summarizeChatHistory(messages);
    
    if (use_full_history || !summary) {
        return messages;
    }
    
    // Build optimized context: summary + last 2 messages
    const optimizedContext = [
        {
            role: 'system',
            content: `Context Summary:\n${summary}`,
        },
        ...messages.slice(-2), // Keep last exchange verbatim
    ];
    
    // Show success
    console.log(`Context optimized. Tokens saved: ${tokens_saved}, Cost: $${cost.toFixed(6)}`);
    
    return optimizedContext;
};
```

**Update Existing Functions:**

```javascript
// In handleCreateOutline()
const handleCreateOutline = async () => {
    setIsLoading(true);
    
    // Optimize context
    const optimizedContext = await buildOptimizedContext(messages);
    
    // Generate plan with optimized context
    const payload = {
        topic: extractTopic(messages),
        chatHistory: optimizedContext, // ✅ Use optimized
        postId: postId,
        postConfig: postConfig,
        stream: true,
    };
    
    // ... rest of function
};
```

**Testing:**
- [ ] Test with short history (≤ 6 messages) → no summarization
- [ ] Test with long history (> 6 messages) → summarization triggered
- [ ] Verify "Optimizing context..." message shown
- [ ] Verify outline quality maintained

**Estimated Time:** 2-3 hours

---

#### **2.5 Frontend: Implement Intent Detection**

**Files to Modify:**
- `assets/js/sidebar.js`

**New State:**

```javascript
const [detectedIntent, setDetectedIntent] = React.useState(null);
const [showContextualAction, setShowContextualAction] = React.useState(false);
```

**New Functions:**

```javascript
/**
 * Detect user intent using AI.
 *
 * @param {string} lastMessage - User's last message.
 * @returns {Promise<string>} Detected intent.
 */
const detectUserIntent = async (lastMessage) => {
    try {
        const response = await fetch('/wp-json/wp-agentic-writer/v1/detect-intent', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'X-WP-Nonce': wpAgenticWriter.nonce,
            },
            body: JSON.stringify({
                lastMessage: lastMessage,
                hasPlan: !!currentPlan,
                currentMode: agentMode,
                postId: postId,
            }),
        });
        
        if (!response.ok) {
            throw new Error('Failed to detect intent');
        }
        
        const data = await response.json();
        return data.intent;
    } catch (error) {
        console.error('Intent detection error:', error);
        return 'continue_chat';
    }
};

/**
 * Handle message sent - detect intent and show actions.
 */
const handleMessageSent = async (userMessage) => {
    // Send to chat
    await sendChatMessage(userMessage);
    
    // Detect intent in background (only in chat mode)
    if (agentMode === 'chat') {
        const intent = await detectUserIntent(userMessage);
        setDetectedIntent(intent);
        setShowContextualAction(true);
    }
};
```

**Render Contextual Actions:**

```javascript
/**
 * Render contextual action based on detected intent.
 */
const renderContextualAction = () => {
    if (!showContextualAction || !detectedIntent || agentMode !== 'chat') {
        return null;
    }
    
    switch (detectedIntent) {
        case 'create_outline':
            return (
                <div className="contextual-action">
                    <div className="action-content">
                        <span className="icon">💡</span>
                        <p>Ready to create an outline?</p>
                    </div>
                    <div className="action-buttons">
                        <button 
                            onClick={handleCreateOutline} 
                            className="primary"
                        >
                            📝 Create Outline
                        </button>
                        <button 
                            onClick={() => setShowContextualAction(false)} 
                            className="secondary"
                        >
                            💬 Continue Chatting
                        </button>
                    </div>
                </div>
            );
        
        case 'start_writing':
            if (!currentPlan) {
                return (
                    <div className="contextual-action warning">
                        <div className="action-content">
                            <span className="icon">⚠️</span>
                            <p>You need an outline first</p>
                        </div>
                        <div className="action-buttons">
                            <button 
                                onClick={handleCreateOutline} 
                                className="primary"
                            >
                                📝 Create Outline First
                            </button>
                        </div>
                    </div>
                );
            }
            return (
                <div className="contextual-action">
                    <div className="action-content">
                        <span className="icon">💡</span>
                        <p>Ready to write the article?</p>
                    </div>
                    <div className="action-buttons">
                        <button 
                            onClick={handleStartWriting} 
                            className="primary"
                        >
                            ✍️ Start Writing
                        </button>
                        <button 
                            onClick={() => setShowContextualAction(false)} 
                            className="secondary"
                        >
                            💬 Continue Chatting
                        </button>
                    </div>
                </div>
            );
        
        case 'refine_content':
            return (
                <div className="contextual-action info">
                    <div className="action-content">
                        <span className="icon">💡</span>
                        <p>Tip: Use @block to refine specific sections</p>
                    </div>
                </div>
            );
        
        default:
            return null;
    }
};

// Add to main render
return (
    <div className="sidebar-content">
        {/* ... existing content ... */}
        {renderContextualAction()}
        {/* ... rest of content ... */}
    </div>
);
```

**CSS to Add:**

```css
.contextual-action {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    padding: 1rem;
    border-radius: 8px;
    margin: 1rem 0;
    animation: slideIn 0.3s ease-out;
}

.contextual-action.warning {
    background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
}

.contextual-action.info {
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
}

.contextual-action .action-content {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.contextual-action .icon {
    font-size: 1.5rem;
}

.contextual-action p {
    margin: 0;
    font-weight: 500;
}

.contextual-action .action-buttons {
    display: flex;
    gap: 0.5rem;
}

.contextual-action button.primary {
    background: white;
    color: #667eea;
    border: none;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.2s;
}

.contextual-action button.primary:hover {
    transform: translateY(-2px);
}

.contextual-action button.secondary {
    background: rgba(255, 255, 255, 0.2);
    color: white;
    border: 1px solid rgba(255, 255, 255, 0.3);
    padding: 0.5rem 1rem;
    border-radius: 6px;
    cursor: pointer;
}

@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
```

**Testing:**
- [ ] Test intent detection after each message
- [ ] Verify correct action shown for each intent
- [ ] Test "Create Outline" button
- [ ] Test "Start Writing" button (with/without plan)
- [ ] Test in multiple languages
- [ ] Verify animations work

**Estimated Time:** 3-4 hours

---

### **Phase 3: UX Enhancements** (Priority: 🟢 LOW)

**Goal:** Polish user experience with additional features

#### **3.1 Context Indicator**

**Show context status to user:**

```javascript
const renderContextIndicator = () => {
    const messageCount = messages.length;
    const estimatedTokens = messageCount * 500; // Rough estimate
    
    return (
        <div className="context-indicator">
            <span className="icon">💬</span>
            <span className="count">{messageCount} messages</span>
            <span className="tokens">~{estimatedTokens} tokens</span>
            <button onClick={handleClearContext} className="clear-btn">
                Clear context
            </button>
        </div>
    );
};
```

**Estimated Time:** 1-2 hours

---

#### **3.2 Context Reset Command**

**Add `/reset` command:**

```javascript
const handleSendMessage = async () => {
    const userMessage = input.trim();
    
    // Check for reset command
    if (userMessage === '/reset' || userMessage === '/clear') {
        const confirmed = confirm('Clear all chat history and start fresh?');
        if (confirmed) {
            await clearChatHistory(postId);
            setMessages([]);
            addSystemMessage('✨ Context cleared. Starting fresh conversation.');
        }
        setInput('');
        return;
    }
    
    // Normal message handling...
};
```

**Estimated Time:** 1 hour

---

#### **3.3 Settings: Context Mode**

**Add setting for context management:**

```php
// In class-settings.php
<div class="wpaw-field-row">
    <div class="wpaw-field-label">
        <?php esc_html_e('Chat Context Mode', 'wp-agentic-writer'); ?>
        <small><?php esc_html_e('How to handle chat history', 'wp-agentic-writer'); ?></small>
    </div>
    <div class="wpaw-field-input">
        <select name="wp_agentic_writer_settings[chat_context_mode]">
            <option value="auto" <?php selected($chat_context_mode, 'auto'); ?>>
                Auto (Smart Summarization) - Recommended
            </option>
            <option value="full" <?php selected($chat_context_mode, 'full'); ?>>
                Full (All Messages) - Higher Cost
            </option>
            <option value="minimal" <?php selected($chat_context_mode, 'minimal'); ?>>
                Minimal (Last 2 Only) - Lower Cost
            </option>
        </select>
        <p class="description">
            Auto mode: Summarizes old messages, keeps recent ones. Best balance of cost and quality.
        </p>
    </div>
</div>
```

**Estimated Time:** 1-2 hours

---

## 📊 Implementation Summary

### **Total Estimated Time**

| Phase | Tasks | Time |
|-------|-------|------|
| **Phase 1: Critical Fixes** | 3 tasks | 4-6 hours |
| **Phase 2: Agentic Infrastructure** | 5 tasks | 12-16 hours |
| **Phase 3: UX Enhancements** | 3 tasks | 3-5 hours |
| **Testing & QA** | All features | 4-6 hours |
| **Documentation** | User guide updates | 2-3 hours |
| **TOTAL** | | **25-36 hours** |

### **Cost Impact**

| Component | Cost per Article | Frequency | Monthly (100 articles) |
|-----------|-----------------|-----------|------------------------|
| Intent detection | $0.00002 | 10× per article | $0.02 |
| Context summarization | $0.0001 | 1× per article | $0.01 |
| Planning (with summary) | $0.003 | 1× per article | $0.30 |
| **Total Added Cost** | | | **$0.33/month** |

**Benefit:** Better quality + Language support + Better UX

---

## ✅ Implementation Checklist

### **Phase 1: Critical Fixes** 🔴

**Backend:**
- [ ] Add chatHistory to handle_execute_article()
- [ ] Add chatHistory to handle_refine_block()
- [ ] Add chatHistory to handle_generate_meta()
- [ ] Build chat history context helper method

**Frontend:**
- [ ] Add chatHistory to all API payloads
- [ ] Add Writing mode empty state
- [ ] Add Writing mode guidance
- [ ] Add Writing mode notes warning
- [ ] Add CSS for empty states

**Testing:**
- [ ] Test Chat → Writing mode context
- [ ] Test block refinement context
- [ ] Test Writing mode without plan
- [ ] Test Writing mode notes

---

### **Phase 2: Agentic Infrastructure** 🟡

**Backend:**
- [ ] Add /summarize-context endpoint
- [ ] Add /detect-intent endpoint
- [ ] Update cost tracking for new operations
- [ ] Test endpoints in multiple languages

**Frontend:**
- [ ] Add summarizeChatHistory() function
- [ ] Add buildOptimizedContext() function
- [ ] Add detectUserIntent() function
- [ ] Add handleMessageSent() with intent detection
- [ ] Add renderContextualAction() component
- [ ] Add CSS for contextual actions
- [ ] Update handleCreateOutline() to use optimization

**Testing:**
- [ ] Test summarization (short/long history)
- [ ] Test intent detection (all intents)
- [ ] Test contextual actions display
- [ ] Test in English, Indonesian, Arabic
- [ ] Verify cost tracking

---

### **Phase 3: UX Enhancements** 🟢

**Frontend:**
- [ ] Add context indicator component
- [ ] Add /reset command
- [ ] Add context clear confirmation

**Backend:**
- [ ] Add chat_context_mode setting
- [ ] Add setting sanitization
- [ ] Add setting UI

**Testing:**
- [ ] Test context indicator
- [ ] Test /reset command
- [ ] Test context mode settings

---

## 🚀 Deployment Plan

### **Step 1: Phase 1 (Critical Fixes)**
- Deploy to staging
- Test all critical flows
- Fix any issues
- Deploy to production

### **Step 2: Phase 2 (Agentic Infrastructure)**
- Deploy to staging
- Test AI-powered features
- Monitor costs
- Verify multilingual support
- Deploy to production

### **Step 3: Phase 3 (UX Enhancements)**
- Deploy to staging
- Test UX improvements
- Gather user feedback
- Deploy to production

### **Step 4: Documentation**
- Update README
- Update user guide
- Add context management section
- Document new features

---

## 📈 Success Metrics

### **Technical Metrics**
- ✅ Chat history sent to 100% of endpoints
- ✅ Context summarization working in 5+ languages
- ✅ Intent detection accuracy > 80%
- ✅ Token reduction: 60-70%
- ✅ Cost increase: < $0.50/month per 100 articles

### **UX Metrics**
- ✅ Users can complete article without mode confusion
- ✅ Contextual actions shown at right time
- ✅ No silent failures (all errors shown)
- ✅ Smooth transitions between modes

### **Quality Metrics**
- ✅ AI responses maintain context
- ✅ Block refinements understand original intent
- ✅ Meta descriptions use article context
- ✅ Outlines reflect full conversation

---

## 🎯 Next Steps

1. **Review this plan** - Confirm approach and priorities
2. **Start Phase 1** - Fix critical context loss issues
3. **Test thoroughly** - Verify fixes work in all scenarios
4. **Deploy Phase 1** - Get critical fixes to production
5. **Begin Phase 2** - Implement agentic infrastructure
6. **Monitor costs** - Track actual cost impact
7. **Iterate** - Adjust based on real-world usage

---

**Status:** 📋 APPROVED - AWAITING IMPLEMENTATION START  
**Priority:** Phase 1 (Critical Fixes) → Phase 2 (Agentic) → Phase 3 (UX)  
**Timeline:** 3-5 weeks for full implementation