Console Files >250 Lines - Refactor Plan

Output

Console Files >250 Lines - Refactor Plan

Files Requiring Refactoring (7)

console-state-machine.ts	618	Server-side state machine
console-renderers.ts	513	Rich output renderers
console-state.ts	498	Client-side state machine
console-ui.ts	436	DOM helpers, UI functions
console-storage.ts	416	localStorage functions
console-streaming.ts	323	SSE streaming
console-stream.ts	285	Stream config/parsing

Proposed Splits

1. console-state-machine.ts (618 → ~200 each)

console-sm-types.ts - Types, interfaces (~50)
console-sm-transitions.ts - transition() function (~300)
console-sm-helpers.ts - shouldRecover, isStalled, getStatus* (~100)

2. console-renderers.ts (513 → ~170 each)

console-render-diff.ts - renderDiff + script (~100)
console-render-files.ts - renderFileList, renderSearchResults (~150)
console-render-shell.ts - renderShellOutput, renderTodoList (~150)

3. console-state.ts (498 → ~160 each)

console-state-init.ts - Initial state, dispatch (~80)
console-state-transitions.ts - smTransition() (~200)
console-state-effects.ts - Effect executor, status bar (~150)

4. console-ui.ts (436 → ~145 each)

console-ui-dom.ts - DOM elements, append functions (~140)
console-ui-progress.ts - Todo progress UI (~100)
console-ui-status.ts - Status bar, heartbeat (~120)

5. console-storage.ts (416 → ~140 each)

console-storage-pending.ts - Pending state (~100)
console-storage-progress.ts - Todo progress, draft (~120)
console-storage-history.ts - History, deleted kontexts (~120)

6-7. Leave as-is (borderline)

console-streaming.ts (323) and console-stream.ts (285) are close to 250 and cohesive. Could leave them or do light splits.

What's Next?

This would create ~15 additional modules. Want me to proceed with all 5 major splits, or start with just the largest files (state-machine, renderers)?

Quick Actions

Original Request

No layout configured

Details

Type General

Status Completed

Scope vibetools

Tags consolerefactoringplan

Created 3 Jan 2026, 2:08 am

Updated 3 Jan 2026, 2:08 am

Created By claude

Raw Data

