Skip to content

[O2B-1640] Improve the UX of the run overview table - #2290

Merged
graduta merged 8 commits into
mainfrom
improv/O2B-1640/improve-UX-of-run-overview-table
Oct 23, 2026
Merged

graduta merged 8 commits into
mainfrom
improv/O2B-1640/improve-UX-of-run-overview-table

Conversation

@graduta

@graduta graduta commented Oct 23, 2026 •

Copy link
Copy Markdown
Member

I have a JIRA ticket

  • branch and/or PR name(s) include(s) JIRA ID
  • issue has "Fix version" assigned
  • issue "Status" is set to "In review"
  • PR labels are selected

Notable changes for users:

  • The run overview has fewer, denser columns: Run, Timing, Context, Configuration, Detectors / EOR reason and Tags.
    • Run: the run number is a larger link followed by a discreet caret opening the same actions as before. Below it, the definition and the quality of the run (in its color) are on one line, and the calibration status of calibration runs on its own line. Each definition has its own neutral style, without colors as they are reserved to states (PHYSICS dark badge, COSMICS outlined, TECHNICAL gray, SYNTHETIC dashed, CALIBRATION with a thick left bar, COMMISSIONING dotted underline). An info icon next to the column header displays a legend of the definitions.
    • Timing: start, stop and duration on labelled and aligned lines. When a run stops the same day it started, only the time of the stop is displayed, below the time of the start; the date is displayed if it is another day.
    • Context: fill, period and environment on labelled lines.
    • Configuration: EPNs, FLPs, DCS and TRG. DCS is displayed in capital letters, as TRG.
    • Detectors / EOR reason: the detectors wrap on several lines instead of being truncated, with the EOR reasons below.
    • Tags: the first two tags are displayed with the number of remaining ones, hovering opens a popover with all of them.
  • Sorting is not affected (the run overview has none), and all the filters are still available in the same filters panel, with unchanged URL parameters. The export is unchanged.

Notable changes for developers:

  • New runsOverviewActiveColumns, used by the run overview only; the other runs tables keep runsActiveColumns. The columns merged into others are kept as hidden columns to provide their filters.
  • New getRunQualityColor (reused by formatRunQuality and the runs table), runActionsComponents extracted from the run number column, runDefinitionLegend, and a hideDateIfSameDayAs option for formatRunEnd.
  • New css classes in app.css: run-definition*, runs-calibration-status, runs-timing-label, bold, invisible, min-w-0.
  • The estimation of the height of a row of the run overview is updated (59 to 81).
  • Elements have stable ids to be used in UI tests: #row<id>-run-number, -definition, -quality, -calibration-status, -start, -stop, -runDuration, -fillNumber, -lhcPeriod, -environmentId, -nEpns, -nFlps, -dcs, -triggerValue, -detectors, -eorReasons, -tags.
  • Tests of the run overview are updated and new ones are added. They were not run locally.

Changes made to the database:

  • None

- Run: run number with the definition and the quality below it
- Timing: start, stop and duration
- Context: LHC fill, LHC period and environment
- Configuration: EPNs, FLPs, DCS and trigger
- Merged columns are kept hidden to provide their filters and the export
…lpers

Notable changes for developers:
- New `getRunQualityColor` utility, used by the run details quality badge and the runs table quality button, to be reused by any display of the run quality.
- `runActionsComponents` is extracted from the run number column of `runsActiveColumns`, to display the run's actions in other layouts than the button with dropdown.
- `formatRunEnd` has a new `hideDateIfSameDayAs` option (inline only): the date of the end is hidden, but keeps its space, when it is the same day as the given timestamp, so the times stay aligned.
- `detectorStyleClass` of `formatRunDetectorsInline` is exported.
Notable changes for users:
- Run: the run number is a larger link, followed by a discreet caret opening the same actions as before. The definition and the quality of the run are displayed below it on one line, the quality in its color (good, bad, other). Each definition has its own neutral style (no color, as colors are reserved to states): PHYSICS dark badge, COSMICS outlined, TECHNICAL gray, SYNTHETIC dashed, CALIBRATION with a thick left bar (its calibration status is displayed below, in a compact badge) and COMMISSIONING dotted underline. An info icon next to the header of the column displays the legend of the definitions.
- Timing: the labels are aligned and the time of the stop is aligned below the time of the start when the run stops the same day it started, the date being displayed when it is another day.
- Context: narrower column.
- Detectors and EOR reason are merged in one column: the detectors are wrapped on several lines instead of being truncated, with the EOR reasons below. Tags is its own column displaying the first tags followed by the number of remaining ones.
- DCS is displayed in capital letters, as TRG.

Notable changes for developers:
- New `runsOverviewActiveColumns`, used by the run overview only. The columns merged into others are kept as hidden columns to provide their filters.
- The estimation of the height of a row, used to compute the default number of rows, is updated.
- New classes in `app.css`: `run-definition*`, `runs-calibration-status`, `runs-timing-label`, `bold`, `invisible` and `min-w-0`.
- Tests of the tags, EOR reasons, definition, quality, duration, start and stop, and run numbers use the elements of the new merged columns.
- New tests for the legend of the run definitions, the hidden date of the stop of a run ending the same day it started, and the calibration status displayed below the definition of calibration runs.

They were not run locally.
@graduta
graduta requested a review from isaachilly as a code owner October 23, 2026 12:40
@graduta graduta self-assigned this Oct 23, 2026
@codecov

codecov Bot commented Oct 23, 2026 •

Copy link
Copy Markdown

Codecov Report

❌ Patch coverage is 0% with 69 lines in your changes missing coverage. Please review.
✅ Project coverage is 46.17%. Comparing base (4616355) to head (84c27fe).

Files with missing lines Patch % Lines
...ws/Runs/ActiveColumns/runsOverviewActiveColumns.js 0.00% 41 Missing ⚠️
lib/public/views/Runs/format/formatRunEnd.js 0.00% 12 Missing ⚠️
lib/public/views/Runs/format/getRunQualityColor.js 0.00% 6 Missing ⚠️
...blic/views/Runs/ActiveColumns/runsActiveColumns.js 0.00% 4 Missing ⚠️
...ib/public/views/Runs/format/runDefinitionLegend.js 0.00% 3 Missing ⚠️
lib/public/views/Runs/Overview/RunsOverviewPage.js 0.00% 1 Missing ⚠️
...blic/views/Runs/format/formatRunDetectorsInline.js 0.00% 1 Missing ⚠️
lib/public/views/Runs/format/formatRunQuality.js 0.00% 1 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##             main    #2290      +/-   ##
==========================================
- Coverage   46.30%   46.17%   -0.13%     
==========================================
  Files        1056     1059       +3     
  Lines       17445    17494      +49     
  Branches     3184     3210      +26     
==========================================
  Hits         8078     8078              
- Misses       9367     9416      +49     

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

The duration already has its own popover (warning on the missing trigger times), a second balloon around it hid it.
- The run overview displays 6 rows by default, as rows are taller.
- The EOR reasons and the run number are read from the elements of the merged columns, including from the run details tests.
…the filters of the run overview

Only the runs having EOR reasons display them, so the first page may not have any.
@graduta
graduta merged commit ae88437 into main Oct 23, 2026
42 of 45 checks passed
@graduta
graduta deleted the improv/O2B-1640/improve-UX-of-run-overview-table branch October 23, 2026 13:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Development

Successfully merging this pull request may close these issues.

1 participant