[Endpoints] [11/x] Main Gateway page and create endpoint by BenWilson2 · Pull Request #19042 · mlflow/mlflow

BenWilson2 · 2025-11-26T03:40:11Z

🥞 Stacked PR

Use this link to review incremental changes.

stack/endpoints/ui-apis [Files changed]
- stack/endpoints/ui-create-endpoint [Files changed]
  - stack/endpoints/ui-tabs [Files changed]
    - stack/endpoints/key-management [Files changed]
      - stack/endpoints/passphrase [Files changed]

Related Issues/PRs

#xxx

What changes are proposed in this pull request?

Adds the endpoint listing page, endpoint creation page, endpoint details page, endpoint edit page, and the model selection modal.

How is this PR tested?

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

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.

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 should be selected for bug fixes, documentation updates, and other small changes. No should be selected for new features and larger changes. If you're unsure about the release classification of this PR, leave this unchecked to let the maintainers decide.

What is a minor/patch release?

Minor release: a release that increments the second part of the version number (e.g., 1.2.0 -> 1.3.0).
Bug fixes, doc updates and new features usually go into minor releases.
Patch release: a release that increments the third part of the version number (e.g., 1.2.0 -> 1.2.1).
Bug fixes and doc updates usually go into patch releases.

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)

github-actions · 2025-12-02T22:57:33Z

Documentation preview for b85afbc is available at:

https://pr-19042--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.

danielseong1 · 2025-12-08T21:14:50Z

mlflow/server/js/src/gateway/components/create-endpoint/ProviderSelect.tsx

+  }
+
+  // Build the menu items with section headers
+  const menuItems: JSX.Element[] = [];


it's good to memoize this so we don't create a new reference every render cycle

danielseong1 · 2025-12-08T21:29:35Z

mlflow/server/js/src/gateway/pages/CreateEndpointPage.tsx

