Skip to content

Restyle Workflow Graph#36912

Merged
wxiaoguang merged 47 commits intogo-gitea:mainfrom
bircni:feature/restyle-workflow-graph
Mar 28, 2026
Merged

Restyle Workflow Graph#36912
wxiaoguang merged 47 commits intogo-gitea:mainfrom
bircni:feature/restyle-workflow-graph

Conversation

@bircni
Copy link
Copy Markdown
Member

@bircni bircni commented Mar 16, 2026 •
edited
Loading

As @silverwind requested in #36883 I restyled the workflow graph

Before

After

Bildschirmfoto 2026-03-23 um 20 05 41

@xDarkmanx maybe you want to have a look at this, too as you introduced the workflows

@GiteaBot GiteaBot added the lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. label Mar 16, 2026
@github-actions github-actions bot added modifies/go Pull requests that update Go code modifies/frontend labels Mar 16, 2026
@bircni bircni marked this pull request as ready for review March 16, 2026 20:14
@bircni bircni marked this pull request as draft March 16, 2026 20:38
@bircni bircni marked this pull request as draft March 16, 2026 20:38
@bircni
remove some unneeded code
25970ba 
- if statement returned 2x the same, was left over from testing
-  bezier dont need to store start and end vars as they are not used anymore anywhere, just needed for local computes
bircni
bircni commented Mar 16, 2026
View reviewed changes
bircni
bircni commented Mar 16, 2026
View reviewed changes
bircni
bircni commented Mar 16, 2026
View reviewed changes
bircni
bircni commented Mar 16, 2026
View reviewed changes
bircni
bircni commented Mar 16, 2026
View reviewed changes
Copy link
Copy Markdown
Member Author

@bircni bircni left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Self reviewed - did not find an issue for now

@lunny lunny requested a review from Copilot March 17, 2026 00:32
Copilot AI reviewed Mar 17, 2026
View reviewed changes
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR restyles the Actions workflow dependency graph in the run summary view to a more compact, horizontal layout with updated node/edge visuals, and extends the devtest mock data to better exercise the new presentation (long names + more statuses).

Changes:

  • Switched graph layout/orientation and updated spacing/edge routing to use “elbow” (orthogonal) connectors.
  • Updated node rendering to a flatter card style with ports and a status icon via ActionRunStatus.
  • Expanded devtest mock jobs to include additional statuses and a long job name for truncation/layout testing.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 3 comments.

File Description
web_src/js/components/WorkflowGraph.vue Implements the new graph layout, edge routing, node visuals, and status icon rendering.
routers/web/devtest/mock_actions.go Adds more mock jobs/statuses and a long job name to validate the new graph styling.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

@bircni
fix review comments: precompute edge sets and consolidate highlight s…
793bbbe 
…tyling

- Replace hasIncomingEdge/hasOutgoingEdge linear scans with precomputed
  Sets for O(1) lookups per node render
- Inline set lookups directly in template, removing one-off wrapper functions
- Remove dead highlight logic from getEdgeStyle(); highlight styling is
  solely handled by .highlighted-edge CSS class
@bircni bircni marked this pull request as ready for review March 17, 2026 17:58
@bircni
Copy link
Copy Markdown
Member Author

bircni commented Mar 19, 2026

@silverwind could you have a look at it?

@lunny
Copy link
Copy Markdown
Member

lunny commented Mar 21, 2026

It will not display the logs when click a step on the graph.

@bircni
Copy link
Copy Markdown
Member Author

bircni commented Mar 21, 2026

delaying the fixes for this until #36883 is done

@bircni bircni marked this pull request as draft March 21, 2026 09:53
@bircni
Merge branch 'main' into feature/restyle-workflow-graph
fd6d57f 
Made-with: Cursor

# Conflicts:
#	web_src/js/components/WorkflowGraph.vue
@bircni
Copy link
Copy Markdown
Member Author

bircni commented Mar 22, 2026

It will not display the logs when click a step on the graph.

it works for me :-)

@bircni bircni marked this pull request as ready for review March 22, 2026 10:02
@TheFox0x7
Copy link
Copy Markdown
Contributor

TheFox0x7 commented Mar 22, 2026

@bircni btw I think you can apply to be a maintainer if you'd like.

