Dashboard RECONNECTING Bug Analysis

Details

Raw Data

{
  "id": "f8738258-ddd1-426f-a253-904004337f3b",
  "type": "general",
  "status": "completed",
  "title": "Dashboard RECONNECTING Bug Analysis",
  "description": "Analysis of RECONNECTING stuck + input restoration bugs from screenshots",
  "context": {
    "output": "<div style=\"background:#1e1e1e;color:#e0e0e0;padding:20px;border-radius:8px;font-family:sans-serif;\"><h2 style=\"color:#fff;margin:0 0 16px 0;\">🔍 Dashboard RECONNECTING Bug Analysis</h2><p style=\"color:#9ca3af;margin:0 0 16px 0;\">Analyzed 8 screenshots from 10:15 → 10:23 showing two distinct bugs</p><div style=\"background:#2d2d2d;padding:16px;border-radius:6px;margin-bottom:16px;\"><h3 style=\"color:#f97316;margin:0 0 12px 0;\">Bug 1: RECONNECTING Stuck After \"Done\"</h3><p style=\"color:#e0e0e0;margin:0 0 12px 0;\"><strong>Symptoms:</strong></p><ul style=\"color:#e0e0e0;margin:0 0 12px 0;padding-left:20px;\"><li>10:20 - Shows \"✓ Done\" checkmark but status is \"RECONNECTING... 3m 19s\"</li><li>10:21 - Still \"RECONNECTING... 4m 23s\"</li><li>10:22 - Still \"RECONNECTING... 6m 1s\" (indicator turns red)</li><li>Never transitions to \"Ready\" without manual page reload</li></ul><p style=\"color:#e0e0e0;margin:0 0 8px 0;\"><strong>Root Cause:</strong></p><p style=\"color:#98c379;margin:0;\">The kontask was successfully created and displayed (via <code>checkForNewKontask()</code> in <code>connectEventSource</code>), BUT the draft was never cleared AND the state machine wasn't notified to transition to idle.</p><p style=\"color:#e5c07b;margin:12px 0 0 0;\"><strong>Location:</strong> <code>console-streaming.ts:170-175</code></p><pre style=\"background:#1e1e1e;padding:12px;border-radius:4px;margin-top:8px;font-family:monospace;font-size:13px;overflow-x:auto;\"><span style=\"color:#7f848e;\">// Current code - dispatches stream_end but doesn't clear draft</span>\nconst hadOutput = await checkForNewKontask();\nif (hadOutput) {\n  <span style=\"color:#61afef;\">dispatch</span>({ <span style=\"color:#e5c07b;\">type</span>: <span style=\"color:#98c379;\">'stream_end'</span>, <span style=\"color:#e5c07b;\">hadOutput</span>: <span style=\"color:#c678dd;\">true</span> });\n  <span style=\"color:#7f848e;\">// Missing: clearDraft() call!</span>\n}</pre></div><div style=\"background:#2d2d2d;padding:16px;border-radius:6px;margin-bottom:16px;\"><h3 style=\"color:#f97316;margin:0 0 12px 0;\">Bug 2: Input Field Restores Old Prompt</h3><p style=\"color:#e0e0e0;margin:0 0 12px 0;\"><strong>Symptoms:</strong></p><ul style=\"color:#e0e0e0;margin:0 0 12px 0;padding-left:20px;\"><li>10:23 - After completion, input shows \"Show me the project file tree\"</li><li>This is the PREVIOUS prompt, not a new one</li><li>User has to manually clear it before typing new request</li></ul><p style=\"color:#e0e0e0;margin:0 0 8px 0;\"><strong>Root Cause:</strong></p><p style=\"color:#98c379;margin:0;\">The <code>loadDraft()</code> function runs on page init (line 121) and restores whatever was in localStorage. The draft is only cleared in <code>sendPrompt()</code> AFTER the prompt is sent (line 71), but if the page reloads mid-stream, the draft persists.</p><p style=\"color:#e5c07b;margin:12px 0 0 0;\"><strong>Flow problem:</strong></p><ol style=\"color:#e0e0e0;margin:0;padding-left:20px;\"><li>User types prompt → <code>saveDraft()</code> saves to localStorage</li><li>User sends prompt → <code>clearDraft()</code> removes it</li><li>Stream completes successfully → kontask found</li><li>User navigates away, comes back</li><li>Page reloads → <code>loadDraft()</code> restores... wait, it should be empty?</li></ol><p style=\"color:#c678dd;margin:12px 0 0 0;\"><strong>Actually:</strong> The issue is that after stream completion, if there's a draft saved during the NEXT typing session, and user navigates away before sending, it restores that. But the screenshots show something else...</p></div><div style=\"background:#2d2d2d;padding:16px;border-radius:6px;margin-bottom:16px;\"><h3 style=\"color:#61afef;margin:0 0 12px 0;\">📋 Screenshot Timeline Analysis</h3><table style=\"width:100%;color:#e0e0e0;font-size:14px;border-collapse:collapse;\"><tr style=\"border-bottom:1px solid #444;\"><th style=\"padding:8px;text-align:left;\">Time</th><th style=\"padding:8px;text-align:left;\">Status Bar</th><th style=\"padding:8px;text-align:left;\">Input Field</th><th style=\"padding:8px;text-align:left;\">Content</th></tr><tr><td style=\"padding:8px;\">10:15</td><td style=\"padding:8px;\"><span style=\"color:#4caf50;\">● READY</span></td><td style=\"padding:8px;\">Empty placeholder</td><td style=\"padding:8px;\">Previous file_tree kontask</td></tr><tr><td style=\"padding:8px;\">10:20</td><td style=\"padding:8px;\"><span style=\"color:#f97316;\">● RECONNECTING 3m19s</span></td><td style=\"padding:8px;\">\"Draft your next message...\"</td><td style=\"padding:8px;\">Project tree + ✓ Done</td></tr><tr><td style=\"padding:8px;\">10:21</td><td style=\"padding:8px;\"><span style=\"color:#f97316;\">● RECONNECTING 4m23s</span></td><td style=\"padding:8px;\">\"Draft your next message...\"</td><td style=\"padding:8px;\">Same</td></tr><tr><td style=\"padding:8px;\">10:22</td><td style=\"padding:8px;\"><span style=\"color:#ef4444;\">● RECONNECTING 6m1s</span></td><td style=\"padding:8px;\">\"Draft your next message...\"</td><td style=\"padding:8px;\">Same</td></tr><tr><td style=\"padding:8px;\">10:23</td><td style=\"padding:8px;\"><span style=\"color:#4caf50;\">● READY</span></td><td style=\"padding:8px;\"><strong>\"Show me the project file tree\"</strong></td><td style=\"padding:8px;\">After manual reload</td></tr></table></div><div style=\"background:#2d2d2d;padding:16px;border-radius:6px;margin-bottom:16px;\"><h3 style=\"color:#4caf50;margin:0 0 12px 0;\">✅ The Fix</h3><p style=\"color:#e0e0e0;margin:0 0 12px 0;\">Two changes needed in <code>console-streaming.ts</code>:</p><pre style=\"background:#1e1e1e;padding:12px;border-radius:4px;font-family:monospace;font-size:13px;overflow-x:auto;\"><span style=\"color:#7f848e;\">// After stream completes with output (line ~170-179)</span>\nconst hadOutput = await checkForNewKontask();\nif (hadOutput) {\n  log('info', 'stream', 'Output received after stream');\n  dispatch({ type: 'stream_end', hadOutput: true });\n  <span style=\"color:#98c379;\">clearDraft(); // ADD THIS - clear any saved draft</span>\n  saveHistory();\n  await refreshKontasks();\n}\n\n<span style=\"color:#7f848e;\">// Also add clearDraft() in reconnectWithEventSource</span>\n<span style=\"color:#7f848e;\">// when kontask_found or stream_end is dispatched</span></pre></div><div style=\"background:#2d2d2d;padding:16px;border-radius:6px;font-family:sans-serif;\"><h4 style=\"margin:0 0 8px 0;color:#fff;\">What's Next?</h4><p style=\"color:#9ca3af;margin:0;\">Choose an action:</p></div>",
    "requestedAt": "2026-01-03T10:30:00Z",
    "requestId": "158765e6-8926-46c0-af5c-dd997fa28b38",
    "choices": [
      {
        "label": "Apply fix",
        "value": "Apply the clearDraft() fix to console-streaming.ts to fix the RECONNECTING and input restoration bugs",
        "primary": true
      },
      {
        "label": "Run tests first",
        "value": "Run konui tests before making changes"
      },
      {
        "label": "Investigate more",
        "value": "Show me more details about the stream completion flow"
      }
    ]
  },
  "createdBy": "claude",
  "createdAt": "2026-01-03T00:28:07.872Z",
  "updatedAt": "2026-01-03T00:28:08.010Z",
  "requestId": "158765e6-8926-46c0-af5c-dd997fa28b38",
  "scope": "vibetools",
  "tags": [
    "console",
    "bug-analysis",
    "state-machine"
  ],
  "targetUser": "claude"
}