+  };
+}
+
+const CreateEndpointPage = () => {


more of a recommendation but one common practice is to separate components into 'container' components and 'renderer' components. container contains all business logic (state handling, the form definition, data fetching hooks, etc.), and renderer is a pretty dumb component that just renders data that is passed into it. it could be useful here because then we can easily swap out different renderers - a full page version, modal version, etc - while reusing all the important business logic.

Signed-off-by: Ben Wilson <benjamin.wilson@databricks.com>

daniellok-db · 2025-12-15T03:01:06Z

mlflow/entities/gateway_secrets.py

        created_at: Timestamp (milliseconds) when the secret was created.
        last_updated_at: Timestamp (milliseconds) when the secret was last updated.
        provider: LLM provider this secret is for (e.g., "openai", "anthropic").
+        credential_name: Credential identifier for display (e.g., "api_key", "access_keys").


it's fine here, but in the future i think we can probably split out the python and JS changes into separate PRs

@BenWilson2 I thought we removed credential_name. Is this diff because the branch is not yet rebased?

daniellok-db · 2025-12-15T03:08:37Z

mlflow/server/js/src/gateway/components/create-endpoint/CreateEndpointFormRenderer.tsx

+    <ScrollablePageWrapper css={{ overflow: 'hidden', display: 'flex', flexDirection: 'column' }}>
+      <FormProvider {...form}>
+        <div css={{ padding: theme.spacing.md }}>
+          <Breadcrumb includeTrailingCaret>
+            <Breadcrumb.Item>
+              <Link to={GatewayRoutes.gatewayPageRoute}>
+                <FormattedMessage defaultMessage="Gateway" description="Breadcrumb link to gateway page" />
+              </Link>
+            </Breadcrumb.Item>
+          </Breadcrumb>
+          <Typography.Title level={2} css={{ marginTop: theme.spacing.sm }}>
+            <FormattedMessage defaultMessage="Create endpoint" description="Page title for create endpoint" />
+          </Typography.Title>
+        </div>


nit: from an organization perspective i would probably put these providers / wrappers / breadcrumbs in the parent component (CreateEndpointPage) rather than in this form renderer as they are more part of the page than the form.

this also allows us to have non full-page renderings of the form for example

sounds good - will migrate

daniellok-db · 2025-12-15T03:46:16Z

mlflow/server/js/src/gateway/components/create-endpoint/CreateEndpointFormRenderer.tsx

this file seems to change a lot in #19070 and #19176, so i won't leave much comments here

daniellok-db

stamping to unblock but i think this one PR could have been broken up into 7 or more smaller PRs. it tends to be easier to break up if you follow the user flow:

python changes to add credential_name to protos
secrets list - we should probably have done secrets first since it seems relatively independent
secrets creation - this could come with the creation hooks. in general i like to keep the data fetches / mutator changes either in the same PR as the UI changes or in one PR before, so review can be focused
secrets edit
endpoint list page. in this PR you can have the EndpointsList + useEndpointsQuery changes
create endpoint form part 1 - render the page + layout helpers
create endpoint form part 2 - model section + provider fetching queriers
create endpoint form part 3 - auth section
edit endpoints, ideally this could have just reused the create endpoint stuff but add a new prop like isEditing to control which endpoint we call, since the form is otherwise the same
endpoint details page

each PR could come with focused screenshots showing the change so that it's easy to keep the review focused and detailed, and we have less chances of missing stuff.

i think the guiding principle is to keep PRs under 300 lines long and it's okay to do things in parts (e.g. if parts of the create form are complex and require lots of utils, we can just implement the form bit by bit). we can use feature flags to gate off partial work if we're merging straight to master, for example we could just hide the gateway entrypoint in the sidebar while we're still working on it.

i understand it's pretty difficult to think of the PR structure beforehand, in fact i don't do that myself. what i typically do is make all the changes in one mega branch, then after i have things working the way i want and i know generally what all the changes will be, then it's a lot easier to think how the PRs should be sequenced. i then go back to master and create the stack, copy-pasting things from my mega branch. it's time consuming but the benefit is that reviews go a lot faster, and bugs can actually be caught and fixed easily

daniellok-db · 2025-12-15T04:20:40Z

mlflow/server/js/src/common/components/long-form/LongFormSection.tsx

+        paddingTop: theme.spacing.lg,
+        paddingBottom: theme.spacing.lg,
+        borderBottom: hideDivider ? 'none' : `1px solid ${theme.colors.borderDecorative}`,
+        '@media (max-width: 767px)': {


i see we sometimes use 767 as the breakpoint and other times we use 1023. should we just have a consistent breakpoint at which we consider the form to be "narrow"? it seems like we could always just use 1023 or maybe something even higher as it starts to look odd already at ~1100

Screen.Recording.2025-12-15.at.12.18.07.PM.mov

TomeHirata · 2025-12-16T09:59:23Z

mlflow/server/js/src/gateway/components/model-selector/ModelSelectorModal.tsx

+                  >
+                    <div css={{ display: 'flex', flexDirection: 'column', gap: theme.spacing.xs }}>
+                      <div css={{ display: 'flex', alignItems: 'center', gap: theme.spacing.sm }}>
+                        <Typography.Text bold>{model.model}</Typography.Text>


I saw model name contains provider name like gemini/gemini-2.5-flash, so can we remove provider names when displaying in UI?

TomeHirata · 2025-12-16T10:01:43Z

mlflow/server/js/src/gateway/components/create-endpoint/ModelSelect.tsx

+    }
+  };
+
+  const handleSelect = (model: Model) => {


I wonder if we can allow users to still type in the model name since LiteLLM might not have the latest models in their config while the models can be called using the LiteLLM client

BenWilson2 changed the title ~~endpoint pages~~ [Endpoints] [11/x] Main Gateway page and create endpoint Nov 26, 2025

BenWilson2 marked this pull request as ready for review November 26, 2025 03:47

BenWilson2 force-pushed the stack/endpoints/ui-create-endpoint branch from c956027 to 9891ffe Compare November 27, 2025 02:52

This was referenced Nov 27, 2025

[Endpoints] [12/x] Add Left hand nav and management stub #19070

Closed

[Endpoints] [13/x] Add the API Key management pages #19071

Closed

github-actions bot added area/uiux Front-end, user experience, plotting, JavaScript, JavaScript dev server rn/feature Mention under Features in Changelogs. labels Nov 27, 2025

BenWilson2 force-pushed the stack/endpoints/ui-create-endpoint branch from 9891ffe to 73485a7 Compare November 27, 2025 06:31

BenWilson2 mentioned this pull request Nov 27, 2025

[Endpoints] [14/x] Models management UI #19074

Closed

29 tasks

BenWilson2 force-pushed the stack/endpoints/ui-create-endpoint branch 2 times, most recently from 4c1de82 to 2db062c Compare December 2, 2025 02:14

BenWilson2 mentioned this pull request Dec 2, 2025

[Endpoints] [14/x] Add encryption availability endpoints #19176

Closed

29 tasks

BenWilson2 force-pushed the stack/endpoints/ui-create-endpoint branch 2 times, most recently from 6410f45 to 180c20e Compare December 2, 2025 22:49

BenWilson2 force-pushed the stack/endpoints/ui-create-endpoint branch 5 times, most recently from 346ab42 to 48247dd Compare December 4, 2025 01:54

danielseong1 reviewed Dec 8, 2025

View reviewed changes

BenWilson2 force-pushed the stack/endpoints/ui-create-endpoint branch 14 times, most recently from 30a606e to c206ed9 Compare December 11, 2025 16:10

BenWilson2 added 2 commits December 11, 2025 17:42

Add react routes

a92592b

Signed-off-by: Ben Wilson <benjamin.wilson@databricks.com>

endpoint pages

b85afbc

Signed-off-by: Ben Wilson <benjamin.wilson@databricks.com>

BenWilson2 force-pushed the stack/endpoints/ui-create-endpoint branch from c206ed9 to b85afbc Compare December 11, 2025 22:43

daniellok-db reviewed Dec 15, 2025

View reviewed changes

github-actions bot assigned daniellok-db Dec 15, 2025

daniellok-db reviewed Dec 15, 2025

View reviewed changes

daniellok-db approved these changes Dec 15, 2025

View reviewed changes

daniellok-db reviewed Dec 15, 2025

View reviewed changes

TomeHirata reviewed Dec 16, 2025

View reviewed changes

github-actions bot assigned TomeHirata Dec 16, 2025

BenWilson2 closed this Dec 29, 2025

BenWilson2 deleted the stack/endpoints/ui-create-endpoint branch December 29, 2025 16:10

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Endpoints] [11/x] Main Gateway page and create endpoint#19042

