uncaged/workflow
10
0
Fork 0
Code Issues 6 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(dashboard): restore graph visual preferences — unified line style, hide FALLBACK labels, alternate feedback edges #247

New Issue
Closed
opened 2026-05-14 02:58:16 +00:00 by xingyue · 1 comment
xingyue commented 2026-05-14 02:58:16 +00:00
Owner
Copy Link
Copy Source

What

The workflow graph in the dashboard has three visual issues that need fixing. These preferences were previously discussed but never committed to code.

Current behavior

  1. FALLBACK edges use dashed lines (strokeDasharray: '5 4') — should be solid like all other edges
  2. FALLBACK labels are visible — they add visual clutter and should be hidden
  3. Feedback (back) edges all route to the right side — they should alternate left/right to avoid overlap (e.g. reviewer→coder goes right, tester→coder goes left)
  4. Inactive nodes show cursor: pointer — nodes that haven't been reached yet should not appear clickable

Expected behavior (see reference screenshot in PR description)

  1. Unified solid lines — all edges use the same line style, no dashed/solid distinction
  2. FALLBACK labels hidden — only show meaningful condition labels like allPhasesComplete, reviewApproved, testsPassed
  3. Feedback edges alternate sides — when multiple feedback edges target the same node, they should route on alternating sides (left/right) for clarity
  4. Inactive nodes not clickable — no cursor: pointer on nodes with default state

Files to modify

  • packages/workflow-dashboard/src/components/workflow-graph/condition-edge.tsx:

    • Remove strokeDasharray logic (line 82)
    • Change stroke to always use var(--color-accent) (line 81)
    • Hide label when condition is FALLBACK (line 83)
    • Remove isFallback color distinction in label styling (line 105)

  • packages/workflow-dashboard/src/components/workflow-graph/use-layout.ts:

    • Add alternating left/right side routing for feedback edges instead of always routing right
    • Track feedback edge index per target node to alternate sides

  • packages/workflow-dashboard/src/components/workflow-graph/role-node.tsx:

    • Only apply cursor-pointer class when node state is not default

Conventions

  • Follow project CLAUDE.md: type not interface, no ?:, named exports, function not class
  • Build must pass: bun run build in packages/workflow-dashboard
## What The workflow graph in the dashboard has three visual issues that need fixing. These preferences were previously discussed but never committed to code. ## Current behavior 1. **FALLBACK edges use dashed lines** (`strokeDasharray: '5 4'`) — should be solid like all other edges 2. **FALLBACK labels are visible** — they add visual clutter and should be hidden 3. **Feedback (back) edges all route to the right side** — they should alternate left/right to avoid overlap (e.g. reviewer→coder goes right, tester→coder goes left) 4. **Inactive nodes show `cursor: pointer`** — nodes that haven't been reached yet should not appear clickable ## Expected behavior (see reference screenshot in PR description) 1. **Unified solid lines** — all edges use the same line style, no dashed/solid distinction 2. **FALLBACK labels hidden** — only show meaningful condition labels like `allPhasesComplete`, `reviewApproved`, `testsPassed` 3. **Feedback edges alternate sides** — when multiple feedback edges target the same node, they should route on alternating sides (left/right) for clarity 4. **Inactive nodes not clickable** — no `cursor: pointer` on nodes with `default` state ## Files to modify - `packages/workflow-dashboard/src/components/workflow-graph/condition-edge.tsx`: - Remove `strokeDasharray` logic (line 82) - Change `stroke` to always use `var(--color-accent)` (line 81) - Hide label when condition is `FALLBACK` (line 83) - Remove `isFallback` color distinction in label styling (line 105) - `packages/workflow-dashboard/src/components/workflow-graph/use-layout.ts`: - Add alternating left/right side routing for feedback edges instead of always routing right - Track feedback edge index per target node to alternate sides - `packages/workflow-dashboard/src/components/workflow-graph/role-node.tsx`: - Only apply `cursor-pointer` class when node state is not `default` ## Conventions - Follow project CLAUDE.md: `type` not `interface`, no `?:`, named exports, `function` not `class` - Build must pass: `bun run build` in `packages/workflow-dashboard`
xingyue commented 2026-05-14 03:00:41 +00:00
Author
Owner
Copy Link
Copy Source

Phase 拆分

Phase 1: 统一线型 + 隐藏 FALLBACK 标签 + cursor 修复

  • 验证目标：流程图所有边为实线，无 FALLBACK 标签，未点亮节点无手型光标
  • Testing issue: 待创建

Phase 2: 回退边左右交替路由

  • 验证目标：多条回退边分别从左右两侧绕行，不重叠
  • Testing issue: 待创建

完成标准

  • 所有 Phase 的 testing issue 已 close
  • 线上 workflow.shazhou.work 验证通过
## Phase 拆分 ### Phase 1: 统一线型 + 隐藏 FALLBACK 标签 + cursor 修复 - 验证目标：流程图所有边为实线，无 FALLBACK 标签，未点亮节点无手型光标 - Testing issue: 待创建 ### Phase 2: 回退边左右交替路由 - 验证目标：多条回退边分别从左右两侧绕行，不重叠 - Testing issue: 待创建 ## 完成标准 - [ ] 所有 Phase 的 testing issue 已 close - [ ] 线上 workflow.shazhou.work 验证通过
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
No items
No Label
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
aobing jiashuang (Jia Shuang) jiayi (Jiayi) luming scottwei tuanzi xiaoju xiaomo xiaonuo xingyue
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: uncaged/workflow#247
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?