{
  "id": "b64ffc4d-8518-40a6-88b7-ebc8c1aa822b",
  "type": "general",
  "status": "completed",
  "title": "Console Files >250 Lines - Refactor Plan",
  "description": "7 files over 250 lines need further modularization",
  "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;\">Console Files >250 Lines - Refactor Plan</h2><div style=\"background:#2d2d2d;padding:16px;border-radius:6px;margin-bottom:16px;\"><h4 style=\"margin:0 0 12px 0;color:#f97316;\">Files Requiring Refactoring (7)</h4><table style=\"width:100%;border-collapse:collapse;font-family:monospace;font-size:0.9rem;\"><tr style=\"border-bottom:1px solid #444;\"><td style=\"padding:8px;color:#e5c07b;\">console-state-machine.ts</td><td style=\"padding:8px;color:#ef4444;font-weight:bold;\">618</td><td style=\"padding:8px;color:#7f848e;\">Server-side state machine</td></tr><tr style=\"border-bottom:1px solid #444;\"><td style=\"padding:8px;color:#e5c07b;\">console-renderers.ts</td><td style=\"padding:8px;color:#f97316;font-weight:bold;\">513</td><td style=\"padding:8px;color:#7f848e;\">Rich output renderers</td></tr><tr style=\"border-bottom:1px solid #444;\"><td style=\"padding:8px;color:#e5c07b;\">console-state.ts</td><td style=\"padding:8px;color:#f97316;font-weight:bold;\">498</td><td style=\"padding:8px;color:#7f848e;\">Client-side state machine</td></tr><tr style=\"border-bottom:1px solid #444;\"><td style=\"padding:8px;color:#e5c07b;\">console-ui.ts</td><td style=\"padding:8px;color:#eab308;font-weight:bold;\">436</td><td style=\"padding:8px;color:#7f848e;\">DOM helpers, UI functions</td></tr><tr style=\"border-bottom:1px solid #444;\"><td style=\"padding:8px;color:#e5c07b;\">console-storage.ts</td><td style=\"padding:8px;color:#eab308;font-weight:bold;\">416</td><td style=\"padding:8px;color:#7f848e;\">localStorage functions</td></tr><tr style=\"border-bottom:1px solid #444;\"><td style=\"padding:8px;color:#e5c07b;\">console-streaming.ts</td><td style=\"padding:8px;color:#22c55e;font-weight:bold;\">323</td><td style=\"padding:8px;color:#7f848e;\">SSE streaming</td></tr><tr><td style=\"padding:8px;color:#e5c07b;\">console-stream.ts</td><td style=\"padding:8px;color:#22c55e;font-weight:bold;\">285</td><td style=\"padding:8px;color:#7f848e;\">Stream config/parsing</td></tr></table></div><div style=\"background:#2d2d2d;padding:16px;border-radius:6px;margin-bottom:16px;\"><h4 style=\"margin:0 0 12px 0;color:#61afef;\">Proposed Splits</h4><div style=\"margin-bottom:16px;\"><h5 style=\"color:#e5c07b;margin:0 0 8px 0;\">1. console-state-machine.ts (618 → ~200 each)</h5><ul style=\"margin:0;padding-left:20px;color:#9ca3af;line-height:1.8;\"><li><span style=\"color:#98c379;\">console-sm-types.ts</span> - Types, interfaces (~50)</li><li><span style=\"color:#98c379;\">console-sm-transitions.ts</span> - transition() function (~300)</li><li><span style=\"color:#98c379;\">console-sm-helpers.ts</span> - shouldRecover, isStalled, getStatus* (~100)</li></ul></div><div style=\"margin-bottom:16px;\"><h5 style=\"color:#e5c07b;margin:0 0 8px 0;\">2. console-renderers.ts (513 → ~170 each)</h5><ul style=\"margin:0;padding-left:20px;color:#9ca3af;line-height:1.8;\"><li><span style=\"color:#98c379;\">console-render-diff.ts</span> - renderDiff + script (~100)</li><li><span style=\"color:#98c379;\">console-render-files.ts</span> - renderFileList, renderSearchResults (~150)</li><li><span style=\"color:#98c379;\">console-render-shell.ts</span> - renderShellOutput, renderTodoList (~150)</li></ul></div><div style=\"margin-bottom:16px;\"><h5 style=\"color:#e5c07b;margin:0 0 8px 0;\">3. console-state.ts (498 → ~160 each)</h5><ul style=\"margin:0;padding-left:20px;color:#9ca3af;line-height:1.8;\"><li><span style=\"color:#98c379;\">console-state-init.ts</span> - Initial state, dispatch (~80)</li><li><span style=\"color:#98c379;\">console-state-transitions.ts</span> - smTransition() (~200)</li><li><span style=\"color:#98c379;\">console-state-effects.ts</span> - Effect executor, status bar (~150)</li></ul></div><div style=\"margin-bottom:16px;\"><h5 style=\"color:#e5c07b;margin:0 0 8px 0;\">4. console-ui.ts (436 → ~145 each)</h5><ul style=\"margin:0;padding-left:20px;color:#9ca3af;line-height:1.8;\"><li><span style=\"color:#98c379;\">console-ui-dom.ts</span> - DOM elements, append functions (~140)</li><li><span style=\"color:#98c379;\">console-ui-progress.ts</span> - Todo progress UI (~100)</li><li><span style=\"color:#98c379;\">console-ui-status.ts</span> - Status bar, heartbeat (~120)</li></ul></div><div style=\"margin-bottom:16px;\"><h5 style=\"color:#e5c07b;margin:0 0 8px 0;\">5. console-storage.ts (416 → ~140 each)</h5><ul style=\"margin:0;padding-left:20px;color:#9ca3af;line-height:1.8;\"><li><span style=\"color:#98c379;\">console-storage-pending.ts</span> - Pending state (~100)</li><li><span style=\"color:#98c379;\">console-storage-progress.ts</span> - Todo progress, draft (~120)</li><li><span style=\"color:#98c379;\">console-storage-history.ts</span> - History, deleted kontexts (~120)</li></ul></div><div><h5 style=\"color:#e5c07b;margin:0 0 8px 0;\">6-7. Leave as-is (borderline)</h5><p style=\"color:#9ca3af;margin:0;\">console-streaming.ts (323) and console-stream.ts (285) are close to 250 and cohesive. Could leave them or do light splits.</p></div></div><div style=\"background:#2d2d2d;padding:16px;border-radius:6px;\"><h4 style=\"margin:0 0 8px 0;color:#fff;\">What's Next?</h4><p style=\"color:#9ca3af;margin:0;\">This would create ~15 additional modules. Want me to proceed with all 5 major splits, or start with just the largest files (state-machine, renderers)?</p></div></div>",
    "requestedAt": "2026-01-03T05:25:00.000Z",
    "requestId": "5376ec16-8c43-4cc3-b7b4-10977bd41d69",
    "choices": [
      {
        "label": "Split all 5 major files",
        "value": "split-all-five",
        "primary": true
      },
      {
        "label": "Just largest 2 (state-machine, renderers)",
        "value": "split-two-largest"
      },
      {
        "label": "Skip - good enough",
        "value": "skip-refactor"
      }
    ]
  },
  "createdBy": "claude",
  "createdAt": "2026-01-02T16:08:17.596Z",
  "updatedAt": "2026-01-02T16:08:17.770Z",
  "requestId": "5376ec16-8c43-4cc3-b7b4-10977bd41d69",
  "scope": "vibetools",
  "tags": [
    "console",
    "refactoring",
    "plan"
  ],
  "targetUser": "claude"
}