Skip to content

feat(experiment): add experiments list page with filtering, pagination, and actions#7628

Merged
Zaimwa9 merged 55 commits into
mainfrom
feat/list-experiments-page
May 29, 2026
Merged

feat(experiment): add experiments list page with filtering, pagination, and actions#7628
Zaimwa9 merged 55 commits into
mainfrom
feat/list-experiments-page

Conversation

@Zaimwa9
Copy link
Copy Markdown
Contributor

@Zaimwa9 Zaimwa9 commented May 28, 2026

Thanks for submitting a PR! Please check the boxes below:

  • I have read the Contributing Guide.
  • I have added information to docs/ if required so people know about the feature.
  • I have filled in the "Changes" section below.
  • I have filled in the "How did you test this code" section below.

Changes

  • Added ExperimentsListControls — tab filter (All / Running / Draft / Paused / Completed) with status_counts and search bar
  • Added ExperimentsTable — name, linked flag, status badge, variation count, last updated, actions dropdown
  • Added StatusBadge — coloured pill per experiment status
  • Added ExperimentActionDropdown — Start / Pause / Complete / Delete with confirmation modals
  • Added RTK Query mutations: start, pause, complete, delete (all invalidate list tag)
  • Upgraded useGetExperimentsQuery to support page, page_size, status, q with transformCorePaging
  • Widened Experiment.feature from number to ExperimentFeature (full object); typed ExperimentFeature.type as FeatureType
  • Added ExperimentStatusCounts and status_counts to paginated response type
  • Deduplicated status labels into experiments/constants.ts
  • All new components follow ComponentName/{tsx,scss,index.ts} folder structure
  • Migrated Experiment Name field to <InputGroup> (finishing feat(experimentation): add experiment creation wizard frontend #7596 cleanup)
  • Fixed useMemouseCallback, NaN-safe reduce on status_counts, Paging hidden when empty
  • Updated ui-patterns.md: corrected Tabs path, documented destructive on openConfirm

How did you test this code?

image
  • Manual testing via ENV=local npm run dev
  • Verified list rendering, status tab filtering with counts, search, pagination
  • Verified lifecycle actions (Start / Pause / Complete / Delete) with confirmation modals
  • Verified all three empty states (no warehouse, no experiments, no filter match)
  • tsc --noEmit and eslint pass on all touched files

Zaimwa9 added 30 commits May 25, 2026 11:10
Comment thread frontend/.claude/context/ui-patterns.md Outdated
@Zaimwa9
Copy link
Copy Markdown
Contributor Author

Zaimwa9 commented May 28, 2026

@gemini-code-assist review

Copy link
Copy Markdown

@gemini-code-assist gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

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

Code Review

This pull request updates the UI patterns documentation and introduces comprehensive pagination, filtering, and action controls for the experiments list, including new endpoints for starting, pausing, completing, and deleting experiments. The review feedback highlights several critical issues that will cause compilation errors or runtime crashes, such as missing imports across multiple files, incorrect event typing, missing closeModal calls in confirmation dialogs, and unsafe property access on potentially nullable feature objects.

Comment thread frontend/web/components/pages/ExperimentsPage.tsx
Copy link
Copy Markdown
Contributor

@talissoncosta talissoncosta left a comment

Choose a reason for hiding this comment

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

left some suggestions, thanks for handling that @Zaimwa9

Comment thread frontend/.claude/context/ui-patterns.md Outdated
Comment thread frontend/.claude/context/ui-patterns.md
Comment thread frontend/.claude/context/ui-patterns.md
Copy link
Copy Markdown
Contributor

@talissoncosta talissoncosta left a comment

Choose a reason for hiding this comment

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

Just some small points...

Can you please check the experiment form?

Image

The input is wider and the labels are not following the same pattern as the others.

Image

Also here on metrics..

I might have missed on the previous pr

Comment thread frontend/web/components/experiments/steps/ReviewStep.scss
@Zaimwa9 Zaimwa9 merged commit 7ea1158 into main May 29, 2026
28 of 29 checks passed
@Zaimwa9 Zaimwa9 deleted the feat/list-experiments-page branch May 29, 2026 08:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

api Issue related to the REST API feature New feature or request front-end Issue related to the React Front End Dashboard

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants