Refactoring Assessment: Tags + Interactive Choices

Details

Raw Data

{
  "id": "1b64fdc5-3b93-4b93-a699-07ab875fe3b1",
  "type": "general",
  "status": "completed",
  "title": "Refactoring Assessment: Tags + Interactive Choices",
  "description": "Analysis of what needs changing to add tags and inline choice buttons to kontasks",
  "context": {
    "output": "<div style=\"background:#1e1e1e;color:#e0e0e0;padding:20px;border-radius:8px;font-family:system-ui,-apple-system,sans-serif;\">\n<h2 style=\"color:#fff;margin:0 0 16px 0;\">Refactoring Assessment</h2>\n<p style=\"color:#7f848e;margin:0 0 20px 0;\">What needs to change for tags + inline choice buttons</p>\n\n<h3 style=\"color:#fff;margin:20px 0 12px 0;\">Two Features Requested</h3>\n\n<div style=\"display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px;\">\n<div style=\"background:#1a3a1a;padding:16px;border-radius:6px;border:1px solid #22c55e;\">\n<h4 style=\"color:#22c55e;margin:0 0 8px 0;\">1. Tags/Scope Metadata</h4>\n<p style=\"margin:0;color:#7f848e;font-size:0.9rem;\">Add <code style=\"background:#333;padding:2px 4px;border-radius:2px;\">tags[]</code> and <code style=\"background:#333;padding:2px 4px;border-radius:2px;\">scope</code> to kontasks for filtering between product vs vibetools</p>\n</div>\n<div style=\"background:#2d1a3a;padding:16px;border-radius:6px;border:1px solid #c678dd;\">\n<h4 style=\"color:#c678dd;margin:0 0 8px 0;\">2. Inline Choice Buttons</h4>\n<p style=\"margin:0;color:#7f848e;font-size:0.9rem;\">When Claude asks a question, render clickable options in the kontask card that send the choice back to Claude</p>\n</div>\n</div>\n\n<h3 style=\"color:#fff;margin:20px 0 12px 0;\">Current Architecture</h3>\n\n<div style=\"background:#2d2d2d;padding:16px;border-radius:6px;margin-bottom:16px;\">\n<pre style=\"margin:0;color:#7f848e;font-size:0.85rem;line-height:1.6;\"><span style=\"color:#c678dd;\">Dashboard Console</span>\n    │\n    ├─ User types prompt\n    │\n    ├─ <span style=\"color:#61afef;\">router.ts</span> wraps with \"CRITICAL OUTPUT INSTRUCTIONS\"\n    │   └─ Forces Claude to call <span style=\"color:#98c379;\">konui_create_task</span>\n    │\n    ├─ <span style=\"color:#61afef;\">konsole</span> runs Claude Code CLI\n    │\n    ├─ Claude calls <span style=\"color:#98c379;\">konui_create_task</span> MCP tool\n    │   └─ <span style=\"color:#61afef;\">mcp/server.ts</span> → POST /api/tasks\n    │\n    └─ <span style=\"color:#61afef;\">kontask-db.ts</span> stores to kontasks.jsonl</pre>\n</div>\n\n<h3 style=\"color:#fff;margin:20px 0 12px 0;\">Files That Need Changes</h3>\n\n<table style=\"width:100%;border-collapse:collapse;background:#2d2d2d;border-radius:6px;overflow:hidden;font-size:0.9rem;\">\n<tr style=\"background:#363636;\"><th style=\"text-align:left;padding:10px;color:#fff;\">File</th><th style=\"text-align:left;padding:10px;color:#fff;\">Changes</th><th style=\"text-align:left;padding:10px;color:#fff;\">For</th></tr>\n<tr><td style=\"padding:10px;color:#61afef;\">kontask-types.ts:172</td><td style=\"padding:10px;color:#7f848e;\">Add <code>tags?: string[]</code>, <code>scope?: \"product\" | \"vibetools\"</code></td><td style=\"padding:10px;color:#98c379;\">Tags</td></tr>\n<tr style=\"background:#333;\"><td style=\"padding:10px;color:#61afef;\">kontask-types.ts:205</td><td style=\"padding:10px;color:#7f848e;\">Add to CreateKontaskInput</td><td style=\"padding:10px;color:#98c379;\">Tags</td></tr>\n<tr><td style=\"padding:10px;color:#61afef;\">mcp/server.ts:112</td><td style=\"padding:10px;color:#7f848e;\">Add tags, scope to tool schema</td><td style=\"padding:10px;color:#98c379;\">Tags</td></tr>\n<tr style=\"background:#333;\"><td style=\"padding:10px;color:#61afef;\">router.ts:1080</td><td style=\"padding:10px;color:#7f848e;\">Update CRITICAL OUTPUT template to include scope</td><td style=\"padding:10px;color:#98c379;\">Tags</td></tr>\n<tr><td style=\"padding:10px;color:#61afef;\">kontask-detail.ts</td><td style=\"padding:10px;color:#7f848e;\">Display tags, allow editing</td><td style=\"padding:10px;color:#98c379;\">Tags UI</td></tr>\n<tr style=\"background:#333;\"><td style=\"padding:10px;color:#61afef;\">kontasks.ts</td><td style=\"padding:10px;color:#7f848e;\">Filter by scope/tags in list view</td><td style=\"padding:10px;color:#98c379;\">Tags UI</td></tr>\n<tr><td style=\"padding:10px;color:#61afef;\">kontask-types.ts:116</td><td style=\"padding:10px;color:#7f848e;\">Add <code>choices?: ChoiceOption[]</code> to KontaskLayout</td><td style=\"padding:10px;color:#c678dd;\">Choices</td></tr>\n<tr style=\"background:#333;\"><td style=\"padding:10px;color:#61afef;\">dashboard-console.ts</td><td style=\"padding:10px;color:#7f848e;\">Render choice buttons, send selection back</td><td style=\"padding:10px;color:#c678dd;\">Choices</td></tr>\n</table>\n\n<h3 style=\"color:#fff;margin:20px 0 12px 0;\">The Inline Choices Challenge</h3>\n\n<div style=\"background:#2d2d2d;padding:16px;border-radius:6px;margin-bottom:16px;border-left:4px solid #f97316;\">\n<h4 style=\"color:#f97316;margin:0 0 8px 0;\">Current Problem</h4>\n<p style=\"margin:0 0 12px 0;color:#e0e0e0;\">When Claude asks \"Do you want A or B?\", the kontask is created as a static OUTPUT card. The user sees it but has no way to respond <em>within</em> the kontask.</p>\n<p style=\"margin:0;color:#7f848e;\">User has to type their answer manually in the console input box.</p>\n</div>\n\n<div style=\"background:#1a3a1a;padding:16px;border-radius:6px;margin-bottom:16px;border:1px solid #22c55e;\">\n<h4 style=\"color:#22c55e;margin:0 0 8px 0;\">Proposed Solution: Interactive Output Kontasks</h4>\n<p style=\"margin:0 0 12px 0;color:#e0e0e0;\">Add a new kontask pattern: <strong>OUTPUT with CHOICES</strong></p>\n<pre style=\"background:#0d1f0d;padding:12px;border-radius:4px;overflow-x:auto;color:#98c379;font-size:0.85rem;\">{\n  type: \"general\",\n  context: {\n    output: \"&lt;div&gt;...analysis...&lt;/div&gt;\",\n    <span style=\"color:#c678dd;\">choices</span>: [\n      { label: \"Phase A+B (Tags first)\", value: \"tags-first\" },\n      { label: \"Sessions first\", value: \"sessions-first\" }\n    ],\n    requestId: \"...\"\n  }\n}</pre>\n</div>\n\n<div style=\"background:#2d2d2d;padding:16px;border-radius:6px;margin-bottom:16px;\">\n<h4 style=\"color:#61afef;margin:0 0 8px 0;\">How Choice Response Would Work</h4>\n<ol style=\"margin:0;padding-left:20px;color:#e0e0e0;line-height:1.8;\">\n<li>User clicks choice button in kontask card</li>\n<li>Dashboard console captures the choice</li>\n<li>Sends as new prompt: <code style=\"background:#333;padding:2px 4px;border-radius:2px;\">User selected: \"Phase A+B (Tags first)\"</code></li>\n<li>Claude continues with the selected option</li>\n</ol>\n</div>\n\n<h3 style=\"color:#fff;margin:20px 0 12px 0;\">Recommended Order</h3>\n\n<div style=\"background:#2d2d2d;padding:16px;border-radius:6px;margin-bottom:16px;\">\n<table style=\"width:100%;border-collapse:collapse;\">\n<tr><td style=\"padding:8px 0;color:#98c379;font-weight:bold;\">Step 1</td><td style=\"padding:8px 0;color:#e0e0e0;\">Add <code>tags[]</code> and <code>scope</code> to Kontask interface</td><td style=\"padding:8px 0;color:#7f848e;\">~10 lines</td></tr>\n<tr><td style=\"padding:8px 0;color:#98c379;font-weight:bold;\">Step 2</td><td style=\"padding:8px 0;color:#e0e0e0;\">Update MCP tool schema to accept tags/scope</td><td style=\"padding:8px 0;color:#7f848e;\">~15 lines</td></tr>\n<tr><td style=\"padding:8px 0;color:#98c379;font-weight:bold;\">Step 3</td><td style=\"padding:8px 0;color:#e0e0e0;\">Update router.ts prompt template to specify scope</td><td style=\"padding:8px 0;color:#7f848e;\">~5 lines</td></tr>\n<tr><td style=\"padding:8px 0;color:#98c379;font-weight:bold;\">Step 4</td><td style=\"padding:8px 0;color:#e0e0e0;\">Add <code>choices[]</code> to KontaskContext</td><td style=\"padding:8px 0;color:#7f848e;\">~10 lines</td></tr>\n<tr><td style=\"padding:8px 0;color:#98c379;font-weight:bold;\">Step 5</td><td style=\"padding:8px 0;color:#e0e0e0;\">Render choice buttons in dashboard-console.ts</td><td style=\"padding:8px 0;color:#7f848e;\">~40 lines</td></tr>\n<tr><td style=\"padding:8px 0;color:#98c379;font-weight:bold;\">Step 6</td><td style=\"padding:8px 0;color:#e0e0e0;\">Display tags in kontask list/detail views</td><td style=\"padding:8px 0;color:#7f848e;\">~30 lines</td></tr>\n</table>\n</div>\n\n<h3 style=\"color:#fff;margin:20px 0 12px 0;\">No Major Refactoring Needed</h3>\n\n<div style=\"background:#1a3a1a;padding:16px;border-radius:6px;border:1px solid #22c55e;\">\n<p style=\"margin:0 0 8px 0;color:#22c55e;\"><strong>Good news:</strong> The current architecture supports these additions cleanly.</p>\n<ul style=\"margin:8px 0 0 0;padding-left:20px;color:#e0e0e0;line-height:1.8;\">\n<li><code>KontaskContext</code> already has <code>[key: string]: unknown</code> for extensibility</li>\n<li>MCP tool schema just needs new optional fields</li>\n<li>Dashboard console already handles kontask cards - just add button rendering</li>\n<li>No database migration needed (JSONL is schemaless)</li>\n</ul>\n</div>\n\n<div style=\"background:#2d1a3a;padding:16px;border-radius:6px;margin-top:20px;border:1px solid #c678dd;\">\n<h4 style=\"color:#c678dd;margin:0 0 8px 0;\">Start Here?</h4>\n<p style=\"margin:0;color:#e0e0e0;\">Ready to implement Steps 1-3 (tags/scope) now? Then we can add choices (Steps 4-5) and finally the UI display (Step 6).</p>\n<div style=\"display:flex;gap:8px;margin-top:12px;\">\n<button style=\"background:#22c55e;color:#fff;border:none;padding:8px 16px;border-radius:4px;font-weight:bold;cursor:pointer;\" onclick=\"window.sendConsoleChoice && window.sendConsoleChoice('yes-start-tags')\">Yes, start with tags</button>\n<button style=\"background:#333;color:#c678dd;border:1px solid #c678dd;padding:8px 16px;border-radius:4px;font-weight:bold;cursor:pointer;\" onclick=\"window.sendConsoleChoice && window.sendConsoleChoice('show-more-detail')\">Show more detail first</button>\n</div>\n</div>\n</div>",
    "requestedAt": "2026-01-02T20:25:00.000Z",
    "requestId": "77d62ec1-bcc3-4990-aa78-04a76826262a"
  },
  "createdBy": "claude",
  "createdAt": "2026-01-01T20:42:28.393Z",
  "updatedAt": "2026-01-02T05:10:54.075Z",
  "requestId": "77d62ec1-bcc3-4990-aa78-04a76826262a"
}