@mastra/playground-ui 60.2.0-alpha.1 → 60.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/LogsDataList.cjs.js +0 -2
- package/dist/components/LogsDataList.cjs.js.map +1 -1
- package/dist/components/LogsDataList.es.js +0 -2
- package/dist/components/LogsDataList.es.js.map +1 -1
- package/dist/components/MainSidebar.cjs.js +11 -125
- package/dist/components/MainSidebar.cjs.js.map +1 -1
- package/dist/components/MainSidebar.es.js +1 -120
- package/dist/components/MainSidebar.es.js.map +1 -1
- package/dist/domains/chat/tools/badges/workflow-badge.cjs.js +1 -1
- package/dist/domains/chat/tools/badges/workflow-badge.es.js +1 -1
- package/dist/domains/scores/components/trace-scores-tab.cjs.js +0 -1
- package/dist/domains/scores/components/trace-scores-tab.cjs.js.map +1 -1
- package/dist/domains/scores/components/trace-scores-tab.es.js +0 -1
- package/dist/domains/scores/components/trace-scores-tab.es.js.map +1 -1
- package/dist/domains/traces/components/thread-view-by-trace.cjs.js +1 -0
- package/dist/domains/traces/components/thread-view-by-trace.cjs.js.map +1 -1
- package/dist/domains/traces/components/thread-view-by-trace.es.js +1 -0
- package/dist/domains/traces/components/thread-view-by-trace.es.js.map +1 -1
- package/dist/domains/traces/components/trace-data-panel.cjs.js +1 -1
- package/dist/domains/traces/components/trace-data-panel.es.js +1 -1
- package/dist/domains/traces/components/traces-page-skeleton.cjs.js +0 -2
- package/dist/domains/traces/components/traces-page-skeleton.cjs.js.map +1 -1
- package/dist/domains/traces/components/traces-page-skeleton.es.js +0 -2
- package/dist/domains/traces/components/traces-page-skeleton.es.js.map +1 -1
- package/dist/ee/signals/components/entity-index-list.cjs.js +0 -2
- package/dist/ee/signals/components/entity-index-list.cjs.js.map +1 -1
- package/dist/ee/signals/components/entity-index-list.es.js +0 -2
- package/dist/ee/signals/components/entity-index-list.es.js.map +1 -1
- package/dist/ee/signals/components/trace-intelligence-entity-index.cjs.js +0 -1
- package/dist/ee/signals/components/trace-intelligence-entity-index.cjs.js.map +1 -1
- package/dist/ee/signals/components/trace-intelligence-entity-index.es.js +0 -1
- package/dist/ee/signals/components/trace-intelligence-entity-index.es.js.map +1 -1
- package/dist/{main-sidebar-link-active-buZAhlHo.js → main-sidebar-B0ivY7lW.js} +118 -6
- package/dist/main-sidebar-B0ivY7lW.js.map +1 -0
- package/dist/{main-sidebar-link-active-D8VSuJKx.cjs → main-sidebar-BWKVSRoQ.cjs} +117 -4
- package/dist/main-sidebar-BWKVSRoQ.cjs.map +1 -0
- package/dist/new/sidebar.cjs.js +34 -34
- package/dist/new/sidebar.cjs.js.map +1 -1
- package/dist/new/sidebar.es.js +2 -2
- package/package.json +10 -10
- package/dist/main-sidebar-link-active-D8VSuJKx.cjs.map +0 -1
- package/dist/main-sidebar-link-active-buZAhlHo.js.map +0 -1
|
@@ -4,8 +4,6 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
|
4
4
|
|
|
5
5
|
const logsDataList = require('../logs-data-list-B9CAqAHD.cjs');
|
|
6
6
|
const dataListSkeleton = require('../data-list-skeleton-DuqQkzwC.cjs');
|
|
7
|
-
require('react');
|
|
8
|
-
require('../keyboard/keyboard-shortcuts-context.cjs.js');
|
|
9
7
|
|
|
10
8
|
|
|
11
9
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LogsDataList.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"LogsDataList.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LogsDataList.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"LogsDataList.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
|
|
@@ -2,132 +2,18 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
4
|
|
|
5
|
-
const
|
|
6
|
-
const utils_cn = require('../cn-DG0X1KEP.cjs');
|
|
7
|
-
const mainSidebarLinkActive = require('../main-sidebar-link-active-D8VSuJKx.cjs');
|
|
8
|
-
const reactVisuallyHidden = require('@radix-ui/react-visually-hidden');
|
|
9
|
-
const React = require('react');
|
|
5
|
+
const mainSidebar = require('../main-sidebar-BWKVSRoQ.cjs');
|
|
10
6
|
|
|
11
|
-
function MainSidebarBottom({ className, children, ...props }) {
|
|
12
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils_cn.cn("mt-auto", className), ...props, children });
|
|
13
|
-
}
|
|
14
7
|
|
|
15
|
-
function MainSidebarNavHeader({
|
|
16
|
-
children,
|
|
17
|
-
className,
|
|
18
|
-
state: stateProp,
|
|
19
|
-
href,
|
|
20
|
-
isActive,
|
|
21
|
-
LinkComponent: LinkProp,
|
|
22
|
-
...props
|
|
23
|
-
}) {
|
|
24
|
-
const ctx = mainSidebarLinkActive.useMaybeSidebarState();
|
|
25
|
-
const state = stateProp ?? ctx?.state ?? "default";
|
|
26
|
-
const isMobile = ctx?.isMobile ?? false;
|
|
27
|
-
const Link = LinkProp ?? ctx?.LinkComponent ?? "a";
|
|
28
|
-
const showTitle = state === "default" && !isMobile;
|
|
29
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils_cn.cn("mt-2 mb-0.5 flex min-h-8 min-w-0 items-center", className), children: showTitle ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
30
|
-
"header",
|
|
31
|
-
{
|
|
32
|
-
...props,
|
|
33
|
-
className: utils_cn.cn("max-w-full min-w-0 truncate pl-3 text-column", {
|
|
34
|
-
"text-foreground": isActive,
|
|
35
|
-
"text-muted-foreground/70": !isActive
|
|
36
|
-
}),
|
|
37
|
-
children: href ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
38
|
-
Link,
|
|
39
|
-
{
|
|
40
|
-
href,
|
|
41
|
-
className: utils_cn.cn("block min-w-0 truncate transition-colors duration-normal", {
|
|
42
|
-
"hover:text-foreground": !isActive,
|
|
43
|
-
"text-foreground": isActive
|
|
44
|
-
}),
|
|
45
|
-
children
|
|
46
|
-
}
|
|
47
|
-
) : children
|
|
48
|
-
}
|
|
49
|
-
) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
50
|
-
/* @__PURE__ */ jsxRuntime.jsx(reactVisuallyHidden.VisuallyHidden, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("header", { ...props, children }) }),
|
|
51
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", { "aria-hidden": "true", className: "mx-3 h-px flex-1 bg-border" })
|
|
52
|
-
] }) });
|
|
53
|
-
}
|
|
54
8
|
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
level,
|
|
66
|
-
subItems: childLinks.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(mainSidebarLinkActive.MainSidebarNavList, { className: "mt-0.5", children: childLinks.map((child) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
67
|
-
MainSidebarSectionLink,
|
|
68
|
-
{
|
|
69
|
-
link: child,
|
|
70
|
-
activeCandidates,
|
|
71
|
-
level: level + 1,
|
|
72
|
-
isActive
|
|
73
|
-
},
|
|
74
|
-
getLinkKey(child)
|
|
75
|
-
)) }) : null
|
|
76
|
-
}
|
|
77
|
-
);
|
|
78
|
-
}
|
|
79
|
-
function MainSidebarSections({ sections, isActive, className }) {
|
|
80
|
-
const baseId = React.useId();
|
|
81
|
-
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: sections.map((section) => {
|
|
82
|
-
const showSeparator = section.links.length > 0 && section.separator;
|
|
83
|
-
const headerId = section.title ? `${baseId}-${section.key}` : void 0;
|
|
84
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
85
|
-
mainSidebarLinkActive.MainSidebarNavSection,
|
|
86
|
-
{
|
|
87
|
-
className,
|
|
88
|
-
"aria-labelledby": headerId,
|
|
89
|
-
"aria-label": !headerId ? section.key : void 0,
|
|
90
|
-
children: [
|
|
91
|
-
showSeparator ? /* @__PURE__ */ jsxRuntime.jsx(mainSidebarLinkActive.MainSidebarNavSeparator, {}) : null,
|
|
92
|
-
section.title ? /* @__PURE__ */ jsxRuntime.jsx(MainSidebarNavHeader, { id: headerId, href: section.href, isActive: section.isHeaderActive, children: section.title }) : null,
|
|
93
|
-
/* @__PURE__ */ jsxRuntime.jsx(mainSidebarLinkActive.MainSidebarNavList, { children: section.links.map((link) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
94
|
-
MainSidebarSectionLink,
|
|
95
|
-
{
|
|
96
|
-
link,
|
|
97
|
-
activeCandidates: section.links,
|
|
98
|
-
isActive
|
|
99
|
-
},
|
|
100
|
-
getLinkKey(link)
|
|
101
|
-
)) })
|
|
102
|
-
]
|
|
103
|
-
},
|
|
104
|
-
section.key
|
|
105
|
-
);
|
|
106
|
-
}) });
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
const MainSidebar = Object.assign(mainSidebarLinkActive.MainSidebarRoot, {
|
|
110
|
-
Bottom: MainSidebarBottom,
|
|
111
|
-
Nav: mainSidebarLinkActive.MainSidebarNav,
|
|
112
|
-
NavSection: mainSidebarLinkActive.MainSidebarNavSection,
|
|
113
|
-
NavLink: mainSidebarLinkActive.MainSidebarNavLink,
|
|
114
|
-
NavLabel: mainSidebarLinkActive.MainSidebarNavLabel,
|
|
115
|
-
NavHeader: MainSidebarNavHeader,
|
|
116
|
-
NavList: mainSidebarLinkActive.MainSidebarNavList,
|
|
117
|
-
NavSeparator: mainSidebarLinkActive.MainSidebarNavSeparator,
|
|
118
|
-
Sections: MainSidebarSections,
|
|
119
|
-
Trigger: mainSidebarLinkActive.MainSidebarTrigger,
|
|
120
|
-
MobileTrigger: mainSidebarLinkActive.MainSidebarMobileTrigger
|
|
121
|
-
});
|
|
122
|
-
|
|
123
|
-
exports.MainSidebarMobileTrigger = mainSidebarLinkActive.MainSidebarMobileTrigger;
|
|
124
|
-
exports.MainSidebarProvider = mainSidebarLinkActive.MainSidebarProvider;
|
|
125
|
-
exports.MainSidebarTrigger = mainSidebarLinkActive.MainSidebarTrigger;
|
|
126
|
-
exports.getIsLinkActive = mainSidebarLinkActive.getIsLinkActive;
|
|
127
|
-
exports.navItemClasses = mainSidebarLinkActive.navItemClasses;
|
|
128
|
-
exports.useMainSidebar = mainSidebarLinkActive.useMainSidebar;
|
|
129
|
-
exports.useMaybeSidebar = mainSidebarLinkActive.useMaybeSidebar;
|
|
130
|
-
exports.useMaybeSidebarState = mainSidebarLinkActive.useMaybeSidebarState;
|
|
131
|
-
exports.useMobileDrawer = mainSidebarLinkActive.useMobileDrawer;
|
|
132
|
-
exports.MainSidebar = MainSidebar;
|
|
9
|
+
exports.MainSidebar = mainSidebar.MainSidebar;
|
|
10
|
+
exports.MainSidebarMobileTrigger = mainSidebar.MainSidebarMobileTrigger;
|
|
11
|
+
exports.MainSidebarProvider = mainSidebar.MainSidebarProvider;
|
|
12
|
+
exports.MainSidebarTrigger = mainSidebar.MainSidebarTrigger;
|
|
13
|
+
exports.getIsLinkActive = mainSidebar.getIsLinkActive;
|
|
14
|
+
exports.navItemClasses = mainSidebar.navItemClasses;
|
|
15
|
+
exports.useMainSidebar = mainSidebar.useMainSidebar;
|
|
16
|
+
exports.useMaybeSidebar = mainSidebar.useMaybeSidebar;
|
|
17
|
+
exports.useMaybeSidebarState = mainSidebar.useMaybeSidebarState;
|
|
18
|
+
exports.useMobileDrawer = mainSidebar.useMobileDrawer;
|
|
133
19
|
//# sourceMappingURL=MainSidebar.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MainSidebar.cjs.js","sources":["../../src/ds/components/MainSidebar/main-sidebar-bottom.tsx","../../src/ds/components/MainSidebar/main-sidebar-nav-header.tsx","../../src/ds/components/MainSidebar/main-sidebar-sections.tsx","../../src/ds/components/MainSidebar/main-sidebar.ts"],"sourcesContent":["import type { ComponentPropsWithoutRef } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport type MainSidebarBottomProps = ComponentPropsWithoutRef<'div'>;\n\nexport function MainSidebarBottom({ className, children, ...props }: MainSidebarBottomProps) {\n return (\n <div className={cn('mt-auto', className)} {...props}>\n {children}\n </div>\n );\n}\n","import type { ComponentPropsWithoutRef } from 'react';\nimport type { SidebarState } from './main-sidebar-context';\nimport { useMaybeSidebarState } from './main-sidebar-context';\nimport { VisuallyHidden } from '@/ds/primitives/visually-hidden';\nimport type { LinkComponent } from '@/ds/types/link-component';\nimport { cn } from '@/lib/utils';\n\nexport type MainSidebarNavHeaderProps = Omit<ComponentPropsWithoutRef<'header'>, 'children'> & {\n children?: React.ReactNode;\n state?: SidebarState;\n href?: string;\n isActive?: boolean;\n LinkComponent?: LinkComponent;\n};\nexport function MainSidebarNavHeader({\n children,\n className,\n state: stateProp,\n href,\n isActive,\n LinkComponent: LinkProp,\n ...props\n}: MainSidebarNavHeaderProps) {\n const ctx = useMaybeSidebarState();\n const state: SidebarState = stateProp ?? ctx?.state ?? 'default';\n const isMobile = ctx?.isMobile ?? false;\n const Link: LinkComponent = LinkProp ?? ctx?.LinkComponent ?? 'a';\n const showTitle = state === 'default' && !isMobile;\n\n return (\n <div className={cn('mt-2 mb-0.5 flex min-h-8 min-w-0 items-center', className)}>\n {showTitle ? (\n <header\n {...props}\n className={cn('max-w-full min-w-0 truncate pl-3 text-column', {\n 'text-foreground': isActive,\n 'text-muted-foreground/70': !isActive,\n })}\n >\n {href ? (\n <Link\n href={href}\n className={cn('block min-w-0 truncate transition-colors duration-normal', {\n 'hover:text-foreground': !isActive,\n 'text-foreground': isActive,\n })}\n >\n {children}\n </Link>\n ) : (\n children\n )}\n </header>\n ) : (\n <>\n <VisuallyHidden asChild>\n <header {...props}>{children}</header>\n </VisuallyHidden>\n <div aria-hidden=\"true\" className=\"mx-3 h-px flex-1 bg-border\" />\n </>\n )}\n </div>\n );\n}\n","import { useId } from 'react';\nimport { MainSidebarNavHeader } from './main-sidebar-nav-header';\nimport { MainSidebarNavLink } from './main-sidebar-nav-link';\nimport type { NavLink } from './main-sidebar-nav-link';\nimport { MainSidebarNavList } from './main-sidebar-nav-list';\nimport { MainSidebarNavSection } from './main-sidebar-nav-section';\nimport type { NavSection } from './main-sidebar-nav-section';\nimport { MainSidebarNavSeparator } from './main-sidebar-nav-separator';\n\nexport type MainSidebarSectionsProps = {\n sections: NavSection[];\n /**\n * Called per link to decide the active state. Receives the section's links so\n * callers can use section-aware active logic without re-scanning `sections`\n * from the outside. Default: each link's `isActive`.\n */\n isActive?: (link: NavLink, activeCandidates: NavLink[]) => boolean;\n className?: string;\n};\n\ntype MainSidebarSectionLinkProps = {\n link: NavLink;\n activeCandidates: NavLink[];\n level?: number;\n isActive?: MainSidebarSectionsProps['isActive'];\n};\n\nfunction getLinkKey(link: NavLink) {\n return `${link.url}:${link.name}`;\n}\n\nfunction MainSidebarSectionLink({ link, activeCandidates, level = 0, isActive }: MainSidebarSectionLinkProps) {\n const childLinks = link.children ?? [];\n\n return (\n <MainSidebarNavLink\n link={link}\n isActive={isActive?.(link, activeCandidates) ?? link.isActive}\n level={level}\n subItems={\n childLinks.length > 0 ? (\n <MainSidebarNavList className=\"mt-0.5\">\n {childLinks.map(child => (\n <MainSidebarSectionLink\n key={getLinkKey(child)}\n link={child}\n activeCandidates={activeCandidates}\n level={level + 1}\n isActive={isActive}\n />\n ))}\n </MainSidebarNavList>\n ) : null\n }\n />\n );\n}\n\nexport function MainSidebarSections({ sections, isActive, className }: MainSidebarSectionsProps) {\n const baseId = useId();\n\n return (\n <>\n {sections.map(section => {\n const showSeparator = section.links.length > 0 && section.separator;\n const headerId = section.title ? `${baseId}-${section.key}` : undefined;\n return (\n <MainSidebarNavSection\n key={section.key}\n className={className}\n aria-labelledby={headerId}\n aria-label={!headerId ? section.key : undefined}\n >\n {/* Render separator and header independently — a section can have\n both (titled group preceded by a divider). */}\n {showSeparator ? <MainSidebarNavSeparator /> : null}\n {section.title ? (\n <MainSidebarNavHeader id={headerId} href={section.href} isActive={section.isHeaderActive}>\n {section.title}\n </MainSidebarNavHeader>\n ) : null}\n <MainSidebarNavList>\n {section.links.map(link => (\n <MainSidebarSectionLink\n key={getLinkKey(link)}\n link={link}\n activeCandidates={section.links}\n isActive={isActive}\n />\n ))}\n </MainSidebarNavList>\n </MainSidebarNavSection>\n );\n })}\n </>\n );\n}\n","import { MainSidebarBottom } from './main-sidebar-bottom';\nimport { MainSidebarMobileTrigger } from './main-sidebar-mobile-trigger';\nimport { MainSidebarNav } from './main-sidebar-nav';\nimport { MainSidebarNavHeader } from './main-sidebar-nav-header';\nimport { MainSidebarNavLabel } from './main-sidebar-nav-label';\nimport { MainSidebarNavLink } from './main-sidebar-nav-link';\nimport { MainSidebarNavList } from './main-sidebar-nav-list';\nimport { MainSidebarNavSection } from './main-sidebar-nav-section';\nimport { MainSidebarNavSeparator } from './main-sidebar-nav-separator';\nimport { MainSidebarRoot } from './main-sidebar-root';\nimport { MainSidebarSections } from './main-sidebar-sections';\nimport { MainSidebarTrigger } from './main-sidebar-trigger';\n\nexport type { MainSidebarStateContextValue, MobileDrawerContextValue, SidebarState } from './main-sidebar-context';\nexport { useMainSidebar, useMaybeSidebar, useMaybeSidebarState, useMobileDrawer } from './main-sidebar-context';\nexport { MainSidebarProvider, type MainSidebarProviderProps } from './main-sidebar-provider';\nexport { navItemClasses } from './main-sidebar-nav-item-classes';\nexport { type MainSidebarNavItemSize } from './main-sidebar-nav-item-classes';\nexport { type NavLink } from './main-sidebar-nav-link';\nexport { type NavSection } from './main-sidebar-nav-section';\nexport { MainSidebarTrigger } from './main-sidebar-trigger';\nexport { MainSidebarMobileTrigger } from './main-sidebar-mobile-trigger';\nexport { getIsLinkActive } from './main-sidebar-link-active';\n\nexport const MainSidebar = Object.assign(MainSidebarRoot, {\n Bottom: MainSidebarBottom,\n Nav: MainSidebarNav,\n NavSection: MainSidebarNavSection,\n NavLink: MainSidebarNavLink,\n NavLabel: MainSidebarNavLabel,\n NavHeader: MainSidebarNavHeader,\n NavList: MainSidebarNavList,\n NavSeparator: MainSidebarNavSeparator,\n Sections: MainSidebarSections,\n Trigger: MainSidebarTrigger,\n MobileTrigger: MainSidebarMobileTrigger,\n});\n"],"names":["jsx","cn","useMaybeSidebarState","jsxs","Fragment","VisuallyHidden","MainSidebarNavLink","MainSidebarNavList","useId","MainSidebarNavSection","MainSidebarNavSeparator","MainSidebarRoot","MainSidebarNav","MainSidebarNavLabel","MainSidebarTrigger","MainSidebarMobileTrigger"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MainSidebar.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}
|
|
@@ -1,121 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
import { c as cn } from '../cn-65Adrsfj.js';
|
|
3
|
-
import { u as useMaybeSidebarState, M as MainSidebarNavSection, a as MainSidebarNavSeparator, b as MainSidebarNavList, c as MainSidebarNavLink, d as MainSidebarRoot, e as MainSidebarMobileTrigger, f as MainSidebarTrigger, g as MainSidebarNavLabel, h as MainSidebarNav } from '../main-sidebar-link-active-buZAhlHo.js';
|
|
4
|
-
export { i as MainSidebarProvider, j as getIsLinkActive, n as navItemClasses, k as useMainSidebar, l as useMaybeSidebar, m as useMobileDrawer } from '../main-sidebar-link-active-buZAhlHo.js';
|
|
5
|
-
import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
|
|
6
|
-
import { useId } from 'react';
|
|
7
|
-
|
|
8
|
-
function MainSidebarBottom({ className, children, ...props }) {
|
|
9
|
-
return /* @__PURE__ */ jsx("div", { className: cn("mt-auto", className), ...props, children });
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
function MainSidebarNavHeader({
|
|
13
|
-
children,
|
|
14
|
-
className,
|
|
15
|
-
state: stateProp,
|
|
16
|
-
href,
|
|
17
|
-
isActive,
|
|
18
|
-
LinkComponent: LinkProp,
|
|
19
|
-
...props
|
|
20
|
-
}) {
|
|
21
|
-
const ctx = useMaybeSidebarState();
|
|
22
|
-
const state = stateProp ?? ctx?.state ?? "default";
|
|
23
|
-
const isMobile = ctx?.isMobile ?? false;
|
|
24
|
-
const Link = LinkProp ?? ctx?.LinkComponent ?? "a";
|
|
25
|
-
const showTitle = state === "default" && !isMobile;
|
|
26
|
-
return /* @__PURE__ */ jsx("div", { className: cn("mt-2 mb-0.5 flex min-h-8 min-w-0 items-center", className), children: showTitle ? /* @__PURE__ */ jsx(
|
|
27
|
-
"header",
|
|
28
|
-
{
|
|
29
|
-
...props,
|
|
30
|
-
className: cn("max-w-full min-w-0 truncate pl-3 text-column", {
|
|
31
|
-
"text-foreground": isActive,
|
|
32
|
-
"text-muted-foreground/70": !isActive
|
|
33
|
-
}),
|
|
34
|
-
children: href ? /* @__PURE__ */ jsx(
|
|
35
|
-
Link,
|
|
36
|
-
{
|
|
37
|
-
href,
|
|
38
|
-
className: cn("block min-w-0 truncate transition-colors duration-normal", {
|
|
39
|
-
"hover:text-foreground": !isActive,
|
|
40
|
-
"text-foreground": isActive
|
|
41
|
-
}),
|
|
42
|
-
children
|
|
43
|
-
}
|
|
44
|
-
) : children
|
|
45
|
-
}
|
|
46
|
-
) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
47
|
-
/* @__PURE__ */ jsx(VisuallyHidden, { asChild: true, children: /* @__PURE__ */ jsx("header", { ...props, children }) }),
|
|
48
|
-
/* @__PURE__ */ jsx("div", { "aria-hidden": "true", className: "mx-3 h-px flex-1 bg-border" })
|
|
49
|
-
] }) });
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
function getLinkKey(link) {
|
|
53
|
-
return `${link.url}:${link.name}`;
|
|
54
|
-
}
|
|
55
|
-
function MainSidebarSectionLink({ link, activeCandidates, level = 0, isActive }) {
|
|
56
|
-
const childLinks = link.children ?? [];
|
|
57
|
-
return /* @__PURE__ */ jsx(
|
|
58
|
-
MainSidebarNavLink,
|
|
59
|
-
{
|
|
60
|
-
link,
|
|
61
|
-
isActive: isActive?.(link, activeCandidates) ?? link.isActive,
|
|
62
|
-
level,
|
|
63
|
-
subItems: childLinks.length > 0 ? /* @__PURE__ */ jsx(MainSidebarNavList, { className: "mt-0.5", children: childLinks.map((child) => /* @__PURE__ */ jsx(
|
|
64
|
-
MainSidebarSectionLink,
|
|
65
|
-
{
|
|
66
|
-
link: child,
|
|
67
|
-
activeCandidates,
|
|
68
|
-
level: level + 1,
|
|
69
|
-
isActive
|
|
70
|
-
},
|
|
71
|
-
getLinkKey(child)
|
|
72
|
-
)) }) : null
|
|
73
|
-
}
|
|
74
|
-
);
|
|
75
|
-
}
|
|
76
|
-
function MainSidebarSections({ sections, isActive, className }) {
|
|
77
|
-
const baseId = useId();
|
|
78
|
-
return /* @__PURE__ */ jsx(Fragment, { children: sections.map((section) => {
|
|
79
|
-
const showSeparator = section.links.length > 0 && section.separator;
|
|
80
|
-
const headerId = section.title ? `${baseId}-${section.key}` : void 0;
|
|
81
|
-
return /* @__PURE__ */ jsxs(
|
|
82
|
-
MainSidebarNavSection,
|
|
83
|
-
{
|
|
84
|
-
className,
|
|
85
|
-
"aria-labelledby": headerId,
|
|
86
|
-
"aria-label": !headerId ? section.key : void 0,
|
|
87
|
-
children: [
|
|
88
|
-
showSeparator ? /* @__PURE__ */ jsx(MainSidebarNavSeparator, {}) : null,
|
|
89
|
-
section.title ? /* @__PURE__ */ jsx(MainSidebarNavHeader, { id: headerId, href: section.href, isActive: section.isHeaderActive, children: section.title }) : null,
|
|
90
|
-
/* @__PURE__ */ jsx(MainSidebarNavList, { children: section.links.map((link) => /* @__PURE__ */ jsx(
|
|
91
|
-
MainSidebarSectionLink,
|
|
92
|
-
{
|
|
93
|
-
link,
|
|
94
|
-
activeCandidates: section.links,
|
|
95
|
-
isActive
|
|
96
|
-
},
|
|
97
|
-
getLinkKey(link)
|
|
98
|
-
)) })
|
|
99
|
-
]
|
|
100
|
-
},
|
|
101
|
-
section.key
|
|
102
|
-
);
|
|
103
|
-
}) });
|
|
104
|
-
}
|
|
105
|
-
|
|
106
|
-
const MainSidebar = Object.assign(MainSidebarRoot, {
|
|
107
|
-
Bottom: MainSidebarBottom,
|
|
108
|
-
Nav: MainSidebarNav,
|
|
109
|
-
NavSection: MainSidebarNavSection,
|
|
110
|
-
NavLink: MainSidebarNavLink,
|
|
111
|
-
NavLabel: MainSidebarNavLabel,
|
|
112
|
-
NavHeader: MainSidebarNavHeader,
|
|
113
|
-
NavList: MainSidebarNavList,
|
|
114
|
-
NavSeparator: MainSidebarNavSeparator,
|
|
115
|
-
Sections: MainSidebarSections,
|
|
116
|
-
Trigger: MainSidebarTrigger,
|
|
117
|
-
MobileTrigger: MainSidebarMobileTrigger
|
|
118
|
-
});
|
|
119
|
-
|
|
120
|
-
export { MainSidebar, MainSidebarMobileTrigger, MainSidebarTrigger, useMaybeSidebarState };
|
|
1
|
+
export { M as MainSidebar, a as MainSidebarMobileTrigger, b as MainSidebarProvider, c as MainSidebarTrigger, g as getIsLinkActive, n as navItemClasses, u as useMainSidebar, d as useMaybeSidebar, e as useMaybeSidebarState, f as useMobileDrawer } from '../main-sidebar-B0ivY7lW.js';
|
|
121
2
|
//# sourceMappingURL=MainSidebar.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MainSidebar.es.js","sources":["../../src/ds/components/MainSidebar/main-sidebar-bottom.tsx","../../src/ds/components/MainSidebar/main-sidebar-nav-header.tsx","../../src/ds/components/MainSidebar/main-sidebar-sections.tsx","../../src/ds/components/MainSidebar/main-sidebar.ts"],"sourcesContent":["import type { ComponentPropsWithoutRef } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport type MainSidebarBottomProps = ComponentPropsWithoutRef<'div'>;\n\nexport function MainSidebarBottom({ className, children, ...props }: MainSidebarBottomProps) {\n return (\n <div className={cn('mt-auto', className)} {...props}>\n {children}\n </div>\n );\n}\n","import type { ComponentPropsWithoutRef } from 'react';\nimport type { SidebarState } from './main-sidebar-context';\nimport { useMaybeSidebarState } from './main-sidebar-context';\nimport { VisuallyHidden } from '@/ds/primitives/visually-hidden';\nimport type { LinkComponent } from '@/ds/types/link-component';\nimport { cn } from '@/lib/utils';\n\nexport type MainSidebarNavHeaderProps = Omit<ComponentPropsWithoutRef<'header'>, 'children'> & {\n children?: React.ReactNode;\n state?: SidebarState;\n href?: string;\n isActive?: boolean;\n LinkComponent?: LinkComponent;\n};\nexport function MainSidebarNavHeader({\n children,\n className,\n state: stateProp,\n href,\n isActive,\n LinkComponent: LinkProp,\n ...props\n}: MainSidebarNavHeaderProps) {\n const ctx = useMaybeSidebarState();\n const state: SidebarState = stateProp ?? ctx?.state ?? 'default';\n const isMobile = ctx?.isMobile ?? false;\n const Link: LinkComponent = LinkProp ?? ctx?.LinkComponent ?? 'a';\n const showTitle = state === 'default' && !isMobile;\n\n return (\n <div className={cn('mt-2 mb-0.5 flex min-h-8 min-w-0 items-center', className)}>\n {showTitle ? (\n <header\n {...props}\n className={cn('max-w-full min-w-0 truncate pl-3 text-column', {\n 'text-foreground': isActive,\n 'text-muted-foreground/70': !isActive,\n })}\n >\n {href ? (\n <Link\n href={href}\n className={cn('block min-w-0 truncate transition-colors duration-normal', {\n 'hover:text-foreground': !isActive,\n 'text-foreground': isActive,\n })}\n >\n {children}\n </Link>\n ) : (\n children\n )}\n </header>\n ) : (\n <>\n <VisuallyHidden asChild>\n <header {...props}>{children}</header>\n </VisuallyHidden>\n <div aria-hidden=\"true\" className=\"mx-3 h-px flex-1 bg-border\" />\n </>\n )}\n </div>\n );\n}\n","import { useId } from 'react';\nimport { MainSidebarNavHeader } from './main-sidebar-nav-header';\nimport { MainSidebarNavLink } from './main-sidebar-nav-link';\nimport type { NavLink } from './main-sidebar-nav-link';\nimport { MainSidebarNavList } from './main-sidebar-nav-list';\nimport { MainSidebarNavSection } from './main-sidebar-nav-section';\nimport type { NavSection } from './main-sidebar-nav-section';\nimport { MainSidebarNavSeparator } from './main-sidebar-nav-separator';\n\nexport type MainSidebarSectionsProps = {\n sections: NavSection[];\n /**\n * Called per link to decide the active state. Receives the section's links so\n * callers can use section-aware active logic without re-scanning `sections`\n * from the outside. Default: each link's `isActive`.\n */\n isActive?: (link: NavLink, activeCandidates: NavLink[]) => boolean;\n className?: string;\n};\n\ntype MainSidebarSectionLinkProps = {\n link: NavLink;\n activeCandidates: NavLink[];\n level?: number;\n isActive?: MainSidebarSectionsProps['isActive'];\n};\n\nfunction getLinkKey(link: NavLink) {\n return `${link.url}:${link.name}`;\n}\n\nfunction MainSidebarSectionLink({ link, activeCandidates, level = 0, isActive }: MainSidebarSectionLinkProps) {\n const childLinks = link.children ?? [];\n\n return (\n <MainSidebarNavLink\n link={link}\n isActive={isActive?.(link, activeCandidates) ?? link.isActive}\n level={level}\n subItems={\n childLinks.length > 0 ? (\n <MainSidebarNavList className=\"mt-0.5\">\n {childLinks.map(child => (\n <MainSidebarSectionLink\n key={getLinkKey(child)}\n link={child}\n activeCandidates={activeCandidates}\n level={level + 1}\n isActive={isActive}\n />\n ))}\n </MainSidebarNavList>\n ) : null\n }\n />\n );\n}\n\nexport function MainSidebarSections({ sections, isActive, className }: MainSidebarSectionsProps) {\n const baseId = useId();\n\n return (\n <>\n {sections.map(section => {\n const showSeparator = section.links.length > 0 && section.separator;\n const headerId = section.title ? `${baseId}-${section.key}` : undefined;\n return (\n <MainSidebarNavSection\n key={section.key}\n className={className}\n aria-labelledby={headerId}\n aria-label={!headerId ? section.key : undefined}\n >\n {/* Render separator and header independently — a section can have\n both (titled group preceded by a divider). */}\n {showSeparator ? <MainSidebarNavSeparator /> : null}\n {section.title ? (\n <MainSidebarNavHeader id={headerId} href={section.href} isActive={section.isHeaderActive}>\n {section.title}\n </MainSidebarNavHeader>\n ) : null}\n <MainSidebarNavList>\n {section.links.map(link => (\n <MainSidebarSectionLink\n key={getLinkKey(link)}\n link={link}\n activeCandidates={section.links}\n isActive={isActive}\n />\n ))}\n </MainSidebarNavList>\n </MainSidebarNavSection>\n );\n })}\n </>\n );\n}\n","import { MainSidebarBottom } from './main-sidebar-bottom';\nimport { MainSidebarMobileTrigger } from './main-sidebar-mobile-trigger';\nimport { MainSidebarNav } from './main-sidebar-nav';\nimport { MainSidebarNavHeader } from './main-sidebar-nav-header';\nimport { MainSidebarNavLabel } from './main-sidebar-nav-label';\nimport { MainSidebarNavLink } from './main-sidebar-nav-link';\nimport { MainSidebarNavList } from './main-sidebar-nav-list';\nimport { MainSidebarNavSection } from './main-sidebar-nav-section';\nimport { MainSidebarNavSeparator } from './main-sidebar-nav-separator';\nimport { MainSidebarRoot } from './main-sidebar-root';\nimport { MainSidebarSections } from './main-sidebar-sections';\nimport { MainSidebarTrigger } from './main-sidebar-trigger';\n\nexport type { MainSidebarStateContextValue, MobileDrawerContextValue, SidebarState } from './main-sidebar-context';\nexport { useMainSidebar, useMaybeSidebar, useMaybeSidebarState, useMobileDrawer } from './main-sidebar-context';\nexport { MainSidebarProvider, type MainSidebarProviderProps } from './main-sidebar-provider';\nexport { navItemClasses } from './main-sidebar-nav-item-classes';\nexport { type MainSidebarNavItemSize } from './main-sidebar-nav-item-classes';\nexport { type NavLink } from './main-sidebar-nav-link';\nexport { type NavSection } from './main-sidebar-nav-section';\nexport { MainSidebarTrigger } from './main-sidebar-trigger';\nexport { MainSidebarMobileTrigger } from './main-sidebar-mobile-trigger';\nexport { getIsLinkActive } from './main-sidebar-link-active';\n\nexport const MainSidebar = Object.assign(MainSidebarRoot, {\n Bottom: MainSidebarBottom,\n Nav: MainSidebarNav,\n NavSection: MainSidebarNavSection,\n NavLink: MainSidebarNavLink,\n NavLabel: MainSidebarNavLabel,\n NavHeader: MainSidebarNavHeader,\n NavList: MainSidebarNavList,\n NavSeparator: MainSidebarNavSeparator,\n Sections: MainSidebarSections,\n Trigger: MainSidebarTrigger,\n MobileTrigger: MainSidebarMobileTrigger,\n});\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MainSidebar.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -17,6 +17,7 @@ const domains_workflows_context_workflowRunContext = require('../../../workflows
|
|
|
17
17
|
require('@mastra/react');
|
|
18
18
|
require('@tanstack/react-query');
|
|
19
19
|
const domains_workflows_hooks_useWorkflow = require('../../../workflows/hooks/use-workflow.cjs.js');
|
|
20
|
+
require('../../../../toast-nm-fM7BR.cjs');
|
|
20
21
|
const domains_workflows_context_workflowStepDetailContext = require('../../../workflows/context/workflow-step-detail-context.cjs.js');
|
|
21
22
|
const domains_workflows_context_workflowStepDetailProvider = require('../../../workflows/context/workflow-step-detail-provider.cjs.js');
|
|
22
23
|
const domains_workflows_context_workflowSelectedStepContext = require('../../../workflows/context/workflow-selected-step-context.cjs.js');
|
|
@@ -40,7 +41,6 @@ require('@lukeed/uuid');
|
|
|
40
41
|
require('../../../../lib/form/dynamic-form.cjs.js');
|
|
41
42
|
const icons_WorkflowIcon = require('../../../../icons/WorkflowIcon.cjs.js');
|
|
42
43
|
require('@mastra/client-js');
|
|
43
|
-
require('../../../../keyboard/keyboard-shortcuts-context.cjs.js');
|
|
44
44
|
const lib_framework = require('../../../../lib/framework.cjs.js');
|
|
45
45
|
require('../../../workflows/components/workflow-information.cjs.js');
|
|
46
46
|
require('@base-ui/react/combobox');
|
|
@@ -13,6 +13,7 @@ import { WorkflowRunContext } from '../../../workflows/context/workflow-run-cont
|
|
|
13
13
|
import '@mastra/react';
|
|
14
14
|
import '@tanstack/react-query';
|
|
15
15
|
import { useWorkflow } from '../../../workflows/hooks/use-workflow.es.js';
|
|
16
|
+
import '../../../../toast-c5kCpyWt.js';
|
|
16
17
|
import { useWorkflowStepDetail } from '../../../workflows/context/workflow-step-detail-context.es.js';
|
|
17
18
|
import { WorkflowStepDetailProvider } from '../../../workflows/context/workflow-step-detail-provider.es.js';
|
|
18
19
|
import { WorkflowSelectedStepProvider } from '../../../workflows/context/workflow-selected-step-context.es.js';
|
|
@@ -36,7 +37,6 @@ import '@lukeed/uuid';
|
|
|
36
37
|
import '../../../../lib/form/dynamic-form.es.js';
|
|
37
38
|
import { WorkflowIcon } from '../../../../icons/WorkflowIcon.es.js';
|
|
38
39
|
import '@mastra/client-js';
|
|
39
|
-
import '../../../../keyboard/keyboard-shortcuts-context.es.js';
|
|
40
40
|
import { useLinkComponent } from '../../../../lib/framework.es.js';
|
|
41
41
|
import '../../../workflows/components/workflow-information.es.js';
|
|
42
42
|
import '@base-ui/react/combobox';
|
|
@@ -8,7 +8,6 @@ const React = require('react');
|
|
|
8
8
|
const domains_scores_hooks_useTraceSpanScores = require('../hooks/use-trace-span-scores.cjs.js');
|
|
9
9
|
const Button = require('../../../Button-CXhSUBxN.cjs');
|
|
10
10
|
const dataList = require('../../../data-list-Bqf-fhMx.cjs');
|
|
11
|
-
require('../../../keyboard/keyboard-shortcuts-context.cjs.js');
|
|
12
11
|
const EmptyState = require('../../../EmptyState-CuoMGNP0.cjs');
|
|
13
12
|
const metricsKpiCard = require('../../../metrics-kpi-card-1hbihR2T.cjs');
|
|
14
13
|
const spinner = require('../../../spinner-BCpN7LL9.cjs');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"trace-scores-tab.cjs.js","sources":["../../../../src/domains/scores/components/trace-scores-tab.tsx"],"sourcesContent":["import type { ClientScoreRowData, ListScoresResponse } from '@mastra/client-js';\nimport { ExternalLinkIcon } from 'lucide-react';\nimport { useState } from 'react';\nimport { useTraceSpanScores } from '../hooks/use-trace-span-scores';\nimport { Button } from '@/ds/components/Button';\nimport { DataList } from '@/ds/components/DataList';\nimport { EmptyState } from '@/ds/components/EmptyState';\nimport { MetricsKpiCard } from '@/ds/components/MetricsKpiCard';\nimport { Spinner } from '@/ds/components/Spinner';\nimport { getShortId } from '@/ds/components/Text';\nimport { Txt } from '@/ds/components/Txt';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { useLinkComponent } from '@/lib/framework';\nimport { cn } from '@/utils/cn';\nimport { formatDate } from '@/utils/date-format';\n\nconst REASON_PREVIEW_LENGTH = 100;\n\nexport type TraceScoresTabProps = {\n traceId: string;\n spanId: string;\n onScoreSelect: (scoreId: string) => void;\n};\n\n/**\n * Scores for the trace's anchor span, one card per scoring. Owns its own pagination:\n * mount it with a `key` on the trace/anchor pair so a page index never leaks across traces.\n */\nexport function TraceScoresTab({ traceId, spanId, onScoreSelect }: TraceScoresTabProps) {\n const [page, setPage] = useState(0);\n const { data: scoresData, isLoading } = useTraceSpanScores({ traceId, spanId, page });\n\n if (isLoading) {\n return (\n <div className=\"flex justify-center py-6\">\n <Spinner size=\"md\" variant=\"pulse\" className=\"text-placeholder\" />\n </div>\n );\n }\n\n const scores = scoresData?.scores ?? [];\n\n if (scores.length === 0) {\n return <EmptyState titleSlot=\"No scores yet\" descriptionSlot=\"Score this trace to see results here.\" />;\n }\n\n return (\n <div className=\"grid content-start gap-3\">\n {scores.map(score => (\n <TraceScoreCard key={score.id} score={score} onSelect={() => onScoreSelect(score.id)} />\n ))}\n <TraceScoresPagination pagination={scoresData?.pagination} onPageChange={setPage} />\n </div>\n );\n}\n\nfunction TraceScoreCard({ score, onSelect }: { score: ClientScoreRowData; onSelect: () => void }) {\n const createdAt = new Date(score.createdAt);\n const scorerName = String(score.scorer?.name || score.scorer?.id || 'Scorer');\n const { Link, paths } = useLinkComponent();\n const scorerHref = paths.scorerLink(score.scorerId, { scoreId: score.id });\n\n return (\n <MetricsKpiCard className=\"min-w-0\">\n <button\n type=\"button\"\n onClick={onSelect}\n aria-label={`Score ${getShortId(score.id)}`}\n className=\"grid gap-1 text-left\"\n >\n <MetricsKpiCard.Label>{scorerName}</MetricsKpiCard.Label>\n <MetricsKpiCard.Value>{String(score.score)}</MetricsKpiCard.Value>\n <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"tabular-nums\">\n <Txt as=\"span\" variant=\"meta\" font=\"mono\">\n {getShortId(score.id)}\n </Txt>{' '}\n · {formatDate(createdAt, 'date-time-seconds')}\n </Txt>\n </button>\n {score.reason && <TraceScoreReason reason={score.reason} />}\n {scorerHref && (\n <Button\n render={<Link href={scorerHref} />}\n variant=\"ghost\"\n size=\"sm\"\n className=\"-ml-2 justify-self-start\"\n icon={<ExternalLinkIcon />}\n >\n Open scorer run\n </Button>\n )}\n </MetricsKpiCard>\n );\n}\n\nfunction TraceScoreReason({ reason }: { reason: string }) {\n const [expanded, setExpanded] = useState(false);\n const isLong = reason.length > REASON_PREVIEW_LENGTH;\n const text = isLong && !expanded ? `${reason.slice(0, REASON_PREVIEW_LENGTH).trimEnd()}…` : reason;\n\n return (\n <Txt variant=\"caption\" tone=\"faint\">\n {text}\n {isLong && (\n <>\n {' '}\n <button\n type=\"button\"\n onClick={() => setExpanded(value => !value)}\n className={cn(quietTextHover, controlStateColorTransition, 'underline underline-offset-2')}\n >\n {expanded ? 'Read less' : 'Read more'}\n </button>\n </>\n )}\n </Txt>\n );\n}\n\nfunction TraceScoresPagination({\n pagination,\n onPageChange,\n}: {\n pagination?: ListScoresResponse['pagination'];\n onPageChange: (page: number) => void;\n}) {\n const currentPage = pagination?.page ?? 0;\n if (currentPage === 0 && !pagination?.hasMore) return null;\n\n return (\n <DataList.Pagination\n currentPage={currentPage}\n hasMore={pagination?.hasMore}\n onNextPage={() => onPageChange(currentPage + 1)}\n onPrevPage={() => onPageChange(currentPage - 1)}\n />\n );\n}\n"],"names":["useState","useTraceSpanScores","jsx","Spinner","EmptyState","jsxs","useLinkComponent","MetricsKpiCard","getShortId","Txt","formatDate","Button","ExternalLinkIcon","Fragment","cn","quietTextHover","controlStateColorTransition","DataList"],"mappings":"
|
|
1
|
+
{"version":3,"file":"trace-scores-tab.cjs.js","sources":["../../../../src/domains/scores/components/trace-scores-tab.tsx"],"sourcesContent":["import type { ClientScoreRowData, ListScoresResponse } from '@mastra/client-js';\nimport { ExternalLinkIcon } from 'lucide-react';\nimport { useState } from 'react';\nimport { useTraceSpanScores } from '../hooks/use-trace-span-scores';\nimport { Button } from '@/ds/components/Button';\nimport { DataList } from '@/ds/components/DataList';\nimport { EmptyState } from '@/ds/components/EmptyState';\nimport { MetricsKpiCard } from '@/ds/components/MetricsKpiCard';\nimport { Spinner } from '@/ds/components/Spinner';\nimport { getShortId } from '@/ds/components/Text';\nimport { Txt } from '@/ds/components/Txt';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { useLinkComponent } from '@/lib/framework';\nimport { cn } from '@/utils/cn';\nimport { formatDate } from '@/utils/date-format';\n\nconst REASON_PREVIEW_LENGTH = 100;\n\nexport type TraceScoresTabProps = {\n traceId: string;\n spanId: string;\n onScoreSelect: (scoreId: string) => void;\n};\n\n/**\n * Scores for the trace's anchor span, one card per scoring. Owns its own pagination:\n * mount it with a `key` on the trace/anchor pair so a page index never leaks across traces.\n */\nexport function TraceScoresTab({ traceId, spanId, onScoreSelect }: TraceScoresTabProps) {\n const [page, setPage] = useState(0);\n const { data: scoresData, isLoading } = useTraceSpanScores({ traceId, spanId, page });\n\n if (isLoading) {\n return (\n <div className=\"flex justify-center py-6\">\n <Spinner size=\"md\" variant=\"pulse\" className=\"text-placeholder\" />\n </div>\n );\n }\n\n const scores = scoresData?.scores ?? [];\n\n if (scores.length === 0) {\n return <EmptyState titleSlot=\"No scores yet\" descriptionSlot=\"Score this trace to see results here.\" />;\n }\n\n return (\n <div className=\"grid content-start gap-3\">\n {scores.map(score => (\n <TraceScoreCard key={score.id} score={score} onSelect={() => onScoreSelect(score.id)} />\n ))}\n <TraceScoresPagination pagination={scoresData?.pagination} onPageChange={setPage} />\n </div>\n );\n}\n\nfunction TraceScoreCard({ score, onSelect }: { score: ClientScoreRowData; onSelect: () => void }) {\n const createdAt = new Date(score.createdAt);\n const scorerName = String(score.scorer?.name || score.scorer?.id || 'Scorer');\n const { Link, paths } = useLinkComponent();\n const scorerHref = paths.scorerLink(score.scorerId, { scoreId: score.id });\n\n return (\n <MetricsKpiCard className=\"min-w-0\">\n <button\n type=\"button\"\n onClick={onSelect}\n aria-label={`Score ${getShortId(score.id)}`}\n className=\"grid gap-1 text-left\"\n >\n <MetricsKpiCard.Label>{scorerName}</MetricsKpiCard.Label>\n <MetricsKpiCard.Value>{String(score.score)}</MetricsKpiCard.Value>\n <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"tabular-nums\">\n <Txt as=\"span\" variant=\"meta\" font=\"mono\">\n {getShortId(score.id)}\n </Txt>{' '}\n · {formatDate(createdAt, 'date-time-seconds')}\n </Txt>\n </button>\n {score.reason && <TraceScoreReason reason={score.reason} />}\n {scorerHref && (\n <Button\n render={<Link href={scorerHref} />}\n variant=\"ghost\"\n size=\"sm\"\n className=\"-ml-2 justify-self-start\"\n icon={<ExternalLinkIcon />}\n >\n Open scorer run\n </Button>\n )}\n </MetricsKpiCard>\n );\n}\n\nfunction TraceScoreReason({ reason }: { reason: string }) {\n const [expanded, setExpanded] = useState(false);\n const isLong = reason.length > REASON_PREVIEW_LENGTH;\n const text = isLong && !expanded ? `${reason.slice(0, REASON_PREVIEW_LENGTH).trimEnd()}…` : reason;\n\n return (\n <Txt variant=\"caption\" tone=\"faint\">\n {text}\n {isLong && (\n <>\n {' '}\n <button\n type=\"button\"\n onClick={() => setExpanded(value => !value)}\n className={cn(quietTextHover, controlStateColorTransition, 'underline underline-offset-2')}\n >\n {expanded ? 'Read less' : 'Read more'}\n </button>\n </>\n )}\n </Txt>\n );\n}\n\nfunction TraceScoresPagination({\n pagination,\n onPageChange,\n}: {\n pagination?: ListScoresResponse['pagination'];\n onPageChange: (page: number) => void;\n}) {\n const currentPage = pagination?.page ?? 0;\n if (currentPage === 0 && !pagination?.hasMore) return null;\n\n return (\n <DataList.Pagination\n currentPage={currentPage}\n hasMore={pagination?.hasMore}\n onNextPage={() => onPageChange(currentPage + 1)}\n onPrevPage={() => onPageChange(currentPage - 1)}\n />\n );\n}\n"],"names":["useState","useTraceSpanScores","jsx","Spinner","EmptyState","jsxs","useLinkComponent","MetricsKpiCard","getShortId","Txt","formatDate","Button","ExternalLinkIcon","Fragment","cn","quietTextHover","controlStateColorTransition","DataList"],"mappings":"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"}
|
|
@@ -4,7 +4,6 @@ import { useState } from 'react';
|
|
|
4
4
|
import { useTraceSpanScores } from '../hooks/use-trace-span-scores.es.js';
|
|
5
5
|
import { B as Button } from '../../../Button-D43ghVKt.js';
|
|
6
6
|
import { D as DataList } from '../../../data-list-CEIYm7FY.js';
|
|
7
|
-
import '../../../keyboard/keyboard-shortcuts-context.es.js';
|
|
8
7
|
import { E as EmptyState } from '../../../EmptyState-DyyUFpzY.js';
|
|
9
8
|
import { M as MetricsKpiCard } from '../../../metrics-kpi-card-CiB88L41.js';
|
|
10
9
|
import { S as Spinner } from '../../../spinner-ylbE0TJA.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"trace-scores-tab.es.js","sources":["../../../../src/domains/scores/components/trace-scores-tab.tsx"],"sourcesContent":["import type { ClientScoreRowData, ListScoresResponse } from '@mastra/client-js';\nimport { ExternalLinkIcon } from 'lucide-react';\nimport { useState } from 'react';\nimport { useTraceSpanScores } from '../hooks/use-trace-span-scores';\nimport { Button } from '@/ds/components/Button';\nimport { DataList } from '@/ds/components/DataList';\nimport { EmptyState } from '@/ds/components/EmptyState';\nimport { MetricsKpiCard } from '@/ds/components/MetricsKpiCard';\nimport { Spinner } from '@/ds/components/Spinner';\nimport { getShortId } from '@/ds/components/Text';\nimport { Txt } from '@/ds/components/Txt';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { useLinkComponent } from '@/lib/framework';\nimport { cn } from '@/utils/cn';\nimport { formatDate } from '@/utils/date-format';\n\nconst REASON_PREVIEW_LENGTH = 100;\n\nexport type TraceScoresTabProps = {\n traceId: string;\n spanId: string;\n onScoreSelect: (scoreId: string) => void;\n};\n\n/**\n * Scores for the trace's anchor span, one card per scoring. Owns its own pagination:\n * mount it with a `key` on the trace/anchor pair so a page index never leaks across traces.\n */\nexport function TraceScoresTab({ traceId, spanId, onScoreSelect }: TraceScoresTabProps) {\n const [page, setPage] = useState(0);\n const { data: scoresData, isLoading } = useTraceSpanScores({ traceId, spanId, page });\n\n if (isLoading) {\n return (\n <div className=\"flex justify-center py-6\">\n <Spinner size=\"md\" variant=\"pulse\" className=\"text-placeholder\" />\n </div>\n );\n }\n\n const scores = scoresData?.scores ?? [];\n\n if (scores.length === 0) {\n return <EmptyState titleSlot=\"No scores yet\" descriptionSlot=\"Score this trace to see results here.\" />;\n }\n\n return (\n <div className=\"grid content-start gap-3\">\n {scores.map(score => (\n <TraceScoreCard key={score.id} score={score} onSelect={() => onScoreSelect(score.id)} />\n ))}\n <TraceScoresPagination pagination={scoresData?.pagination} onPageChange={setPage} />\n </div>\n );\n}\n\nfunction TraceScoreCard({ score, onSelect }: { score: ClientScoreRowData; onSelect: () => void }) {\n const createdAt = new Date(score.createdAt);\n const scorerName = String(score.scorer?.name || score.scorer?.id || 'Scorer');\n const { Link, paths } = useLinkComponent();\n const scorerHref = paths.scorerLink(score.scorerId, { scoreId: score.id });\n\n return (\n <MetricsKpiCard className=\"min-w-0\">\n <button\n type=\"button\"\n onClick={onSelect}\n aria-label={`Score ${getShortId(score.id)}`}\n className=\"grid gap-1 text-left\"\n >\n <MetricsKpiCard.Label>{scorerName}</MetricsKpiCard.Label>\n <MetricsKpiCard.Value>{String(score.score)}</MetricsKpiCard.Value>\n <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"tabular-nums\">\n <Txt as=\"span\" variant=\"meta\" font=\"mono\">\n {getShortId(score.id)}\n </Txt>{' '}\n · {formatDate(createdAt, 'date-time-seconds')}\n </Txt>\n </button>\n {score.reason && <TraceScoreReason reason={score.reason} />}\n {scorerHref && (\n <Button\n render={<Link href={scorerHref} />}\n variant=\"ghost\"\n size=\"sm\"\n className=\"-ml-2 justify-self-start\"\n icon={<ExternalLinkIcon />}\n >\n Open scorer run\n </Button>\n )}\n </MetricsKpiCard>\n );\n}\n\nfunction TraceScoreReason({ reason }: { reason: string }) {\n const [expanded, setExpanded] = useState(false);\n const isLong = reason.length > REASON_PREVIEW_LENGTH;\n const text = isLong && !expanded ? `${reason.slice(0, REASON_PREVIEW_LENGTH).trimEnd()}…` : reason;\n\n return (\n <Txt variant=\"caption\" tone=\"faint\">\n {text}\n {isLong && (\n <>\n {' '}\n <button\n type=\"button\"\n onClick={() => setExpanded(value => !value)}\n className={cn(quietTextHover, controlStateColorTransition, 'underline underline-offset-2')}\n >\n {expanded ? 'Read less' : 'Read more'}\n </button>\n </>\n )}\n </Txt>\n );\n}\n\nfunction TraceScoresPagination({\n pagination,\n onPageChange,\n}: {\n pagination?: ListScoresResponse['pagination'];\n onPageChange: (page: number) => void;\n}) {\n const currentPage = pagination?.page ?? 0;\n if (currentPage === 0 && !pagination?.hasMore) return null;\n\n return (\n <DataList.Pagination\n currentPage={currentPage}\n hasMore={pagination?.hasMore}\n onNextPage={() => onPageChange(currentPage + 1)}\n onPrevPage={() => onPageChange(currentPage - 1)}\n />\n );\n}\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"trace-scores-tab.es.js","sources":["../../../../src/domains/scores/components/trace-scores-tab.tsx"],"sourcesContent":["import type { ClientScoreRowData, ListScoresResponse } from '@mastra/client-js';\nimport { ExternalLinkIcon } from 'lucide-react';\nimport { useState } from 'react';\nimport { useTraceSpanScores } from '../hooks/use-trace-span-scores';\nimport { Button } from '@/ds/components/Button';\nimport { DataList } from '@/ds/components/DataList';\nimport { EmptyState } from '@/ds/components/EmptyState';\nimport { MetricsKpiCard } from '@/ds/components/MetricsKpiCard';\nimport { Spinner } from '@/ds/components/Spinner';\nimport { getShortId } from '@/ds/components/Text';\nimport { Txt } from '@/ds/components/Txt';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHover } from '@/ds/primitives/typography';\nimport { useLinkComponent } from '@/lib/framework';\nimport { cn } from '@/utils/cn';\nimport { formatDate } from '@/utils/date-format';\n\nconst REASON_PREVIEW_LENGTH = 100;\n\nexport type TraceScoresTabProps = {\n traceId: string;\n spanId: string;\n onScoreSelect: (scoreId: string) => void;\n};\n\n/**\n * Scores for the trace's anchor span, one card per scoring. Owns its own pagination:\n * mount it with a `key` on the trace/anchor pair so a page index never leaks across traces.\n */\nexport function TraceScoresTab({ traceId, spanId, onScoreSelect }: TraceScoresTabProps) {\n const [page, setPage] = useState(0);\n const { data: scoresData, isLoading } = useTraceSpanScores({ traceId, spanId, page });\n\n if (isLoading) {\n return (\n <div className=\"flex justify-center py-6\">\n <Spinner size=\"md\" variant=\"pulse\" className=\"text-placeholder\" />\n </div>\n );\n }\n\n const scores = scoresData?.scores ?? [];\n\n if (scores.length === 0) {\n return <EmptyState titleSlot=\"No scores yet\" descriptionSlot=\"Score this trace to see results here.\" />;\n }\n\n return (\n <div className=\"grid content-start gap-3\">\n {scores.map(score => (\n <TraceScoreCard key={score.id} score={score} onSelect={() => onScoreSelect(score.id)} />\n ))}\n <TraceScoresPagination pagination={scoresData?.pagination} onPageChange={setPage} />\n </div>\n );\n}\n\nfunction TraceScoreCard({ score, onSelect }: { score: ClientScoreRowData; onSelect: () => void }) {\n const createdAt = new Date(score.createdAt);\n const scorerName = String(score.scorer?.name || score.scorer?.id || 'Scorer');\n const { Link, paths } = useLinkComponent();\n const scorerHref = paths.scorerLink(score.scorerId, { scoreId: score.id });\n\n return (\n <MetricsKpiCard className=\"min-w-0\">\n <button\n type=\"button\"\n onClick={onSelect}\n aria-label={`Score ${getShortId(score.id)}`}\n className=\"grid gap-1 text-left\"\n >\n <MetricsKpiCard.Label>{scorerName}</MetricsKpiCard.Label>\n <MetricsKpiCard.Value>{String(score.score)}</MetricsKpiCard.Value>\n <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"tabular-nums\">\n <Txt as=\"span\" variant=\"meta\" font=\"mono\">\n {getShortId(score.id)}\n </Txt>{' '}\n · {formatDate(createdAt, 'date-time-seconds')}\n </Txt>\n </button>\n {score.reason && <TraceScoreReason reason={score.reason} />}\n {scorerHref && (\n <Button\n render={<Link href={scorerHref} />}\n variant=\"ghost\"\n size=\"sm\"\n className=\"-ml-2 justify-self-start\"\n icon={<ExternalLinkIcon />}\n >\n Open scorer run\n </Button>\n )}\n </MetricsKpiCard>\n );\n}\n\nfunction TraceScoreReason({ reason }: { reason: string }) {\n const [expanded, setExpanded] = useState(false);\n const isLong = reason.length > REASON_PREVIEW_LENGTH;\n const text = isLong && !expanded ? `${reason.slice(0, REASON_PREVIEW_LENGTH).trimEnd()}…` : reason;\n\n return (\n <Txt variant=\"caption\" tone=\"faint\">\n {text}\n {isLong && (\n <>\n {' '}\n <button\n type=\"button\"\n onClick={() => setExpanded(value => !value)}\n className={cn(quietTextHover, controlStateColorTransition, 'underline underline-offset-2')}\n >\n {expanded ? 'Read less' : 'Read more'}\n </button>\n </>\n )}\n </Txt>\n );\n}\n\nfunction TraceScoresPagination({\n pagination,\n onPageChange,\n}: {\n pagination?: ListScoresResponse['pagination'];\n onPageChange: (page: number) => void;\n}) {\n const currentPage = pagination?.page ?? 0;\n if (currentPage === 0 && !pagination?.hasMore) return null;\n\n return (\n <DataList.Pagination\n currentPage={currentPage}\n hasMore={pagination?.hasMore}\n onNextPage={() => onPageChange(currentPage + 1)}\n onPrevPage={() => onPageChange(currentPage - 1)}\n />\n );\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -8,6 +8,7 @@ const React = require('react');
|
|
|
8
8
|
require('@mastra/react');
|
|
9
9
|
require('@tanstack/react-query');
|
|
10
10
|
require('@base-ui/react/combobox');
|
|
11
|
+
require('../../../toast-nm-fM7BR.cjs');
|
|
11
12
|
const domains_scores_components_traceScoresTab = require('../../scores/components/trace-scores-tab.cjs.js');
|
|
12
13
|
require('@mastra/core/utils/safe-stringify');
|
|
13
14
|
const Button = require('../../../Button-CXhSUBxN.cjs');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"thread-view-by-trace.cjs.js","sources":["../../../../src/domains/traces/components/thread-view-by-trace.tsx"],"sourcesContent":["import { ExternalLinkIcon, MessageSquareReplyIcon, MessageSquareTextIcon } from 'lucide-react';\nimport { useMemo } from 'react';\nimport { TraceScoresTab } from '@/domains/scores';\nimport { ThreadTrace, useThreadTraceRow } from '@/domains/traces/components/thread-trace';\nimport type { ThreadTraceSelectedSpan } from '@/domains/traces/components/thread-trace';\n\nimport { ThreadViewSkeleton } from '@/domains/traces/components/thread-view-skeleton';\nimport { TraceFeedbackTab } from '@/domains/traces/components/trace-feedback-tab';\nimport { TraceThreadItemView } from '@/domains/traces/components/trace-thread-item-view';\nimport { TracesErrorContent } from '@/domains/traces/components/traces-error-content';\nimport { useTraceSpans } from '@/domains/traces/hooks/use-trace-spans';\nimport { useTracesListSource } from '@/domains/traces/hooks/use-traces-list-source';\nimport type { UseTracesListSourceArgs } from '@/domains/traces/hooks/use-traces-list-source';\nimport { Button } from '@/ds/components/Button';\nimport { Txt } from '@/ds/components/Txt';\nimport { Icon } from '@/ds/icons/Icon';\nimport { ScorersIcon } from '@/ds/icons/ScorersIcon';\nimport { useLinkComponent } from '@/lib/framework';\n\n// `queryTraces` requires a time range and rejects ranges over 31 days; the legacy endpoint is left unbounded.\nconst THREAD_WINDOW_MS = 31 * 24 * 60 * 60 * 1000;\n\nexport interface ThreadViewByTraceProps {\n threadId: string;\n /** Lists the thread through the trace-query API; `false` falls back to `listTracesLight`. */\n withQueryTrace: boolean;\n /** Shows the per-trace Feedback tab and fetches its feedback. */\n withFeedback: boolean;\n /** Fires when a span detail opens or closes (`null`). */\n onSelectedSpanChange?: (selected: ThreadTraceSelectedSpan | null) => void;\n /** Opens a score from a trace's Scores tab; the app owns routing. */\n onOpenScore: (traceId: string, scoreId: string) => void;\n /** Turns loaded per page: the latest ones on open, then older ones as the reader scrolls up. */\n pageSize?: number;\n}\n\n/**\n * A memory thread rendered as its traces, like a chat: one row per agent turn (oldest at the top),\n * opened on the latest turns, with older turns loaded as the reader scrolls up. Each row shows the\n * reconstructed messages on the left and the span tree on the right. Clicking a span opens its\n * detail panel on the side so the conversation stays readable.\n */\nexport function ThreadViewByTrace({\n threadId,\n withQueryTrace,\n withFeedback,\n onSelectedSpanChange,\n onOpenScore,\n pageSize = 10,\n}: ThreadViewByTraceProps) {\n const legacyFilters = useMemo<UseTracesListSourceArgs['legacyFilters']>(() => ({ threadId }), [threadId]);\n const { rows, isLoading, error, hasNextPage, isFetchingNextPage, fetchNextPage } = useTracesListSource({\n initialAutoRefetch: false,\n withQueryTrace,\n legacyFilters,\n limit: pageSize,\n query: now => ({\n timeRange: {\n from: new Date(now.getTime() - THREAD_WINDOW_MS).toISOString(),\n to: now.toISOString(),\n },\n where: { op: 'eq', left: { path: 'threadId' }, right: { literal: threadId } },\n orderBy: [{ field: 'startedAt', direction: 'desc' }],\n }),\n });\n // Pages come newest first; the conversation reads oldest first.\n const traceIds = rows.map(trace => trace.traceId).reverse();\n\n if (error) {\n return (\n <div className=\"flex h-full items-center justify-center p-4\">\n <TracesErrorContent error={error} resource=\"traces\" errorTitle=\"Failed to load traces\" />\n </div>\n );\n }\n\n if (isLoading) return <ThreadViewSkeleton />;\n\n if (traceIds.length === 0) {\n return (\n <div className=\"flex h-full items-center justify-center p-4\">\n <Txt variant=\"body\" tone=\"muted\">\n No traces found for this thread.\n </Txt>\n </div>\n );\n }\n\n return (\n <ThreadTrace\n key={threadId}\n traceIds={traceIds}\n onSelectedSpanChange={onSelectedSpanChange}\n onLoadOlder={() => {\n if (hasNextPage && !isFetchingNextPage) fetchNextPage();\n }}\n >\n <ThreadTrace.List data-testid=\"thread-view-by-trace\">\n {traceIds.map(traceId => (\n <ThreadTrace.Row key={traceId} traceId={traceId}>\n <ThreadTraceRowContent withFeedback={withFeedback} onOpenScore={onOpenScore} />\n </ThreadTrace.Row>\n ))}\n </ThreadTrace.List>\n <ThreadTrace.SpanPanel />\n </ThreadTrace>\n );\n}\n\nfunction ThreadTraceRowContent({\n withFeedback,\n onOpenScore,\n}: {\n withFeedback: boolean;\n onOpenScore: (traceId: string, scoreId: string) => void;\n}) {\n const { traceId, highlightSpans } = useThreadTraceRow();\n const { Link, paths } = useLinkComponent();\n const traceHref = paths.traceLink(traceId);\n // Same query the span tree observes (passive: the tree drives refetches).\n const { data: traceData } = useTraceSpans(traceId, { passive: true });\n const rootSpanId = traceData?.spans.find(span => span.parentSpanId == null)?.spanId;\n\n return (\n <>\n <ThreadTrace.Messages>\n <ThreadTrace.MessagesHeader>\n <ThreadTrace.TabList>\n <ThreadTrace.Tab value=\"messages\">\n <Icon size=\"xs\">\n <MessageSquareTextIcon />\n </Icon>\n Messages\n </ThreadTrace.Tab>\n {withFeedback && (\n <ThreadTrace.Tab value=\"feedback\">\n <Icon size=\"xs\">\n <MessageSquareReplyIcon />\n </Icon>\n Feedback\n </ThreadTrace.Tab>\n )}\n <ThreadTrace.Tab value=\"scores\">\n <Icon size=\"xs\">\n <ScorersIcon />\n </Icon>\n Scores\n </ThreadTrace.Tab>\n </ThreadTrace.TabList>\n </ThreadTrace.MessagesHeader>\n <ThreadTrace.TabContent value=\"messages\" flush>\n <TraceThreadItemView traceId={traceId} onHighlightSpans={highlightSpans} />\n </ThreadTrace.TabContent>\n {withFeedback && (\n <ThreadTrace.TabContent value=\"feedback\" className=\"min-h-0 py-3\">\n <TraceFeedbackTab key={traceId} traceId={traceId} variant=\"thread\" />\n </ThreadTrace.TabContent>\n )}\n <ThreadTrace.TabContent value=\"scores\" className=\"min-h-0 py-3\">\n {rootSpanId ? (\n <TraceScoresTab\n key={traceId}\n traceId={traceId}\n spanId={rootSpanId}\n onScoreSelect={scoreId => onOpenScore(traceId, scoreId)}\n />\n ) : null}\n </ThreadTrace.TabContent>\n </ThreadTrace.Messages>\n <ThreadTrace.Details>\n <ThreadTrace.DetailsHeader>\n {traceHref && (\n <ThreadTrace.DetailsActions>\n <Button render={<Link href={traceHref} />} variant=\"ghost\" size=\"sm\" icon={<ExternalLinkIcon />}>\n Go to trace\n </Button>\n </ThreadTrace.DetailsActions>\n )}\n </ThreadTrace.DetailsHeader>\n <ThreadTrace.Spans />\n </ThreadTrace.Details>\n </>\n );\n}\n"],"names":["useMemo","useTracesListSource","jsx","TracesErrorContent","ThreadViewSkeleton","Txt","jsxs","ThreadTrace","useThreadTraceRow","useLinkComponent","useTraceSpans","Fragment","Icon","MessageSquareTextIcon","MessageSquareReplyIcon","ScorersIcon","TraceThreadItemView","TraceFeedbackTab","TraceScoresTab","Button","ExternalLinkIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,MAAM,gBAAA,GAAmB,EAAA,GAAK,EAAA,GAAK,EAAA,GAAK,EAAA,GAAK,GAAA;AAsBtC,SAAS,iBAAA,CAAkB;AAAA,EAChC,QAAA;AAAA,EACA,cAAA;AAAA,EACA,YAAA;AAAA,EACA,oBAAA;AAAA,EACA,WAAA;AAAA,EACA,QAAA,GAAW;AACb,CAAA,EAA2B;AACzB,EAAA,MAAM,aAAA,GAAgBA,cAAkD,OAAO,EAAE,UAAS,CAAA,EAAI,CAAC,QAAQ,CAAC,CAAA;AACxG,EAAA,MAAM,EAAE,MAAM,SAAA,EAAW,KAAA,EAAO,aAAa,kBAAA,EAAoB,aAAA,KAAkBC,4DAAA,CAAoB;AAAA,IACrG,kBAAA,EAAoB,KAAA;AAAA,IACpB,cAAA;AAAA,IACA,aAAA;AAAA,IACA,KAAA,EAAO,QAAA;AAAA,IACP,OAAO,CAAA,GAAA,MAAQ;AAAA,MACb,SAAA,EAAW;AAAA,QACT,IAAA,EAAM,IAAI,IAAA,CAAK,GAAA,CAAI,SAAQ,GAAI,gBAAgB,EAAE,WAAA,EAAY;AAAA,QAC7D,EAAA,EAAI,IAAI,WAAA;AAAY,OACtB;AAAA,MACA,KAAA,EAAO,EAAE,EAAA,EAAI,IAAA,EAAM,IAAA,EAAM,EAAE,IAAA,EAAM,UAAA,EAAW,EAAG,KAAA,EAAO,EAAE,OAAA,EAAS,UAAS,EAAE;AAAA,MAC5E,SAAS,CAAC,EAAE,OAAO,WAAA,EAAa,SAAA,EAAW,QAAQ;AAAA,KACrD;AAAA,GACD,CAAA;AAED,EAAA,MAAM,WAAW,IAAA,CAAK,GAAA,CAAI,WAAS,KAAA,CAAM,OAAO,EAAE,OAAA,EAAQ;AAE1D,EAAA,IAAI,KAAA,EAAO;AACT,IAAA,uBACEC,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,6CAAA,EACb,QAAA,kBAAAA,cAAA,CAACC,+DAAA,EAAA,EAAmB,KAAA,EAAc,QAAA,EAAS,QAAA,EAAS,UAAA,EAAW,uBAAA,EAAwB,CAAA,EACzF,CAAA;AAAA,EAEJ;AAEA,EAAA,IAAI,SAAA,EAAW,uBAAOD,cAAA,CAACE,+DAAA,EAAA,EAAmB,CAAA;AAE1C,EAAA,IAAI,QAAA,CAAS,WAAW,CAAA,EAAG;AACzB,IAAA,uBACEF,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,6CAAA,EACb,QAAA,kBAAAA,cAAA,CAACG,OAAA,EAAA,EAAI,OAAA,EAAQ,MAAA,EAAO,IAAA,EAAK,OAAA,EAAQ,QAAA,EAAA,kCAAA,EAEjC,CAAA,EACF,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACEC,eAAA;AAAA,IAACC,iDAAA;AAAA,IAAA;AAAA,MAEC,QAAA;AAAA,MACA,oBAAA;AAAA,MACA,aAAa,MAAM;AACjB,QAAA,IAAI,WAAA,IAAe,CAAC,kBAAA,EAAoB,aAAA,EAAc;AAAA,MACxD,CAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAAL,cAAA,CAACK,iDAAA,CAAY,MAAZ,EAAiB,aAAA,EAAY,wBAC3B,QAAA,EAAA,QAAA,CAAS,GAAA,CAAI,6BACZL,cAAA,CAACK,iDAAA,CAAY,KAAZ,EAA8B,OAAA,EAC7B,yCAAC,qBAAA,EAAA,EAAsB,YAAA,EAA4B,aAA0B,CAAA,EAAA,EADzD,OAEtB,CACD,CAAA,EACH,CAAA;AAAA,wBACAL,cAAA,CAACK,iDAAA,CAAY,SAAA,EAAZ,EAAsB;AAAA;AAAA,KAAA;AAAA,IAdlB;AAAA,GAeP;AAEJ;AAEA,SAAS,qBAAA,CAAsB;AAAA,EAC7B,YAAA;AAAA,EACA;AACF,CAAA,EAGG;AACD,EAAA,MAAM,EAAE,OAAA,EAAS,cAAA,EAAe,GAAIC,6EAAA,EAAkB;AACtD,EAAA,MAAM,EAAE,IAAA,EAAM,KAAA,EAAM,GAAIC,8BAAA,EAAiB;AACzC,EAAA,MAAM,SAAA,GAAY,KAAA,CAAM,SAAA,CAAU,OAAO,CAAA;AAEzC,EAAA,MAAM,EAAE,MAAM,SAAA,EAAU,GAAIC,iDAAc,OAAA,EAAS,EAAE,OAAA,EAAS,IAAA,EAAM,CAAA;AACpE,EAAA,MAAM,UAAA,GAAa,WAAW,KAAA,CAAM,IAAA,CAAK,UAAQ,IAAA,CAAK,YAAA,IAAgB,IAAI,CAAA,EAAG,MAAA;AAE7E,EAAA,uBACEJ,eAAA,CAAAK,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAAL,eAAA,CAACC,iDAAA,CAAY,UAAZ,EACC,QAAA,EAAA;AAAA,sBAAAL,cAAA,CAACK,kDAAY,cAAA,EAAZ,EACC,QAAA,kBAAAD,eAAA,CAACC,iDAAA,CAAY,SAAZ,EACC,QAAA,EAAA;AAAA,wBAAAD,eAAA,CAACC,iDAAA,CAAY,GAAA,EAAZ,EAAgB,KAAA,EAAM,UAAA,EACrB,QAAA,EAAA;AAAA,0BAAAL,cAAA,CAACU,eAAA,EAAA,EAAK,IAAA,EAAK,IAAA,EACT,QAAA,kBAAAV,cAAA,CAACW,qCAAsB,CAAA,EACzB,CAAA;AAAA,UAAO;AAAA,SAAA,EAET,CAAA;AAAA,QACC,gCACCP,eAAA,CAACC,iDAAA,CAAY,GAAA,EAAZ,EAAgB,OAAM,UAAA,EACrB,QAAA,EAAA;AAAA,0BAAAL,cAAA,CAACU,eAAA,EAAA,EAAK,IAAA,EAAK,IAAA,EACT,QAAA,kBAAAV,cAAA,CAACY,sCAAuB,CAAA,EAC1B,CAAA;AAAA,UAAO;AAAA,SAAA,EAET,CAAA;AAAA,wBAEFR,eAAA,CAACC,iDAAA,CAAY,GAAA,EAAZ,EAAgB,OAAM,QAAA,EACrB,QAAA,EAAA;AAAA,0BAAAL,cAAA,CAACU,eAAA,EAAA,EAAK,IAAA,EAAK,IAAA,EACT,QAAA,kBAAAV,cAAA,CAACa,iCAAY,CAAA,EACf,CAAA;AAAA,UAAO;AAAA,SAAA,EAET;AAAA,OAAA,EACF,CAAA,EACF,CAAA;AAAA,sBACAb,cAAA,CAACK,iDAAA,CAAY,UAAA,EAAZ,EAAuB,KAAA,EAAM,UAAA,EAAW,KAAA,EAAK,IAAA,EAC5C,QAAA,kBAAAL,cAAA,CAACc,iEAAA,EAAA,EAAoB,OAAA,EAAkB,gBAAA,EAAkB,gBAAgB,CAAA,EAC3E,CAAA;AAAA,MACC,YAAA,oBACCd,cAAA,CAACK,iDAAA,CAAY,UAAA,EAAZ,EAAuB,KAAA,EAAM,UAAA,EAAW,SAAA,EAAU,cAAA,EACjD,yCAACU,2DAAA,EAAA,EAA+B,OAAA,EAAkB,OAAA,EAAQ,QAAA,EAAA,EAAnC,OAA4C,CAAA,EACrE,CAAA;AAAA,sBAEFf,cAAA,CAACK,kDAAY,UAAA,EAAZ,EAAuB,OAAM,QAAA,EAAS,SAAA,EAAU,gBAC9C,QAAA,EAAA,UAAA,mBACCL,cAAA;AAAA,QAACgB,uDAAA;AAAA,QAAA;AAAA,UAEC,OAAA;AAAA,UACA,MAAA,EAAQ,UAAA;AAAA,UACR,aAAA,EAAe,CAAA,OAAA,KAAW,WAAA,CAAY,OAAA,EAAS,OAAO;AAAA,SAAA;AAAA,QAHjD;AAAA,UAKL,IAAA,EACN;AAAA,KAAA,EACF,CAAA;AAAA,oBACAZ,eAAA,CAACC,iDAAA,CAAY,OAAA,EAAZ,EACC,QAAA,EAAA;AAAA,sBAAAL,cAAA,CAACK,iDAAA,CAAY,aAAA,EAAZ,EACE,QAAA,EAAA,SAAA,oBACCL,cAAA,CAACK,iDAAA,CAAY,cAAA,EAAZ,EACC,QAAA,kBAAAL,cAAA,CAACiB,aAAA,EAAA,EAAO,MAAA,kBAAQjB,cAAA,CAAC,IAAA,EAAA,EAAK,MAAM,SAAA,EAAW,CAAA,EAAI,OAAA,EAAQ,OAAA,EAAQ,IAAA,EAAK,IAAA,EAAK,IAAA,kBAAMA,cAAA,CAACkB,4BAAA,EAAA,EAAiB,CAAA,EAAI,QAAA,EAAA,aAAA,EAEjG,CAAA,EACF,CAAA,EAEJ,CAAA;AAAA,sBACAlB,cAAA,CAACK,iDAAA,CAAY,KAAA,EAAZ,EAAkB;AAAA,KAAA,EACrB;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}
|
|
1
|
+
{"version":3,"file":"thread-view-by-trace.cjs.js","sources":["../../../../src/domains/traces/components/thread-view-by-trace.tsx"],"sourcesContent":["import { ExternalLinkIcon, MessageSquareReplyIcon, MessageSquareTextIcon } from 'lucide-react';\nimport { useMemo } from 'react';\nimport { TraceScoresTab } from '@/domains/scores';\nimport { ThreadTrace, useThreadTraceRow } from '@/domains/traces/components/thread-trace';\nimport type { ThreadTraceSelectedSpan } from '@/domains/traces/components/thread-trace';\n\nimport { ThreadViewSkeleton } from '@/domains/traces/components/thread-view-skeleton';\nimport { TraceFeedbackTab } from '@/domains/traces/components/trace-feedback-tab';\nimport { TraceThreadItemView } from '@/domains/traces/components/trace-thread-item-view';\nimport { TracesErrorContent } from '@/domains/traces/components/traces-error-content';\nimport { useTraceSpans } from '@/domains/traces/hooks/use-trace-spans';\nimport { useTracesListSource } from '@/domains/traces/hooks/use-traces-list-source';\nimport type { UseTracesListSourceArgs } from '@/domains/traces/hooks/use-traces-list-source';\nimport { Button } from '@/ds/components/Button';\nimport { Txt } from '@/ds/components/Txt';\nimport { Icon } from '@/ds/icons/Icon';\nimport { ScorersIcon } from '@/ds/icons/ScorersIcon';\nimport { useLinkComponent } from '@/lib/framework';\n\n// `queryTraces` requires a time range and rejects ranges over 31 days; the legacy endpoint is left unbounded.\nconst THREAD_WINDOW_MS = 31 * 24 * 60 * 60 * 1000;\n\nexport interface ThreadViewByTraceProps {\n threadId: string;\n /** Lists the thread through the trace-query API; `false` falls back to `listTracesLight`. */\n withQueryTrace: boolean;\n /** Shows the per-trace Feedback tab and fetches its feedback. */\n withFeedback: boolean;\n /** Fires when a span detail opens or closes (`null`). */\n onSelectedSpanChange?: (selected: ThreadTraceSelectedSpan | null) => void;\n /** Opens a score from a trace's Scores tab; the app owns routing. */\n onOpenScore: (traceId: string, scoreId: string) => void;\n /** Turns loaded per page: the latest ones on open, then older ones as the reader scrolls up. */\n pageSize?: number;\n}\n\n/**\n * A memory thread rendered as its traces, like a chat: one row per agent turn (oldest at the top),\n * opened on the latest turns, with older turns loaded as the reader scrolls up. Each row shows the\n * reconstructed messages on the left and the span tree on the right. Clicking a span opens its\n * detail panel on the side so the conversation stays readable.\n */\nexport function ThreadViewByTrace({\n threadId,\n withQueryTrace,\n withFeedback,\n onSelectedSpanChange,\n onOpenScore,\n pageSize = 10,\n}: ThreadViewByTraceProps) {\n const legacyFilters = useMemo<UseTracesListSourceArgs['legacyFilters']>(() => ({ threadId }), [threadId]);\n const { rows, isLoading, error, hasNextPage, isFetchingNextPage, fetchNextPage } = useTracesListSource({\n initialAutoRefetch: false,\n withQueryTrace,\n legacyFilters,\n limit: pageSize,\n query: now => ({\n timeRange: {\n from: new Date(now.getTime() - THREAD_WINDOW_MS).toISOString(),\n to: now.toISOString(),\n },\n where: { op: 'eq', left: { path: 'threadId' }, right: { literal: threadId } },\n orderBy: [{ field: 'startedAt', direction: 'desc' }],\n }),\n });\n // Pages come newest first; the conversation reads oldest first.\n const traceIds = rows.map(trace => trace.traceId).reverse();\n\n if (error) {\n return (\n <div className=\"flex h-full items-center justify-center p-4\">\n <TracesErrorContent error={error} resource=\"traces\" errorTitle=\"Failed to load traces\" />\n </div>\n );\n }\n\n if (isLoading) return <ThreadViewSkeleton />;\n\n if (traceIds.length === 0) {\n return (\n <div className=\"flex h-full items-center justify-center p-4\">\n <Txt variant=\"body\" tone=\"muted\">\n No traces found for this thread.\n </Txt>\n </div>\n );\n }\n\n return (\n <ThreadTrace\n key={threadId}\n traceIds={traceIds}\n onSelectedSpanChange={onSelectedSpanChange}\n onLoadOlder={() => {\n if (hasNextPage && !isFetchingNextPage) fetchNextPage();\n }}\n >\n <ThreadTrace.List data-testid=\"thread-view-by-trace\">\n {traceIds.map(traceId => (\n <ThreadTrace.Row key={traceId} traceId={traceId}>\n <ThreadTraceRowContent withFeedback={withFeedback} onOpenScore={onOpenScore} />\n </ThreadTrace.Row>\n ))}\n </ThreadTrace.List>\n <ThreadTrace.SpanPanel />\n </ThreadTrace>\n );\n}\n\nfunction ThreadTraceRowContent({\n withFeedback,\n onOpenScore,\n}: {\n withFeedback: boolean;\n onOpenScore: (traceId: string, scoreId: string) => void;\n}) {\n const { traceId, highlightSpans } = useThreadTraceRow();\n const { Link, paths } = useLinkComponent();\n const traceHref = paths.traceLink(traceId);\n // Same query the span tree observes (passive: the tree drives refetches).\n const { data: traceData } = useTraceSpans(traceId, { passive: true });\n const rootSpanId = traceData?.spans.find(span => span.parentSpanId == null)?.spanId;\n\n return (\n <>\n <ThreadTrace.Messages>\n <ThreadTrace.MessagesHeader>\n <ThreadTrace.TabList>\n <ThreadTrace.Tab value=\"messages\">\n <Icon size=\"xs\">\n <MessageSquareTextIcon />\n </Icon>\n Messages\n </ThreadTrace.Tab>\n {withFeedback && (\n <ThreadTrace.Tab value=\"feedback\">\n <Icon size=\"xs\">\n <MessageSquareReplyIcon />\n </Icon>\n Feedback\n </ThreadTrace.Tab>\n )}\n <ThreadTrace.Tab value=\"scores\">\n <Icon size=\"xs\">\n <ScorersIcon />\n </Icon>\n Scores\n </ThreadTrace.Tab>\n </ThreadTrace.TabList>\n </ThreadTrace.MessagesHeader>\n <ThreadTrace.TabContent value=\"messages\" flush>\n <TraceThreadItemView traceId={traceId} onHighlightSpans={highlightSpans} />\n </ThreadTrace.TabContent>\n {withFeedback && (\n <ThreadTrace.TabContent value=\"feedback\" className=\"min-h-0 py-3\">\n <TraceFeedbackTab key={traceId} traceId={traceId} variant=\"thread\" />\n </ThreadTrace.TabContent>\n )}\n <ThreadTrace.TabContent value=\"scores\" className=\"min-h-0 py-3\">\n {rootSpanId ? (\n <TraceScoresTab\n key={traceId}\n traceId={traceId}\n spanId={rootSpanId}\n onScoreSelect={scoreId => onOpenScore(traceId, scoreId)}\n />\n ) : null}\n </ThreadTrace.TabContent>\n </ThreadTrace.Messages>\n <ThreadTrace.Details>\n <ThreadTrace.DetailsHeader>\n {traceHref && (\n <ThreadTrace.DetailsActions>\n <Button render={<Link href={traceHref} />} variant=\"ghost\" size=\"sm\" icon={<ExternalLinkIcon />}>\n Go to trace\n </Button>\n </ThreadTrace.DetailsActions>\n )}\n </ThreadTrace.DetailsHeader>\n <ThreadTrace.Spans />\n </ThreadTrace.Details>\n </>\n );\n}\n"],"names":["useMemo","useTracesListSource","jsx","TracesErrorContent","ThreadViewSkeleton","Txt","jsxs","ThreadTrace","useThreadTraceRow","useLinkComponent","useTraceSpans","Fragment","Icon","MessageSquareTextIcon","MessageSquareReplyIcon","ScorersIcon","TraceThreadItemView","TraceFeedbackTab","TraceScoresTab","Button","ExternalLinkIcon"],"mappings":"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"}
|
|
@@ -4,6 +4,7 @@ import { useMemo } from 'react';
|
|
|
4
4
|
import '@mastra/react';
|
|
5
5
|
import '@tanstack/react-query';
|
|
6
6
|
import '@base-ui/react/combobox';
|
|
7
|
+
import '../../../toast-c5kCpyWt.js';
|
|
7
8
|
import { TraceScoresTab } from '../../scores/components/trace-scores-tab.es.js';
|
|
8
9
|
import '@mastra/core/utils/safe-stringify';
|
|
9
10
|
import { B as Button } from '../../../Button-D43ghVKt.js';
|