fix(ui): render relay collector logs with app source

This commit is contained in:
Ishaan Jaff 2026-07-09 16:17:22 -07:00
parent 3e265a3004
commit e1c7d12df7
No known key found for this signature in database
3 changed files with 34 additions and 5 deletions

View file

@ -68,7 +68,7 @@ describe("LogDetailContent", () => {
);
expect(screen.getByText("Source")).toBeInTheDocument();
expect(screen.getByRole("img", { name: "Notion logo" })).toBeInTheDocument();
expect(screen.getByLabelText("Notion logo")).toBeInTheDocument();
expect(screen.getByText("Notion")).toBeInTheDocument();
});

View file

@ -39,6 +39,14 @@ import { RelaySourceBadge, getRelaySource } from "../TypeBadges";
const { Text } = Typography;
const getObjectRequestTags = (requestTags: LogEntry["request_tags"]): Record<string, unknown> | undefined => {
if (!requestTags || Array.isArray(requestTags) || typeof requestTags !== "object") {
return undefined;
}
return requestTags;
};
export interface LogDetailContentProps {
logEntry: LogEntry;
/** When true, log details (messages/response) are still being lazy-loaded. */
@ -56,6 +64,7 @@ export interface LogDetailContentProps {
*/
export function LogDetailContent({ logEntry, isLoadingDetails = false, accessToken }: LogDetailContentProps) {
const metadata = logEntry.metadata || {};
const requestTags = getObjectRequestTags(logEntry.request_tags);
const hasError = metadata.status === "failure";
const errorInfo = hasError ? metadata.error_information : null;
const isRelayCapture = logEntry.call_type === "litellm-relay";
@ -112,9 +121,7 @@ export function LogDetailContent({ logEntry, isLoadingDetails = false, accessTok
)}
{/* Tags */}
{logEntry.request_tags && Object.keys(logEntry.request_tags).length > 0 && (
<TagsSection tags={logEntry.request_tags} />
)}
{requestTags && Object.keys(requestTags).length > 0 && <TagsSection tags={requestTags} />}
{/* Request Details */}
<div className="bg-white rounded-lg shadow-sm w-full max-w-full overflow-hidden mb-6">
@ -242,7 +249,7 @@ function ErrorDescription({ errorInfo }: { errorInfo: any }) {
);
}
function TagsSection({ tags }: { tags: Record<string, any> }) {
function TagsSection({ tags }: { tags: Record<string, unknown> }) {
return (
<div className="bg-white rounded-lg shadow-sm w-full max-w-full overflow-hidden p-4 mb-6">
<Text strong style={{ display: "block", marginBottom: 8, fontSize: 16 }}>

View file

@ -111,6 +111,28 @@ describe("view logs columns", () => {
expect(screen.queryByText("LLM")).not.toBeInTheDocument();
});
it("should render collector rows with relay metadata as relay logs", () => {
const legacyCollectorLog = {
...baseLog,
request_id: "collector-01f159da",
call_type: "completion",
metadata: {
...baseLog.metadata,
app: "codex",
source: "litellm-relay",
},
model: "codex-ai",
request_tags: ["litellm-relay", "codex"],
};
render(<DataTable data={[legacyCollectorLog]} columns={createColumns()} />);
expect(screen.getByText("litellm-relay")).toBeInTheDocument();
expect(screen.getAllByText("Codex").length).toBeGreaterThan(0);
expect(screen.getAllByRole("img", { name: "Codex logo" }).length).toBeGreaterThan(0);
expect(screen.queryByText("LLM")).not.toBeInTheDocument();
});
it("should fall back to row api_key when relay metadata does not include a key hash", () => {
render(<DataTable data={[relayLog]} columns={createColumns()} getRowId={(row) => row.request_id} />);