Add TendrilCard widget and Kanban board view in JobsApp#1306
Draft
dcrjodle wants to merge 7 commits into
Draft
Conversation
Introduces a custom TendrilCard widget and uses it to render a Kanban board of jobs alongside the existing data table. TendrilCard (Ivy.Tendril.Widgets): - C# [ExternalWidget] record with core fields: title, type badge + icon, assignee avatar (initials + color), and a footer description line; plus an OnClick event. Fluent setters use a With* prefix to avoid colliding with same-named framework extension methods (MenuItem.Badge, Card.Footer/Title). - React component + scoped CSS matching the board card design; Lucide badge icon resolved by name, avatar color derived from initials when unset. - Registered in the widgets frontend bundle; demo app under .samples. JobsApp (Ivy.Tendril): - New Table/Board tab toggle. The Board groups jobs by JobStatus and renders each as a TendrilCard (type -> badge, project -> avatar, plan title -> title, status/timer -> footer). Drag-to-move updates status; click opens the output sheet. The existing data table is unchanged and remains the default view. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
dcrjodle
marked this pull request as draft
June 22, 2026 13:48
…l-card-kanban-board # Conflicts: # src/Ivy.Tendril.Widgets/frontend/src/index.ts
Card: status icon tile (spinner/eye), tinted project pill, "..." actions menu, bold title, muted status line with leading icon, and a footer meta row (plan id, duration, tokens). Board maps job/plan state to the new props and pulls time/token spend from the active or latest finished job. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Card widget: drop the border (shadow only), fix the title to two lines with ellipsis truncation, and split the meta row into a lead item (plan id) on the left and a trailing time/tokens group on the right. Plan-id meta is now a clickable button firing OnMetaClick. Board: columns are Planning, Draft, Implementing, Review (PR folded into Review). A plan an ExecutePlan/RetryPlan job is working on stays in Implementing through its brief Creating window so the card no longer flashes into Planning and vanishes. Dragging a Draft card into Implementing starts execution; the plan-id meta opens the plan sheet. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
- Draft->Planning opens Update dialog, Implementing->Draft stops the job, Review->Implementing opens Request Changes (drags now reach the handler via the KanbanBuilder enum-conversion fix in Ivy-Framework) - Planning/Implementing cards get Stop/Debug/Restart/Delete menu; Review/PR cards get the ReviewApp actions incl. Create PR - New PR column as done column for reviewed plans with open PRs - Draft card click opens the plan sheet instead of DraftsApp - TendrilCard ticks elapsed time client-side via TimerStartedAt - Card styling: 12px radius, subtler shadows, title weight 500 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
- TendrilCard gains a Selected prop: 5% info-tinted background and a full info-colored border; the board marks the card whose detail sheet is open and clears it when the sheet closes - Card hover now tints the background and lifts the shadow; base shadow opacity/blur bumped slightly - Every Planning-column card is deletable: plan cards with no backing job get a Delete-only menu opening the delete-plan dialog Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Staging preview |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Adds a custom
TendrilCardwidget and uses it to render a Kanban board of jobs in JobsApp, matching the Tendril card-board design. Pairs with the column-chrome restyle in Ivy-Framework#4624 — the framework PR styles the columns; this one supplies the card bodies.TendrilCard(Ivy.Tendril.Widgets)TendrilCard.cs):[ExternalWidget]record with core fields — title, type badge + icon, assignee avatar (initials + color), footer description line — plus anOnClickevent. Fluent setters use aWith*prefix to avoid colliding with same-named framework extension methods (MenuItem.Badge,Card.Footer/Title).frontend/src/TendrilCard/): React component + scoped CSS matching the card design. Badge icon resolved by Lucide name; avatar color derived from initials when none is given. Registered in the widget bundle (frontend/src/index.ts)..samples/Apps/TendrilCard/DemoApp.cs): standalone board reproducing the screenshot data.JobsApp (Ivy.Tendril)
JobsApp.cs,JobsApp.Board.cs). The Board groups jobs byJobStatusand renders each as aTendrilCard(type → badge, project → avatar w/ its configured color, plan title → title, status/timer → footer). Drag-to-move updates job status; clicking a card opens its output sheet.Verification
dotnet build src/Ivy.Tendril/Ivy.Tendril.csproj -p:IvySource=true→ 0 errors, 0 warnings.TendrilCard/tc-cardincluded;dotnet formatclean.🤖 Generated with Claude Code