[UI] Improve empty states across Experiments, Models, Prompts, and Gateway pages by ridgupta26 · Pull Request #20044 · mlflow/mlflow

ridgupta26 · 2026-01-15T23:00:49Z

Before

After

CleanShot.2026-01-15.at.15.03.26.mp4

Related Issues/PRs

What changes are proposed in this pull request?

This PR improves the empty states across multiple pages in the MLflow UI to provide a more consistent and user-friendly experience:

Changes:

Updated empty states to use the Databricks design system Empty component with appropriate icons
Added plus icons to all 'Create' buttons for visual consistency
Made empty states centered with proper styling and minimum height
Ensured table headers and search bars remain visible even in empty states
Updated empty state descriptions with helpful text and documentation links
Fixed padding inconsistencies on the Models page
Removed AI Gateway icon from the main header
Hide action buttons in page headers when empty state is shown (to encourage users to use the primary CTA in the empty state)

Pages affected:

Experiments list page: Empty state with beaker icon, centered, table headers visible
Experiments home page: Empty state with beaker icon in the experiments preview section
Models page: Empty state with models icon, centered, table headers visible, fixed padding to match other pages
Prompts page: Empty state with button and documentation link, centered, table headers visible
AI Gateway page: Removed header icon, table headers visible in empty state

How is this PR tested?

Existing unit/integration tests
New unit/integration tests
Manual tests

Manual testing performed:

Verified empty states render correctly on all affected pages
Tested that table headers and search bars remain visible in empty states
Confirmed buttons have appropriate icons
Verified padding is consistent across pages
Tested in both light and dark modes

Does this PR require documentation update?

Release Notes

Is this a user-facing change?

No. You can skip the rest of this section.
Yes. Give a description of this change to be included in the release notes for MLflow users.

Improved empty state UI across Experiments, Models, Prompts, and Gateway pages with consistent styling, better icons, and helpful action buttons. Table headers and search bars now remain visible in empty states for better user orientation.

What component(s), interfaces, languages, and integrations does this PR affect?

Components

How should the PR be classified in the release notes? Choose one:

rn/none - No description will be included. The PR will be mentioned only by the PR number in the "Small Bugfixes and Documentation Updates" section
rn/breaking-change - The PR will be mentioned in the "Breaking Changes" section
rn/feature - A new user-facing feature worth mentioning in the release notes
rn/bug-fix - A user-facing bug fix worth mentioning in the release notes
rn/documentation - A user-facing documentation change worth mentioning in the release notes

Should this PR be included in the next patch release?

Yes (this PR will be cherry-picked and included in the next patch release)
No (this PR will be included in the next minor release)

…teway pages - Updated empty states to use Databricks design system Empty component with proper icons - Added plus icons to all 'Create' buttons for consistency - Made empty states centered with proper styling - Ensured table headers and search bars remain visible in empty states - Updated empty state descriptions with helpful text and documentation links - Removed padding inconsistencies across Models page - Removed AI Gateway icon from header - Hide action buttons in headers when empty state is shown Signed-off-by: ridgupta26 <ridhima.gatech@gmail.com>

github-actions · 2026-01-15T23:01:11Z

🛠 DevTools 🛠

Install mlflow from this PR

# mlflow
pip install git+https://github.com/mlflow/mlflow.git@refs/pull/20044/merge
# mlflow-skinny
pip install git+https://github.com/mlflow/mlflow.git@refs/pull/20044/merge#subdirectory=libs/skinny

For Databricks, use the following command:

%sh curl -LsSf https://raw.githubusercontent.com/mlflow/mlflow/HEAD/dev/install-skinny.sh | sh -s pull/20044/merge

github-actions · 2026-01-15T23:01:12Z

@ridgupta26 Thank you for the contribution! Could you fix the following issue(s)?

⚠ DCO check

The DCO check failed. Please sign off your commit(s) by following the instructions here. See https://github.com/mlflow/mlflow/blob/master/CONTRIBUTING.md#sign-your-work for more details.

⚠ Invalid PR template

This PR does not appear to have been filed using the MLflow PR template. Please copy the PR template from here and fill it out.

Signed-off-by: Yuki Watanabe <31463517+B-Step62@users.noreply.github.com>

B-Step62 · 2026-01-28T07:00:02Z

mlflow/server/js/src/gateway/components/endpoints/EndpointsList.tsx

