feat(workflow-editor): add real WorkflowRun canvas - #190
Merged
Conversation
The workflow editor needs a maintained graph renderer for its controlled canvas. Add @xyflow/react and record its exact dependency closure in the lockfile. The frontend can build the editor without loading graph code on unrelated routes.
The backend binds every Character to the WorkflowRun that produced it. Map and serialize workflow_run_id, then update typed fixtures that consume Character. Editors can select the correct character without guessing from project order.
The existing contract text omitted the backend ownership field and described a missing run property. Document workflow_run_id and the action outfit lookup through the bound Character. Future adapters have an accurate source of truth for character and outfit identity.
The editor must recover one persisted WorkflowRun through the main repository interfaces. Compose the controller with project context, the run-bound Character, and an explicit Generation failure boundary. Production routes no longer depend on demo data or a second workflow state machine.
The production editor needs to project persisted workflow state without owning business transitions. Render six system node types and parallel action branches through one controlled React Flow canvas. Commands, recovery paths, and transient UI state remain bounded by WorkflowController and the active run.
React Flow should not increase the initial bundle cost of unrelated application routes. Load the editor behind Suspense while preserving both protected WorkflowRun route forms. Authenticated deep links keep their existing behavior and load the canvas only when requested.
Manual editor submissions need to persist the configured prompt before generation. Allow configuring nodes to override their input while keeping completed nodes immutable. Generation receives only canonical fields from the persisted setup snapshot.
Manual WorkflowRun entry needs an editable prompt before the setup node is fixed. Render a controlled description field and submit its value through WorkflowController. The form becomes read-only after persistence and keeps the existing visual system.
The manual setup path must persist edited input without changing the generation payload shape. Exercise the real page and controller from form entry through the fixed setup state. Exact payload assertions prevent UI-only success and accidental nested fields.
The UI change needs reviewer-visible desktop and mobile evidence. Add screenshots from the current canvas renderer with blank image placeholders. Reviewers can verify the six-node layout without shipping screenshot mock code.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
![fennoai[bot]](https://avatars.githubusercontent.com/in/1924301?s=60&v=4){kind=small}
xyh202131
approved these changes
Aug 10, 2026
Approved animations must become durable Character assets before review state advances. Upsert the reviewed branch into its existing Outfit through the Character API boundary. Retries keep one stable Action ID and reject mismatched Generation results.
Character publication needs contract coverage for the nested asset tree. Exercise action mapping, retry replacement, and Generation ownership guards. The tests prevent duplicate or cross-workflow assets from being persisted.
Review approval must not advance before the Character asset is durable. Exercise the session orchestration and the page command boundary. The tests keep publication failures from producing a passed review node.
Character publication should not rely on unrelated WorkflowRun or busy-state renders. Return the published Character to page state and limit action updates to the asset tree. The editor preserves character metadata and removes the unused export surface.
Asset publication needs regression coverage independent of review persistence. Exercise preserved character metadata and page state after an approval failure. The tests prevent getter-based refresh coupling from returning.
Generation results were keyed by node id alone, so a node holding two tasks silently kept only the last one. Deleted nodes still issued reads, every command reset the viewport, and a single busy slot let a second branch unlock the first mid-flight. Key generation reads by node and role, skip deleted nodes, refit the view only when the node set changes, and hold busy branches in a set. Four ad-hoc race guards collapse into one AbortController per session and one per read. Regression tests cover each case, including two parallel branches keeping their own locks. Pass-through wrappers and swapped variable names are gone.
The editor shipped the only page-level stylesheet in the frontend, while index.css states that everything outside it goes through Tailwind utilities. It also carried its own palette of near-identical greens spread across the sheet and the node data. Move layout, card, menu and boundary styles onto the elements as utility classes. The stylesheet keeps only what utilities cannot express: the shared colour variables, React Flow internal overrides, edge states and keyframes. The sheet drops from 487 to 76 lines with no visual change, verified by comparing rendered screenshots before and after. Nested main landmarks become plain containers.
…dates The controller emits on every persist, and the page answered each emit by re-reading every generation the run refers to. With four action branches a single click issued a dozen GETs for results that had not changed. Keep settled results in a map keyed by task id and serve them from there. Tasks still pending or running are read again, since their status is what the canvas is waiting on, and the map is dropped when the run changes. A probe over one main line plus three action branches drops from seven reads per command to zero, while the first load still costs seven.
nighca
reviewed
Aug 11, 2026
nighca
approved these changes
Aug 11, 2026
9 tasks
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
3 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.
将 Workflow Editor 从占位页面切换到真实 WorkflowRun / WorkflowController 会话，并提供六类卡片画布、角色设定表单、多动作分支与审核后的 Character 资产发布。
Why
main中 Workflow Editor 仍是占位页面，无法从真实 WorkflowRun 恢复。继续依赖临时演示数据会掩盖角色归属、节点恢复、错误重试和接口边界问题；仅通过审核而不落入 Character 资产树，也会让流程状态与资产库失去一致性。Changes
workflow_run_id绑定单角色画布，避免按项目角色顺序猜测。Implementation
workflow_run_id读取唯一绑定；重复绑定会明确失败。features/export边界调用 Character API，页面不直接写 Character，Controller 继续保持不包含发布逻辑。Verification
npm test -- --run src/features/export/index.test.ts src/pages/workflow-editor/runtime.test.ts src/pages/workflow-editor/index.test.tsx：3 files / 26 tests 通过npm run typecheck：通过oxfmt --check通过oxlint通过git diff --check通过Screenshots
截图使用临时六节点会话展示当前 renderer；图片区域为空白占位，临时预览代码未提交。
Scope
workflow_run_id后端唯一性与导出节点语义留待后续讨论。Related Issues
Closes #120