@bircni bircni mentioned this pull request Mar 22, 2026
Merged
lunny pushed a commit that referenced this pull request Mar 22, 2026
@bircni
Apply as maintainer (#36947)
aa9aea2 
I'd like to apply as a maintainer.

Thanks to @TheFox0x7 for the suggestion.

Merged PRs:
- #36441
- #36571
- #36603
- #36768
- #36776
- #36783
- #36876
- #36883
- #36924

Ongoing work:
- #36514
- #36752
- #36912
@wxiaoguang wxiaoguang dismissed their stale review March 28, 2026 07:08

dismiss

@GiteaBot GiteaBot added lgtm/need 1 This PR needs approval from one additional maintainer to be merged. and removed lgtm/blocked A maintainer has reservations with the PR and thus it cannot be merged labels Mar 28, 2026
@wxiaoguang
Copy link
Copy Markdown
Contributor

wxiaoguang commented Mar 28, 2026

Anything else to improve?

@GiteaBot GiteaBot added lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. and removed lgtm/need 1 This PR needs approval from one additional maintainer to be merged. labels Mar 28, 2026
@silverwind
Copy link
Copy Markdown
Member

silverwind commented Mar 28, 2026

Checking it out now.

@silverwind @claude
Use theme color variables for workflow graph and summary
2fd8269 
Use --color-box-body for graph container, --color-box-header for
summary block, and --color-text-light-1 for summary text instead
of Tailwind utility classes and --color-body.

Co-Authored-By: Claude (Opus 4.6) <noreply@anthropic.com>
@silverwind silverwind force-pushed the feature/restyle-workflow-graph branch from 226ed0c to 2fd8269 Compare March 28, 2026 08:48
@silverwind
Copy link
Copy Markdown
Member

silverwind commented Mar 28, 2026

Colors tweaked and fixed a border-radius issue:

Screenshot 2026-03-28 at 09 49 21 Screenshot 2026-03-28 at 09 49 30

@wxiaoguang wxiaoguang enabled auto-merge (squash) March 28, 2026 08:53
@silverwind silverwind added the reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. label Mar 28, 2026
@wxiaoguang wxiaoguang merged commit b136a66 into go-gitea:main Mar 28, 2026
26 checks passed
@GiteaBot GiteaBot added this to the 1.26.0 milestone Mar 28, 2026
@GiteaBot GiteaBot removed the reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. label Mar 28, 2026
@bircni bircni deleted the feature/restyle-workflow-graph branch March 28, 2026 09:58
silverwind added a commit to silverwind/gitea that referenced this pull request Mar 28, 2026
@silverwind
Merge remote-tracking branch 'origin/main' into checkpreview
1042d35 
* origin/main:
  Fix relative-time RangeError (go-gitea#37021)
  Restyle Workflow Graph (go-gitea#36912)
  Update message severity colors, fix navbar double border (go-gitea#37019)
  Clean up checkbox cursor styles (go-gitea#37016)
  add missing cron tasks to example ini (go-gitea#37012)
  Add e2e tests for server push events (go-gitea#36879)
zjjhot added a commit to zjjhot/gitea that referenced this pull request Mar 30, 2026
@zjjhot
Merge branch 'main' into mainzjj
aaede8e 
* main: (35 commits)
  Correct swagger annotations for enums, status codes, and notification state (go-gitea#37030)
  Update Nix flake (go-gitea#37024)
  Bump go and python versions in nix flake (go-gitea#37031)
  Make task list checkboxes clickable in the preview tab (go-gitea#37010)
  Add support for in_progress event in workflow_run webhook (go-gitea#36979)
  Fix various problems (go-gitea#37029)
  Update AI Contribution Policy (go-gitea#37022)
  Migrate from webpack to vite (go-gitea#37002)
  Upgrade yaml (go-gitea#37015)
  Fix issue label deletion with Actions tokens (go-gitea#37013)
  Hide delete branch or tag buttons in mirror or archived repositories. (go-gitea#37006)
  Update AGENTS.md with additional guidelines (go-gitea#37018)
  Optimize 'refreshAccesses' to perform update without removing then adding (go-gitea#35702)
  Fix relative-time RangeError (go-gitea#37021)
  Restyle Workflow Graph (go-gitea#36912)
  Update message severity colors, fix navbar double border (go-gitea#37019)
  Clean up checkbox cursor styles (go-gitea#37016)
  add missing cron tasks to example ini (go-gitea#37012)
  Add e2e tests for server push events (go-gitea#36879)
  Update JS dependencies (go-gitea#37001)
  ...
silverwind added a commit to silverwind/gitea that referenced this pull request Mar 30, 2026
@silverwind
Merge remote-tracking branch 'origin/main' into cm
2b13bac 
* origin/main: (69 commits)
  Correct swagger annotations for enums, status codes, and notification state (go-gitea#37030)
  Update Nix flake (go-gitea#37024)
  Bump go and python versions in nix flake (go-gitea#37031)
  Make task list checkboxes clickable in the preview tab (go-gitea#37010)
  Add support for in_progress event in workflow_run webhook (go-gitea#36979)
  Fix various problems (go-gitea#37029)
  Update AI Contribution Policy (go-gitea#37022)
  Migrate from webpack to vite (go-gitea#37002)
  Upgrade yaml (go-gitea#37015)
  Fix issue label deletion with Actions tokens (go-gitea#37013)
  Hide delete branch or tag buttons in mirror or archived repositories. (go-gitea#37006)
  Update AGENTS.md with additional guidelines (go-gitea#37018)
  Optimize 'refreshAccesses' to perform update without removing then adding (go-gitea#35702)
  Fix relative-time RangeError (go-gitea#37021)
  Restyle Workflow Graph (go-gitea#36912)
  Update message severity colors, fix navbar double border (go-gitea#37019)
  Clean up checkbox cursor styles (go-gitea#37016)
  add missing cron tasks to example ini (go-gitea#37012)
  Add e2e tests for server push events (go-gitea#36879)
  Update JS dependencies (go-gitea#37001)
  ...

# Conflicts:
#	package.json
#	pnpm-lock.yaml
#	tests/e2e/utils.ts
#	web_src/css/themes/theme-gitea-dark.css
#	web_src/css/themes/theme-gitea-light.css
#	web_src/js/bootstrap.ts
#	web_src/js/features/codeeditor.ts
#	web_src/js/modules/errors.test.ts
#	webpack.config.ts
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

Copilot code review Copilot Copilot left review comments

@lunny lunny lunny approved these changes

@silverwind silverwind silverwind approved these changes

@wxiaoguang wxiaoguang wxiaoguang approved these changes

Assignees

No one assigned

Labels

lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. modifies/frontend modifies/go Pull requests that update Go code topic/ui Change the appearance of the Gitea UI

Projects

None yet

Milestone

1.26.0

Development

Successfully merging this pull request may close these issues.

7 participants

@bircni @lunny @TheFox0x7 @wxiaoguang @silverwind @GiteaBot