[Endpoints] [11/x] Main Gateway page and create endpoint#19042
BenWilson2 wants to merge 2 commits intomlflow:masterfrom
BenWilson2:stack/endpoints/ui-create-endpoint

BenWilson2 commented Nov 26, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Dec 2, 2025 •

edited

Loading

Uh oh!

danielseong1 Dec 8, 2025 •

edited

Loading

Uh oh!

danielseong1 Dec 8, 2025

Uh oh!

daniellok-db Dec 15, 2025

Uh oh!

TomeHirata Dec 16, 2025

Uh oh!

daniellok-db Dec 15, 2025

Uh oh!

BenWilson2 Dec 15, 2025

Uh oh!

daniellok-db Dec 15, 2025 •

edited

Loading

Uh oh!

daniellok-db left a comment •

edited

Loading

Uh oh!

daniellok-db Dec 15, 2025

Uh oh!

TomeHirata Dec 16, 2025

Uh oh!

TomeHirata Dec 16, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

Conversation

BenWilson2 commented Nov 26, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🥞 Stacked PR

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 Dec 2, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

danielseong1 Dec 8, 2025 • 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!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

daniellok-db Dec 15, 2025 • 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 left a comment • 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!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

BenWilson2 commented Nov 26, 2025 •

edited

Loading

github-actions bot commented Dec 2, 2025 •

edited

Loading

danielseong1 Dec 8, 2025 •

edited

Loading

daniellok-db Dec 15, 2025 •

edited

Loading

daniellok-db left a comment •

edited

Loading