Trace UI - Update session ID pills to link to the chat session and scroll to the turn corresponding turn by dbczumar · Pull Request #18985 · mlflow/mlflow

dbczumar · 2025-11-24T05:46:46Z

🛠 DevTools 🛠

Install mlflow from this PR

# mlflow
pip install git+https://github.com/mlflow/mlflow.git@refs/pull/18985/merge
# mlflow-skinny
pip install git+https://github.com/mlflow/mlflow.git@refs/pull/18985/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/18985/merge

Related Issues/PRs

#xxx

What changes are proposed in this pull request?

Trace UI - Update session ID pills to link to the chat session and scroll to the turn corresponding turn

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)

Signed-off-by: dbczumar <corey.zumar@databricks.com>

dbczumar · 2025-11-24T05:47:49Z

mlflow/server/js/src/shared/web-shared/genai-traces-table/utils/FeatureUtils.ts

-export const shouldEnableChatSessionsTab = () => {
-  return false;
-};


Seems like this was a bug / problem with the Databricks -> MLflow UI sync. As a result of this returning false, the session ID link in the traces table was broken

dbczumar · 2025-11-24T05:48:01Z

mlflow/server/js/src/shared/web-shared/model-trace-explorer/FeatureUtils.ts

 };

-export const shouldEnableChatSessionsTab = () => {
-  return false;


Similar bug in Databricks -> MLflow UI sync

Signed-off-by: dbczumar <corey.zumar@databricks.com>

dbczumar · 2025-11-24T05:49:40Z

mlflow/server/js/src/common/utils/FeatureUtils.ts

-export const shouldEnableChatSessionsTab = () => {
-  return true;
-};


I don't believe we need these flags / gates for "should enable chat session" anymore. Looks like they had some unintended consequences - https://github.com/mlflow/mlflow/pull/18985/files#r2554699617.

i'm guessing it's fine if we remove the flag from databricks as well given it's fully released anyway?

dbczumar · 2025-11-24T05:51:31Z

.../src/experiment-tracking/components/experiment-page/components/traces-v3/TracesV3Toolbar.tsx

+          <Tooltip
+            componentId="mlflow.chat-sessions.copy-session-id"
+            content={
+              showCopyTooltip ? (
+                <FormattedMessage defaultMessage="Copied!" description="Tooltip after copying session ID" />
+              ) : (
+                <FormattedMessage defaultMessage="Copy session ID" description="Tooltip for copy session ID button" />
+              )
+            }
+            open={showCopyTooltip ? true : undefined}
+          >
+            <CopyIcon
+              onClick={handleCopySessionId}
+              css={{
+                cursor: 'pointer',
+                color: theme.colors.textSecondary,
+                fontSize: 16,
+                '&:hover': {
+                  color: theme.colors.textPrimary,
+                },
+              }}
+            />
+          </Tooltip>


While we're here, add a copy button for session ID to the chat sessions UI:

let's reuse <CopyActionButton> for this! import from @databricks/web-shared/copy

Awesome - reused!

dbczumar · 2025-11-24T05:52:22Z

...tracking/pages/experiment-chat-sessions/single-chat-view/ExperimentSingleChatSessionPage.tsx

-    return <div />;
-  }
+  useEffect(() => {
+    if (selectedTraceIdFromUrl && traces && traces.length > 0 && !isLoadingTraceDatas) {


Not sure if all of these conditions are needed... @daniellok-db , can you advise?

i think they are needed because if the traces aren't loaded there won't be anything to scroll to. plus we are using the traces array and searching through to find the selected trace so it makes sense to require them to be defined / contentful

Got it - thanks! :)

Signed-off-by: dbczumar <corey.zumar@databricks.com>

github-actions · 2025-11-24T06:02:37Z

Documentation preview for f0b0c01 is available at:

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

daniellok-db · 2025-11-24T06:09:17Z

...ow/server/js/src/shared/web-shared/genai-traces-table/cellRenderers/SessionIdLinkWrapper.tsx

 }: {
  sessionId: string;
  experimentId: string;
+  traceId?: string;


would this ever be null? this is rendered in the trace table so i suppose a trace would have to exist

Suggested change

traceId?: string;

traceId: string;

ah... i see the typescript types are kind of messed up in the trace table. i guess it's fine to leave it like this then

Thanks - yeah, I think this can probably be addressed in our upcoming trace table refactor?

daniellok-db · 2025-11-24T06:11:19Z

...ow/server/js/src/shared/web-shared/genai-traces-table/cellRenderers/SessionIdLinkWrapper.tsx

+  const url = traceId
+    ? `${MlflowUtils.getExperimentChatSessionPageRoute(experimentId, sessionId)}?selectedTraceId=${encodeURIComponent(
+        traceId,
+      )}`
+    : MlflowUtils.getExperimentChatSessionPageRoute(experimentId, sessionId);


related to above can we use URLSearchParams and get rid of the ternary if traceId doesn't have to be nullable? also nit: maybe define and export a const for selectedTraceId so it can be imported and used in the sessions tab as well.

Suggested change

const url = traceId

? `${MlflowUtils.getExperimentChatSessionPageRoute(experimentId, sessionId)}?selectedTraceId=${encodeURIComponent(

traceId,

)}`

: MlflowUtils.getExperimentChatSessionPageRoute(experimentId, sessionId);

const searchParams = new URLSearchParams({ selectedTraceId: traceId } );

const url = `${MlflowUtils.getExperimentChatSessionPageRoute(experimentId, sessionId)}?${searchParams.toString()}`

just saw that it's nullable to satisfy typescript. i think it's fine to keep the ternary then but let's still use URLSearchParams rather than calling encodeURIComponent. they are effectively the same but URLSearchParams is more canonical

Totally - done!

daniellok-db · 2025-11-24T06:17:03Z

mlflow/server/js/src/shared/web-shared/model-trace-explorer/ModelTraceHeaderSessionIdTag.tsx

+        content={<FormattedMessage defaultMessage="View chat session" description="Tooltip for the session id tag" />}
      >
-        <Link to={getExperimentChatSessionPageRoute(experimentId, sessionId)} target="_blank" rel="noopener noreferrer">
+        <Link to={sessionPageUrl}>


was it intentional to remove the open in new tab behavior? i imagine it might be useful to default to new tab if the user is browsing through the trace and wants to view the session later.

Just personal preference - I found it a bit confusing that the session always opened in a new tab, whereas other links in the MLflow UI don't create new tabs. If the dev wants a new tab, they can command + click

daniellok-db

overall LGTM but let's address the comments before merge

daniellok-db · 2025-11-24T06:21:09Z

...rver/js/src/shared/web-shared/genai-traces-table/cellRenderers/SessionIdLinkWrapper.test.tsx

@@ -0,0 +1,58 @@
+import { render, screen } from '@testing-library/react';
+import { IntlProvider } from 'react-intl';
+import { MemoryRouter } from 'react-router-dom';


use TestRouter from here:

mlflow/mlflow/server/js/src/shared/web-shared/genai-traces-table/utils/RoutingTestUtils.tsx

Line 24 in 5388ea0

export const TestRouter = ({ routes, history, initialEntries }: TestRouterProps) => {

Awesome - done :)

Signed-off-by: dbczumar <corey.zumar@databricks.com>

dbczumar

Thanks for the review, @daniellok-db :). Will merge when tests pass

dbczumar · 2025-11-24T15:18:50Z

.../src/experiment-tracking/components/experiment-page/components/traces-v3/TracesV3Toolbar.tsx

+          <Tooltip
+            componentId="mlflow.chat-sessions.copy-session-id"
+            content={
+              showCopyTooltip ? (
+                <FormattedMessage defaultMessage="Copied!" description="Tooltip after copying session ID" />
+              ) : (
+                <FormattedMessage defaultMessage="Copy session ID" description="Tooltip for copy session ID button" />
+              )
+            }
+            open={showCopyTooltip ? true : undefined}
+          >
+            <CopyIcon
+              onClick={handleCopySessionId}
+              css={{
+                cursor: 'pointer',
+                color: theme.colors.textSecondary,
+                fontSize: 16,
+                '&:hover': {
+                  color: theme.colors.textPrimary,
+                },
+              }}
+            />
+          </Tooltip>


Awesome - reused!

dbczumar · 2025-11-24T15:19:18Z

...rver/js/src/shared/web-shared/genai-traces-table/cellRenderers/SessionIdLinkWrapper.test.tsx

@@ -0,0 +1,58 @@
+import { render, screen } from '@testing-library/react';
+import { IntlProvider } from 'react-intl';
+import { MemoryRouter } from 'react-router-dom';


Awesome - done :)