-            onDelete={() => handleDeleteClick(endpoint)}
-          />
-        ))}
+        {showEmptyState ? (


@ridgupta26 It seems the div is not centered properly

hmm i also think it's weird to put the empty state inside a row. i'm going to revert to using the empty prop as before unless there's a specific reason for this

github-actions · 2026-01-28T07:03:34Z

Documentation preview for 39bcd62 is available at:

https://pr-20044--mlflow-docs-preview.netlify.app/docs/latest/

More info

Ignore this comment if this PR does not change the documentation.
The preview is updated when a new commit is pushed to this PR.
This comment was created by this workflow run.
The documentation was built by this workflow run.

- Fixed vertical centering of empty state in EndpointsList by applying height and vertical-align to td element - Applied prettier formatting to ExperimentListTable, ExperimentListView, and ExperimentsHomeView - Empty state now properly centered with consistent styling Signed-off-by: ridgupta26 <ridhima.gatech@gmail.com>

ridgupta26 · 2026-01-29T04:34:33Z

@B-Step62 Fixed the Gateway empty state centering issue. The empty state is now properly vertically centered by applying height: 400 and verticalAlign: 'middle' to the td element, and removed the minHeight from the inner divs. Also applied prettier formatting to all modified files.

ridgupta26 · 2026-01-29T04:40:48Z

Fixed DCO issue - the sign-off email now matches the author email for all commits. All checks are now passing! ✅

mlflow/server/js/src/experiment-tracking/pages/prompts/components/PromptsListTable.tsx

Signed-off-by: Daniel Lok <daniel.lok@databricks.com>

… into rg-empty

Signed-off-by: Daniel Lok <daniel.lok@databricks.com>

…teway pages (mlflow#20044) Signed-off-by: ridgupta26 <ridhima.gatech@gmail.com> Signed-off-by: Yuki Watanabe <31463517+B-Step62@users.noreply.github.com> Signed-off-by: Daniel Lok <daniel.lok@databricks.com> Co-authored-by: ridgupta26 <ridhima.gatech@gmail.com> Co-authored-by: Yuki Watanabe <31463517+B-Step62@users.noreply.github.com> Co-authored-by: Daniel Lok <daniel.lok@databricks.com>

…teway pages (#20044) Signed-off-by: ridgupta26 <ridhima.gatech@gmail.com> Signed-off-by: Yuki Watanabe <31463517+B-Step62@users.noreply.github.com> Signed-off-by: Daniel Lok <daniel.lok@databricks.com> Co-authored-by: ridgupta26 <ridhima.gatech@gmail.com> Co-authored-by: Yuki Watanabe <31463517+B-Step62@users.noreply.github.com> Co-authored-by: Daniel Lok <daniel.lok@databricks.com>

github-actions bot added area/uiux Front-end, user experience, plotting, JavaScript, JavaScript dev server rn/feature Mention under Features in Changelogs. rn/bug-fix Mention under Bug Fixes in Changelogs. and removed rn/feature Mention under Features in Changelogs. labels Jan 15, 2026

danielseong1 approved these changes Jan 15, 2026

View reviewed changes

github-actions bot assigned danielseong1 Jan 16, 2026

dbczumar added the v3.9.0 label Jan 20, 2026

Merge branch 'master' into fix-empty-states-part2

70f57ab

Signed-off-by: Yuki Watanabe <31463517+B-Step62@users.noreply.github.com>

B-Step62 reviewed Jan 28, 2026

View reviewed changes

B-Step62 removed the v3.9.0 label Jan 28, 2026

github-actions bot assigned B-Step62 Jan 28, 2026

ridgupta26 force-pushed the fix-empty-states-part2 branch from a5f06bf to 0e16f41 Compare January 29, 2026 04:39

ridgupta26 requested a review from B-Step62 February 12, 2026 23:34

daniellok-db reviewed Feb 13, 2026

View reviewed changes

mlflow/server/js/src/experiment-tracking/pages/prompts/components/PromptsListTable.tsx Outdated Show resolved Hide resolved

daniellok-db added 4 commits February 13, 2026 19:14

Apply suggestion from @daniellok-db

059ac37

Signed-off-by: Daniel Lok <daniel.lok@databricks.com>

fixes

d826c9e

Signed-off-by: Daniel Lok <daniel.lok@databricks.com>

Merge commit 'refs/pull/20044/head' of https://github.com/mlflow/mlflow…

2cbe05d

… into rg-empty

Merge branch 'master' of https://github.com/mlflow/mlflow into rg-empty

23365e7

github-actions bot assigned daniellok-db Feb 13, 2026

daniellok-db added 2 commits February 13, 2026 20:58

fixes

b38ad3a

Signed-off-by: Daniel Lok <daniel.lok@databricks.com>

fixes

39bcd62

Signed-off-by: Daniel Lok <daniel.lok@databricks.com>

daniellok-db added this pull request to the merge queue Feb 13, 2026

Merged via the queue into mlflow:master with commit 50b715f Feb 13, 2026
14 checks passed

daniellok-db added the v3.10.0 label Feb 20, 2026

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[UI] Improve empty states across Experiments, Models, Prompts, and Gateway pages#20044

[UI] Improve empty states across Experiments, Models, Prompts, and Gateway pages#20044
daniellok-db merged 9 commits intomlflow:masterfrom
ridgupta26:fix-empty-states-part2

ridgupta26 commented Jan 15, 2026 •

edited by danielseong1

Loading

Uh oh!

github-actions bot commented Jan 15, 2026

Install mlflow from this PR

Uh oh!

github-actions bot commented Jan 15, 2026

Uh oh!

B-Step62 Jan 28, 2026 •

edited

Loading

Uh oh!

daniellok-db Feb 13, 2026

Uh oh!

github-actions bot commented Jan 28, 2026 •

edited

Loading

Uh oh!

ridgupta26 commented Jan 29, 2026

Uh oh!

ridgupta26 commented Jan 29, 2026

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

Conversation

ridgupta26 commented Jan 15, 2026 • edited by danielseong1 Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Related Issues/PRs

What changes are proposed in this pull request?

How is this PR tested?

Does this PR require documentation update?

Release Notes

Is this a user-facing change?

What component(s), interfaces, languages, and integrations does this PR affect?

How should the PR be classified in the release notes? Choose one:

Should this PR be included in the next patch release?

Uh oh!

github-actions bot commented Jan 15, 2026

Install mlflow from this PR

Uh oh!

github-actions bot commented Jan 15, 2026

⚠ DCO check

⚠ Invalid PR template

Uh oh!

B-Step62 Jan 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

daniellok-db Feb 13, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Jan 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

ridgupta26 commented Jan 29, 2026

Uh oh!

ridgupta26 commented Jan 29, 2026

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

ridgupta26 commented Jan 15, 2026 •

edited by danielseong1

Loading

B-Step62 Jan 28, 2026 •

edited

Loading

github-actions bot commented Jan 28, 2026 •

edited

Loading