Kontask Action Buttons Implementation Plan

Details

Raw Data

{
  "id": "1e2687e1-0204-4afc-9010-6f3f7c31dd48",
  "type": "general",
  "status": "completed",
  "title": "Kontask Action Buttons Implementation Plan",
  "description": "Plan for adding clickable action buttons to kontask cards",
  "context": {
    "output": "<div style=\"background:#1e1e1e;color:#e0e0e0;padding:20px;border-radius:8px;font-family:system-ui,-apple-system,sans-serif;\"><h2 style=\"color:#fff;margin:0 0 16px 0;\">Kontask Action Buttons</h2><p style=\"color:#9ca3af;margin-bottom:20px;\">Two related features to reduce typing and improve workflow.</p><div style=\"background:#2d2d2d;padding:16px;border-radius:6px;margin-bottom:16px;\"><h3 style=\"color:#c99542;margin:0 0 12px 0;\">1. \"What's Next\" Action Buttons</h3><p style=\"color:#e0e0e0;margin:0 0 12px 0;\">When Claude creates OUTPUT kontasks with suggested next actions, these should be <strong>clickable buttons</strong> not just text.</p><div style=\"background:#1a1a2e;padding:12px;border-radius:4px;margin:12px 0;\"><p style=\"color:#7f848e;margin:0 0 8px 0;font-size:0.85rem;\">Current (text only):</p><pre style=\"color:#e5c07b;margin:0;font-size:0.85rem;\">What's Next?\n• Run tests to verify?\n• Commit and push changes?\n• Update documentation?</pre></div><div style=\"background:#1a1b2e;padding:12px;border-radius:4px;border:1px solid #c99542;\"><p style=\"color:#c99542;margin:0 0 8px 0;font-size:0.85rem;\">Proposed (buttons):</p><div style=\"display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;\"><span style=\"background:#c99542;color:#151623;padding:6px 12px;border-radius:4px;font-size:0.8rem;cursor:pointer;\">Run tests</span><span style=\"background:#374151;color:#e5e7eb;padding:6px 12px;border-radius:4px;font-size:0.8rem;cursor:pointer;\">Commit changes</span><span style=\"background:#374151;color:#e5e7eb;padding:6px 12px;border-radius:4px;font-size:0.8rem;cursor:pointer;\">Update docs</span></div></div><p style=\"color:#9ca3af;font-size:0.85rem;margin:12px 0 0 0;\"><strong>Implementation:</strong> Extend <code style=\"background:#374151;padding:2px 6px;border-radius:3px;\">context.choices</code> to render as styled buttons. Clicking sends prompt to dashboard.</p></div><div style=\"background:#2d2d2d;padding:16px;border-radius:6px;margin-bottom:16px;\"><h3 style=\"color:#c99542;margin:0 0 12px 0;\">2. Completed Kontask Follow-up Buttons</h3><p style=\"color:#e0e0e0;margin:0 0 12px 0;\">Every completed kontask card in the list/detail view should have quick-action buttons:</p><table style=\"width:100%;border-collapse:collapse;margin:12px 0;\"><tr><th style=\"text-align:left;padding:8px;background:#374151;color:#fff;font-size:0.8rem;\">Button</th><th style=\"text-align:left;padding:8px;background:#374151;color:#fff;font-size:0.8rem;\">Prompt Sent</th></tr><tr><td style=\"padding:8px;border-bottom:1px solid #374151;\"><span style=\"background:#22c55e;color:#fff;padding:3px 8px;border-radius:3px;font-size:0.75rem;\">✓ Verify</span></td><td style=\"padding:8px;border-bottom:1px solid #374151;color:#9ca3af;font-size:0.85rem;\">\"Verify kontask '{title}' was completed correctly\"</td></tr><tr><td style=\"padding:8px;border-bottom:1px solid #374151;\"><span style=\"background:#f97316;color:#fff;padding:3px 8px;border-radius:3px;font-size:0.75rem;\">⚠ Not Working</span></td><td style=\"padding:8px;border-bottom:1px solid #374151;color:#9ca3af;font-size:0.85rem;\">\"Kontask '{title}' is not working as expected - please investigate\"</td></tr><tr><td style=\"padding:8px;border-bottom:1px solid #374151;\"><span style=\"background:#3b82f6;color:#fff;padding:3px 8px;border-radius:3px;font-size:0.75rem;\">📋 Backlog</span></td><td style=\"padding:8px;border-bottom:1px solid #374151;color:#9ca3af;font-size:0.85rem;\">\"Add '{title}' to backlog for later implementation\"</td></tr><tr><td style=\"padding:8px;\"><span style=\"background:#8b5cf6;color:#fff;padding:3px 8px;border-radius:3px;font-size:0.75rem;\">↻ Retry</span></td><td style=\"padding:8px;color:#9ca3af;font-size:0.85rem;\">\"Retry/redo the work from kontask '{title}'\"</td></tr></table></div><div style=\"background:#2d2d2d;padding:16px;border-radius:6px;margin-bottom:16px;\"><h3 style=\"color:#61afef;margin:0 0 12px 0;\">Technical Approach</h3><ol style=\"margin:0;padding-left:20px;line-height:1.8;\"><li><strong>kontask-detail.ts</strong>: Add button row below completed kontask output</li><li><strong>kontasks.ts</strong>: Add small button icons in list view for quick actions</li><li><strong>dashboard-console.ts</strong>: Listen for <code style=\"background:#374151;padding:2px 4px;border-radius:3px;\">kontask-action</code> messages via postMessage or localStorage</li><li><strong>Shared JS</strong>: Helper to navigate to dashboard with pre-filled prompt</li></ol></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;\">Ready to implement. Which should I start with?</p></div></div>",
    "requestedAt": "2026-01-02T10:20:00Z",
    "requestId": "24cd68ba-8ceb-4252-88a3-3351f0ab86cc",
    "choices": [
      {
        "label": "Start with What's Next buttons",
        "value": "whats-next-first",
        "primary": true
      },
      {
        "label": "Start with follow-up buttons",
        "value": "followup-first"
      },
      {
        "label": "Both together",
        "value": "both-together"
      }
    ]
  },
  "createdBy": "claude",
  "createdAt": "2026-01-02T13:56:34.072Z",
  "updatedAt": "2026-01-02T13:56:34.408Z",
  "requestId": "24cd68ba-8ceb-4252-88a3-3351f0ab86cc",
  "scope": "vibetools",
  "tags": [
    "kontasks",
    "ui",
    "ux"
  ],
  "targetUser": "claude"
}