Skip to content

feat(islands): add board.kanban with browser update actions - #46

Merged
lukaisailovic merged 1 commit into
mainfrom
lukaisailovic/kanban
Jul 20, 2026
Merged

feat(islands): add board.kanban with browser update actions#46
lukaisailovic merged 1 commit into
mainfrom
lukaisailovic/kanban

Conversation

@lukaisailovic

Copy link
Copy Markdown
Owner

Summary

Adds a built-in board.kanban island: a full-bleed kanban board (content.editor-style workspace surface) that groups dataset rows into columns and persists card moves through a manifest update action from the browser.

Island config (happy path)

{
  "type": "board.kanban",
  "dataset": "incidents",
  "key": "incident_id",
  "column": "status",
  "titleField": "title",
  "columns": ["investigating", "monitoring", "resolved"],  // optional; empty columns still render
  "details": ["severity", "service"],                       // optional card meta
  "action": "move_incident",                               // mode: "update" action
  "span": 12
}
  • Required: dataset, key, column, titleField
  • Moves: drag-and-drop (HTML5) or per-card column <select> → POST { action, match, set } → live dataset refresh
  • View-only: omit action or set readOnly: true
  • Validate: missing bindings name the island; action must be mode: "update" on the same dataset

Interactions

Action Behavior
Drag card to column Updates status via update action
Column select on card Same write path (keyboard-accessible)
No action / readOnly Moves disabled; board still groups & renders

Same-column reorder is visual-only / not required (no sort field persistence).

ReUI decision

ReUI kanban was reviewed as a reference for interaction structure (columns, cards, drag overlay). We did not vendor ReUI/shadcn components — OpenIslands UI is Kumo. Implementation uses Kumo tokens + native HTML5 DnD + a select for a11y, with pure buildBoard / planCardMove helpers unit-tested without a DOM.

Runtime write path

/api/action was insert-only; it now dispatches by manifest action mode:

  • insert{ action, row } (form.entry, unchanged)
  • update{ action, match, set } (board.kanban moves)

Shares insertRows / updateRows with MCP so validation + checkpoints stay identical.

Try it

pnpm install && pnpm build
node_modules/.bin/tsx packages/cli/src/index.ts serve apps/examples
# open Operations → "Incident board"
# drag a card or use the column select; data/incidents.csv updates live

Skeleton: openislands add board.kanban (or CLI islandSkeleton("board.kanban")).

Wiring

  • Schema + spans + describe copy
  • Compiler islandRequirements + action mode check
  • Runtime renderer + full-bleed tile path
  • CLI skeleton
  • Docs / skill catalog + ops example

Test plan

  • pnpm build && pnpm typecheck && pnpm test && pnpm lint
  • pnpm validate:templates
  • Schema parse + pure buildBoard / planCardMove unit tests
  • submitAction update path rewrites CSV (runtime action tests)
  • Compiler binding + wrong-mode action failures name board.kanban
  • openislands validate apps/examples — operations board OK
  • Manual: serve examples, move a card on Incident board, confirm CSV + live refresh

Add a full-bleed kanban island that groups rows by a column field and
persists card moves through a manifest update action. Extend /api/action
to support match+set updates (insert remains for form.entry). Dogfood on
the operations example Incident board.
@lukaisailovic
lukaisailovic merged commit 12619ac into main Jul 20, 2026
2 checks passed
@lukaisailovic
lukaisailovic deleted the lukaisailovic/kanban branch July 20, 2026 09:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant