fix(ui): resolve control chat avatar fallback

This commit is contained in:
Peter Steinberger 2026-03-13 03:42:11 +00:00
parent 7509c4a057
commit 4656317770
No known key found for this signature in database
3 changed files with 57 additions and 3 deletions

View File

@ -1,3 +1,5 @@
/* @vitest-environment jsdom */
import { render } from "lit";
import { describe, expect, it, vi } from "vitest";
import type { SessionsListResult } from "../types.ts";
@ -54,6 +56,46 @@ function createProps(overrides: Partial<ChatProps> = {}): ChatProps {
}
describe("chat view", () => {
it("uses the assistant avatar URL for the welcome state when the identity avatar is only initials", () => {
const container = document.createElement("div");
render(
renderChat(
createProps({
assistantName: "Assistant",
assistantAvatar: "A",
assistantAvatarUrl: "/avatar/main",
}),
),
container,
);
const welcomeImage = container.querySelector<HTMLImageElement>(".agent-chat__welcome > img");
expect(welcomeImage).not.toBeNull();
expect(welcomeImage?.getAttribute("src")).toBe("/avatar/main");
});
it("falls back to the bundled logo in the welcome state when the assistant avatar is not a URL", () => {
const container = document.createElement("div");
render(
renderChat(
createProps({
assistantName: "Assistant",
assistantAvatar: "A",
assistantAvatarUrl: null,
}),
),
container,
);
const welcomeImage = container.querySelector<HTMLImageElement>(".agent-chat__welcome > img");
const logoImage = container.querySelector<HTMLImageElement>(
".agent-chat__welcome .agent-chat__avatar--logo img",
);
expect(welcomeImage).toBeNull();
expect(logoImage).not.toBeNull();
expect(logoImage?.getAttribute("src")).toBe("favicon.svg");
});
it("renders compacting indicator as a badge", () => {
const container = document.createElement("div");
render(

View File

@ -31,7 +31,7 @@ import { detectTextDirection } from "../text-direction.ts";
import type { GatewaySessionRow, SessionsListResult } from "../types.ts";
import type { ChatItem, MessageGroup } from "../types/chat-types.ts";
import type { ChatAttachment, ChatQueueItem } from "../ui-types.ts";
import { agentLogoUrl } from "./agents-utils.ts";
import { agentLogoUrl, resolveAgentAvatarUrl } from "./agents-utils.ts";
import { renderMarkdownSidebar } from "./markdown-sidebar.ts";
import "../components/resizable-divider.ts";
@ -566,7 +566,12 @@ const WELCOME_SUGGESTIONS = [
function renderWelcomeState(props: ChatProps): TemplateResult {
const name = props.assistantName || "Assistant";
const avatar = props.assistantAvatar ?? props.assistantAvatarUrl;
const avatar = resolveAgentAvatarUrl({
identity: {
avatar: props.assistantAvatar ?? undefined,
avatarUrl: props.assistantAvatarUrl ?? undefined,
},
});
const logoUrl = agentLogoUrl(props.basePath ?? "");
return html`
@ -802,7 +807,13 @@ export function renderChat(props: ChatProps) {
const showReasoning = props.showThinking && reasoningLevel !== "off";
const assistantIdentity = {
name: props.assistantName,
avatar: props.assistantAvatar ?? props.assistantAvatarUrl ?? null,
avatar:
resolveAgentAvatarUrl({
identity: {
avatar: props.assistantAvatar ?? undefined,
avatarUrl: props.assistantAvatarUrl ?? undefined,
},
}) ?? null,
};
const pinned = getPinnedMessages(props.sessionKey);
const deleted = getDeletedMessages(props.sessionKey);

View File

@ -83,6 +83,7 @@ export default defineConfig({
"extensions/**/*.test.ts",
"test/**/*.test.ts",
"ui/src/ui/views/agents-utils.test.ts",
"ui/src/ui/views/chat.test.ts",
"ui/src/ui/views/usage-render-details.test.ts",
"ui/src/ui/controllers/agents.test.ts",
"ui/src/ui/controllers/chat.test.ts",