fix(actions): show run index in run view and fix summary graph height (#38165)

- Display the per-repository run number as `#N` next to the run title in
the run view, matching the runs list and GitHub
- Add the run `Index` to the run view API response (and the devtest
mock) to support that
- Restore the summary panel's `flex: 1` so the workflow graph fills the
right-column height even when a run has no job summaries
- Keep the job-summary section content-sized so it doesn't compete with
the graph for height
- Gate the devtest mock job summaries to a subset of runs so the devtest
page also exercises the no-summary layout

<img width="521" height="232" alt="image"
src="https://github.com/user-attachments/assets/a1f2f20b-65bd-4d98-ba6a-b8135580a6de"
/>
This commit is contained in:
bircni
2026-06-22 08:16:09 +02:00
committed by GitHub
parent a4781dde89
commit 649cb6ff3e
5 changed files with 28 additions and 12 deletions

View File

@@ -85,6 +85,7 @@ func MockActionsRunsJobs(ctx *context.Context) {
}
resp := &actions.ViewResponse{}
resp.State.Run.RepoID = 12345
resp.State.Run.Index = runID
resp.State.Run.TitleHTML = `mock run title <a href="/">link</a>`
resp.State.Run.Link = setting.AppSubURL + "/devtest/repo-action-view/runs/" + strconv.FormatInt(runID, 10)
resp.State.Run.CanDeleteArtifact = true
@@ -199,17 +200,20 @@ func MockActionsRunsJobs(ctx *context.Context) {
resp.State.Run.CanRerunFailed = runID == 30 && isLatestAttempt
// Mock job summaries so the devtest page can preview the Summary panel rendering.
resp.State.Run.JobSummaries = []*actions.ViewJobSummary{
{
JobID: runID * 10,
JobName: "job 100 (testsubname)",
SummaryHTML: renderUtils.MarkdownToHtml("### Devtest job summary\n\n- Markdown rendering\n- Links: [example](https://example.com)\n\n```sh\necho hello\n```\n"),
},
{
JobID: runID*10 + 2,
JobName: "ULTRA LOOOOOOOOOOOONG job name 102 that exceeds the limit",
SummaryHTML: renderUtils.MarkdownToHtml("### Another summary\n\nThis demonstrates multiple job summaries in one run.\n\n- Item A\n- Item B\n"),
},
// Only some runs have summaries, so the page also exercises the "no summary" state.
if runID == 10 || runID == 20 {
resp.State.Run.JobSummaries = []*actions.ViewJobSummary{
{
JobID: runID * 10,
JobName: "job 100 (testsubname)",
SummaryHTML: renderUtils.MarkdownToHtml("### Devtest job summary\n\n- Markdown rendering\n- Links: [example](https://example.com)\n\n```sh\necho hello\n```\n"),
},
{
JobID: runID*10 + 2,
JobName: "ULTRA LOOOOOOOOOOOONG job name 102 that exceeds the limit",
SummaryHTML: renderUtils.MarkdownToHtml("### Another summary\n\nThis demonstrates multiple job summaries in one run.\n\n- Item A\n- Item B\n"),
},
}
}
resp.Artifacts = append(resp.Artifacts, &actions.ArtifactsViewItem{

View File

@@ -294,6 +294,7 @@ type ViewResponse struct {
// or "/owner/repo/actions/runs/123/attempts/2" for a historical attempt.
// Use this when the target should reflect the currently-viewed attempt.
ViewLink string `json:"viewLink"`
Index int64 `json:"index"` // the per-repository run number, displayed as "#N"
Title string `json:"title"`
TitleHTML template.HTML `json:"titleHTML"`
Status string `json:"status"`
@@ -561,6 +562,7 @@ func fillViewRunResponseSummary(ctx *context_module.Context, resp *ViewResponse,
isLatestAttempt := run.LatestAttemptID == 0 || (attempt != nil && attempt.ID == run.LatestAttemptID)
resp.State.Run.RepoID = ctx.Repo.Repository.ID
resp.State.Run.Index = run.Index
// the title for the "run" is from the commit message
resp.State.Run.Title = run.Title
resp.State.Run.TitleHTML = templates.NewRenderUtils(ctx).RenderCommitMessage(run.Title, ctx.Repo.Repository)

View File

@@ -107,6 +107,7 @@ export function buildJobsByParentJobID(jobs: ActionsJob[]): Map<number, ActionsJ
export function createEmptyActionsRun(): ActionsRun {
return {
repoId: 0,
index: 0,
link: '',
viewLink: '',
title: '',

View File

@@ -141,6 +141,7 @@ onBeforeUnmount(() => {
<ActionStatusIcon :locale-status="locale.status[run.status]" :status="run.status" :size="22" icon-variant="circle-fill"/>
<!-- eslint-disable-next-line vue/no-v-html -->
<h2 class="action-info-summary-title-text" v-html="run.titleHTML"/>
<span class="action-info-summary-title-index">#{{ run.index }}</span>
</div>
<div class="flex-text-block tw-shrink-0 tw-flex-wrap">
<button class="ui basic small compact button primary" @click="approveRun()" v-if="run.canApprove">
@@ -377,10 +378,15 @@ onBeforeUnmount(() => {
.action-info-summary-title-text {
font-size: 20px;
margin: 0;
flex: 1;
overflow-wrap: anywhere;
}
.action-info-summary-title-index {
font-size: 20px;
color: var(--color-text-light-2);
flex: 1;
}
.action-info-summary .ui.button {
margin: 0;
white-space: nowrap;
@@ -497,6 +503,7 @@ onBeforeUnmount(() => {
}
.action-view-right-panel {
flex: 1; /* fill the right column so the summary graph stretches even without a job-summary section */
border: 1px solid var(--color-console-border);
border-radius: var(--border-radius);
background: var(--color-console-bg);
@@ -538,6 +545,7 @@ onBeforeUnmount(() => {
}
.job-summary-section {
flex: 0 0 auto; /* size to its content; let the summary panel keep the remaining height */
overflow: hidden;
}

View File

@@ -4,6 +4,7 @@ export type ActionsArtifactStatus = 'expired' | 'completed';
export type ActionsRun = {
repoId: number,
index: number,
link: string,
viewLink: string,
title: string,