dbczumar · 2025-11-24T15:19:55Z

...ow/server/js/src/shared/web-shared/genai-traces-table/cellRenderers/SessionIdLinkWrapper.tsx

 }: {
  sessionId: string;
  experimentId: string;
+  traceId?: string;


Thanks - yeah, I think this can probably be addressed in our upcoming trace table refactor?

dbczumar · 2025-11-24T15:20:27Z

...ow/server/js/src/shared/web-shared/genai-traces-table/cellRenderers/SessionIdLinkWrapper.tsx

+  const url = traceId
+    ? `${MlflowUtils.getExperimentChatSessionPageRoute(experimentId, sessionId)}?selectedTraceId=${encodeURIComponent(
+        traceId,
+      )}`
+    : MlflowUtils.getExperimentChatSessionPageRoute(experimentId, sessionId);


Totally - done!

dbczumar · 2025-11-24T15:22:04Z

mlflow/server/js/src/shared/web-shared/model-trace-explorer/ModelTraceHeaderSessionIdTag.tsx

+        content={<FormattedMessage defaultMessage="View chat session" description="Tooltip for the session id tag" />}
      >
-        <Link to={getExperimentChatSessionPageRoute(experimentId, sessionId)} target="_blank" rel="noopener noreferrer">
+        <Link to={sessionPageUrl}>


Just personal preference - I found it a bit confusing that the session always opened in a new tab, whereas other links in the MLflow UI don't create new tabs. If the dev wants a new tab, they can command + click

dbczumar · 2025-11-24T15:22:32Z

...tracking/pages/experiment-chat-sessions/single-chat-view/ExperimentSingleChatSessionPage.tsx

-    return <div />;
-  }
+  useEffect(() => {
+    if (selectedTraceIdFromUrl && traces && traces.length > 0 && !isLoadingTraceDatas) {


Got it - thanks! :)

Signed-off-by: dbczumar <corey.zumar@databricks.com>

dbczumar added 2 commits November 23, 2025 21:21

fix

7b6d3c6

Signed-off-by: dbczumar <corey.zumar@databricks.com>

fix

a5c3067

Signed-off-by: dbczumar <corey.zumar@databricks.com>

github-actions bot added v3.6.1 area/uiux Front-end, user experience, plotting, JavaScript, JavaScript dev server rn/none List under Small Changes in Changelogs. labels Nov 24, 2025

dbczumar commented Nov 24, 2025

View reviewed changes

fix

7f94753

Signed-off-by: dbczumar <corey.zumar@databricks.com>

dbczumar commented Nov 24, 2025

View reviewed changes

fix

3d1d763

Signed-off-by: dbczumar <corey.zumar@databricks.com>

daniellok-db reviewed Nov 24, 2025

View reviewed changes

daniellok-db approved these changes Nov 24, 2025

View reviewed changes

daniellok-db reviewed Nov 24, 2025

View reviewed changes

fix

dc5877f

Signed-off-by: dbczumar <corey.zumar@databricks.com>

dbczumar commented Nov 24, 2025

View reviewed changes

fix

f0b0c01

Signed-off-by: dbczumar <corey.zumar@databricks.com>

dbczumar enabled auto-merge November 24, 2025 15:53

dbczumar disabled auto-merge November 24, 2025 16:53

dbczumar merged commit d602f20 into mlflow:master Nov 24, 2025
49 of 51 checks passed

Conversation

dbczumar commented Nov 24, 2025 • edited by github-actions bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Install mlflow from this 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!

dbczumar Nov 24, 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!

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!

github-actions bot commented Nov 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

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!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

daniellok-db left a comment

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!

dbczumar left a comment

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!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

dbczumar commented Nov 24, 2025 •

edited by github-actions bot

Loading

dbczumar Nov 24, 2025 •

edited

Loading

github-actions bot commented Nov 24, 2025 •

edited

Loading