Brandon Zhang 93bce1521b feat(ui): add quick shortcuts panel with add/edit/delete support ...

Adds a compact shortcuts row inside the composer panel for one-click
instruction queuing, with full lifecycle management stored in localStorage.
Features
--------
- Six built-in defaults (Stop, Summarize, Explain error, Undo, Continue, etc.)
- Click any chip → instantly POSTs to /api/instructions, no typing required
  - Cyan border pulse on fire; green glow flash on success
- Edit mode (toggle button in header):
  - Per-chip edit (✏) button → replaces chip with inline input, Enter to save
  - Per-chip delete (✕) button → removes with vanish animation
  - '+ Add' chip → inline form appended below rail
- All changes persisted to localStorage key 'local-mcp-shortcuts'
- Accessible: button elements, aria-labels, keyboard support (Enter/Escape)
Files
-----
- static/js/shortcuts.js   new module (loadShortcuts, renderShortcuts,
                           startInlineEdit, showAddPrompt, initShortcuts)
- static/index.html        #shortcuts-container inside composer .panel-body
- static/js/app.js         import + initShortcuts() in bootstrap()
- static/css/components.css .shortcuts-container, .shortcut-chip variants,
                           .shortcut-inline-edit, keyframes chip-fire/sent/vanish

2026-03-27 13:55:22 +08:00

11 KiB

Raw Blame History

View Raw