stream-chat-react-native-core 9.12.1 → 9.14.0

package/src/ai-components/__tests__/messageParts.test.ts

@@ -0,0 +1,336 @@
+import {
+  isAuthorizationExpired,
+  isAwaitingApproval,
+  isAwaitingAuthorization,
+  isAwaitingClient,
+  isDeclined,
+  isSupportedPart,
+  isToolCallFinished,
+  parseMessagePart,
+  parseMessageParts,
+} from '../message-parts';
+import type { AIToolCallPart } from '../message-parts';
+
+// Shaped as the router writes them (acceleration/internal/conversation/parts.go).
+const reasoning = {
+  duration_ms: 4200,
+  finished_at: '2026-11-02T10:00:04Z',
+  id: 'r1',
+  preview: 'Let me check the calendar first.',
+  started_at: '2026-11-02T10:00:00Z',
+  status: 'completed',
+  summary: 'Checked the calendar',
+  type: 'ai_reasoning',
+  v: 1,
+};
+
+const approvalCall = {
+  approval: {
+    allow_title: 'Share',
+    decline_title: 'Not now',
+    message: 'Only your city is shared.',
+    reason: 'to check the local weather',
+    title: 'Share your location?',
+  },
+  arguments: { reason: 'to check the local weather' },
+  display_title: 'Checking your location',
+  executor: 'client',
+  id: 'call_1',
+  name: 'get_location',
+  status: 'awaiting_approval',
+  target_client_id: 'ios-1',
+  target_user_id: 'alex',
+  type: 'ai_tool_call',
+  v: 1,
+};
+
+const authorizationCall = {
+  authorization: {
+    expires_at: '2026-11-02T10:10:00.123Z',
+    handoff_token: 'tok',
+    message: 'The agent needs your Linear account to file the issue.',
+    provider: 'linear',
+    provider_name: 'Linear',
+    title: 'Connect Linear',
+    type: 'oauth',
+    url: 'https://router.example.com/v1/agents/connectors/oauth/launch/abc',
+  },
+  display_title: 'Filing a Linear issue',
+  executor: 'server',
+  id: 'call_2',
+  name: 'linear_create_issue',
+  status: 'awaiting_authorization',
+  target_user_id: 'alex',
+  type: 'ai_tool_call',
+  v: 1,
+};
+
+const signInWithUrl = (url: string) =>
+  parseMessagePart({
+    ...authorizationCall,
+    authorization: { ...authorizationCall.authorization, url },
+  })?.toolCall?.authorization;
+
+describe('parseMessageParts', () => {
+  it('reads the steps in order and skips other attachments', () => {
+    const parts = parseMessageParts([
+      reasoning,
+      { image_url: 'https://example.com/a.png', type: 'image' },
+      approvalCall,
+      authorizationCall,
+    ]);
+    expect(parts.map((part) => part.id)).toEqual(['r1', 'call_1', 'call_2']);
+    expect(parts.map((part) => part.kind)).toEqual([
+      'ai_reasoning',
+      'ai_tool_call',
+      'ai_tool_call',
+    ]);
+    expect(parts.every(isSupportedPart)).toBe(true);
+  });
+
+  it('reads a reply as a local Vision-Agents router wrote it', () => {
+    // The attachments of one real reply, copied from the channel (2026-11-03, xai/grok-4.7).
+    const parts = parseMessageParts([
+      {
+        duration_ms: 2387,
+        finished_at: '2026-11-03T14:20:45.15695058Z',
+        id: 'r1',
+        preview: "Searching for today's top tech headline.",
+        started_at: '2026-11-03T14:20:45.156092748Z',
+        status: 'completed',
+        summary: "Searching for today's top tech headline.",
+        type: 'ai_reasoning',
+        v: 1,
+      },
+      {
+        display_title: 'Searching the web',
+        duration_ms: 687,
+        executor: 'server',
+        finished_at: '2026-11-03T14:20:45.844631174Z',
+        id: 'call-b1352079-bc55-4229-ab07-8f9c2fc5d4d7-0',
+        name: 'search',
+        started_at: '2026-11-03T14:20:45.15688333Z',
+        status: 'completed',
+        type: 'ai_tool_call',
+        v: 1,
+      },
+      {
+        duration_ms: 1884,
+        finished_at: '2026-11-03T14:20:47.729154697Z',
+        id: 'r2',
+        preview: "I will search for today's top tech headline and summarize it in one sentence.",
+        started_at: '2026-11-03T14:20:47.72908728Z',
+        status: 'completed',
+        summary: "I will search for today's top tech headline and summarize it in one sentence.",
+        type: 'ai_reasoning',
+        v: 1,
+      },
+    ]);
+    expect(parts.map((part) => part.id)).toEqual([
+      'r1',
+      'call-b1352079-bc55-4229-ab07-8f9c2fc5d4d7-0',
+      'r2',
+    ]);
+    expect(parts[0].reasoning).toEqual({
+      durationMs: 2387,
+      id: 'r1',
+      preview: "Searching for today's top tech headline.",
+      status: 'completed',
+      summary: "Searching for today's top tech headline.",
+    });
+    expect(parts[1].toolCall).toMatchObject({
+      displayTitle: 'Searching the web',
+      durationMs: 687,
+      executor: 'server',
+      name: 'search',
+      status: 'completed',
+    });
+    expect(parts.every(isSupportedPart)).toBe(true);
+  });
+
+  it('reads a reasoning step', () => {
+    expect(parseMessagePart(reasoning)?.reasoning).toEqual({
+      durationMs: 4200,
+      id: 'r1',
+      preview: 'Let me check the calendar first.',
+      status: 'completed',
+      summary: 'Checked the calendar',
+    });
+  });
+
+  it('reads a tool call with its approval', () => {
+    const call = parseMessagePart(approvalCall)?.toolCall;
+    expect(call).toMatchObject({
+      approval: {
+        allowTitle: 'Share',
+        declineTitle: 'Not now',
+        message: 'Only your city is shared.',
+        reason: 'to check the local weather',
+        title: 'Share your location?',
+      },
+      arguments: { reason: 'to check the local weather' },
+      displayTitle: 'Checking your location',
+      executor: 'client',
+      id: 'call_1',
+      name: 'get_location',
+      status: 'awaiting_approval',
+      targetClientId: 'ios-1',
+      targetUserId: 'alex',
+    });
+  });
+
+  it('reads a tool call with its authorization', () => {
+    const call = parseMessagePart(authorizationCall)?.toolCall;
+    expect(call?.authorization).toEqual({
+      expiresAt: Date.parse('2026-11-02T10:10:00.123Z'),
+      handoffToken: 'tok',
+      message: 'The agent needs your Linear account to file the issue.',
+      provider: 'linear',
+      providerName: 'Linear',
+      status: undefined,
+      title: 'Connect Linear',
+      type: 'oauth',
+      url: 'https://router.example.com/v1/agents/connectors/oauth/launch/abc',
+    });
+  });
+
+  it('defaults missing fields', () => {
+    const part = parseMessagePart({ type: 'ai_tool_call' }, 3);
+    expect(part?.id).toBe('ai_tool_call-3');
+    expect(part?.version).toBe(1);
+    expect(part?.toolCall).toMatchObject({
+      executor: 'server',
+      name: '',
+      status: 'running',
+    });
+    expect(parseMessagePart({ type: 'ai_reasoning' })?.reasoning?.status).toBe('completed');
+  });
+
+  it('reads fields of the wrong type as missing', () => {
+    const call = parseMessagePart({
+      approval: { message: 'no title' },
+      authorization: { title: 'Connect', url: 'ftp://example.com/launch' },
+      duration_ms: '12',
+      id: 7,
+      name: ['x'],
+      status: '',
+      type: 'ai_tool_call',
+    })?.toolCall;
+    expect(call).toMatchObject({ durationMs: undefined, id: 'ai_tool_call-0', name: '' });
+    expect(call?.status).toBe('running');
+    // a question with no title asks nothing, and a sign-in needs a web page
+    expect(call?.approval).toBeUndefined();
+    expect(call?.authorization).toBeUndefined();
+  });
+
+  it('opens a sign-in only on a web page with a host', () => {
+    expect(
+      signInWithUrl('http://localhost:8080/v1/agents/connectors/oauth/launch/abc'),
+    ).toBeDefined();
+    expect(signInWithUrl('HTTPS://router.example.com')).toBeDefined();
+    expect(signInWithUrl('https://user@router.example.com/launch')).toBeDefined();
+    expect(signInWithUrl('https://')).toBeUndefined();
+    expect(signInWithUrl('https:///launch')).toBeUndefined();
+    expect(signInWithUrl('javascript:alert(1)')).toBeUndefined();
+    expect(signInWithUrl('router.example.com/launch')).toBeUndefined();
+  });
+
+  it('reads a sign-in where URL does not implement protocol or host', () => {
+    // React Native before 0.80 throws "not implemented" from these getters.
+    const OriginalURL = globalThis.URL;
+    class LimitedURL {
+      get host(): string {
+        throw new Error('URL.host is not implemented');
+      }
+      get protocol(): string {
+        throw new Error('URL.protocol is not implemented');
+      }
+    }
+    globalThis.URL = LimitedURL as unknown as typeof URL;
+    try {
+      expect(parseMessagePart(authorizationCall)?.toolCall?.authorization).toBeDefined();
+    } finally {
+      globalThis.URL = OriginalURL;
+    }
+  });
+
+  it('keeps steps it cannot read, without a typed view', () => {
+    const newer = parseMessagePart({ id: 'x', type: 'ai_tool_call', v: 2 });
+    expect(newer?.toolCall).toBeUndefined();
+    expect(newer && isSupportedPart(newer)).toBe(false);
+    const custom = parseMessagePart({ id: 'c', type: 'ai_citation', url: 'u' });
+    expect(custom?.kind).toBe('ai_citation');
+    expect(custom?.payload).toMatchObject({ url: 'u' });
+    expect(custom && isSupportedPart(custom)).toBe(false);
+  });
+
+  it('ignores what is not an AI step', () => {
+    expect(parseMessageParts(undefined)).toEqual([]);
+    expect(parseMessageParts([null, 'x', { type: 'file' }, {}])).toEqual([]);
+  });
+});
+
+describe('tool call addressing', () => {
+  const call = (overrides: Partial<AIToolCallPart>): AIToolCallPart => ({
+    ...(parseMessagePart(approvalCall)?.toolCall as AIToolCallPart),
+    ...overrides,
+  });
+
+  it('asks the targeted person on the targeted install', () => {
+    expect(isAwaitingApproval(call({}), 'alex', 'ios-1')).toBe(true);
+    expect(isAwaitingApproval(call({}), 'alex', 'android-2')).toBe(false);
+    expect(isAwaitingApproval(call({}), 'sam', 'ios-1')).toBe(false);
+  });
+
+  it('asks a server tool on any of the person’s installs', () => {
+    const server = call({ executor: 'server', targetClientId: undefined });
+    expect(isAwaitingApproval(server, 'alex', 'ios-1')).toBe(true);
+    expect(isAwaitingApproval(server, 'alex', 'android-9')).toBe(true);
+  });
+
+  it('asks nothing once answered or without a question', () => {
+    expect(isAwaitingApproval(call({ status: 'running' }), 'alex', 'ios-1')).toBe(false);
+    expect(isAwaitingApproval(call({ approval: undefined }), 'alex', 'ios-1')).toBe(false);
+  });
+
+  it('waits for this device to run a client tool', () => {
+    const device = call({ status: 'awaiting_client' });
+    expect(isAwaitingClient(device, 'alex', 'ios-1')).toBe(true);
+    expect(isAwaitingClient(device, 'alex', 'ios-2')).toBe(false);
+    expect(isAwaitingClient(call({ executor: 'server' }), 'alex', 'ios-1')).toBe(false);
+  });
+
+  it('asks the targeted person to sign in from any install', () => {
+    const signIn = parseMessagePart(authorizationCall)?.toolCall as AIToolCallPart;
+    expect(isAwaitingAuthorization(signIn, 'alex')).toBe(true);
+    expect(isAwaitingAuthorization(signIn, 'sam')).toBe(false);
+    expect(isAwaitingAuthorization({ ...signIn, status: 'completed' }, 'alex')).toBe(false);
+  });
+
+  it('knows a declined call', () => {
+    const declinedApproval = call({
+      approval: { decision: 'declined', title: 'Share?' },
+      status: 'cancelled',
+    });
+    expect(isDeclined(declinedApproval)).toBe(true);
+    const signIn = parseMessagePart(authorizationCall)?.toolCall as AIToolCallPart;
+    expect(
+      isDeclined({
+        ...signIn,
+        authorization: { ...signIn.authorization!, status: 'declined' },
+      }),
+    ).toBe(true);
+    expect(isDeclined(call({}))).toBe(false);
+  });
+
+  it('knows finished statuses and expired sign-ins', () => {
+    expect(['completed', 'failed', 'cancelled'].every(isToolCallFinished)).toBe(true);
+    expect(isToolCallFinished('awaiting_client')).toBe(false);
+    const signIn = parseMessagePart(authorizationCall)?.toolCall?.authorization as NonNullable<
+      AIToolCallPart['authorization']
+    >;
+    expect(isAuthorizationExpired(signIn, signIn.expiresAt! - 1)).toBe(false);
+    expect(isAuthorizationExpired(signIn, signIn.expiresAt!)).toBe(true);
+    expect(isAuthorizationExpired({ ...signIn, status: 'connected' }, Infinity)).toBe(false);
+  });
+});

package/src/ai-components/__tests__/messageViews.test.tsx

@@ -0,0 +1,321 @@
+import React, { type ReactElement } from 'react';
+import { Linking, Share, Text } from 'react-native';
+
+import { act, fireEvent, render, screen } from '@testing-library/react-native';
+
+import {
+  AIAssistantMessage,
+  type AIIcon,
+  AIMessageAttachment,
+  type AIMessageAttachmentProps,
+  AIReplyActions,
+  AIUserMessage,
+  attachmentDetails,
+  defaultAIIcons,
+  formatFileSize,
+  mergeThemes,
+  parseMessageParts,
+  StreamTheme,
+} from '../index';
+import { forgetCallStates } from '../message-parts/callStates';
+import { setClipboardString } from '../services/clipboard-service';
+
+// Each test's questions start unanswered, though tests reuse calls.
+afterEach(forgetCallStates);
+
+jest.mock('../services/clipboard-service', () => ({ setClipboardString: jest.fn() }));
+
+const renderWithTheme = (ui: ReactElement) => render(<StreamTheme>{ui}</StreamTheme>);
+
+afterEach(() => {
+  jest.restoreAllMocks();
+  jest.useRealTimers();
+});
+
+describe('formatFileSize', () => {
+  it('writes three significant digits in the largest unit that fits', () => {
+    expect(formatFileSize(0)).toBe('0.00 B');
+    expect(formatFileSize(512)).toBe('512 B');
+    expect(formatFileSize(2_453_000)).toBe('2.34 MB');
+  });
+
+  it('rounds a size just below the next unit instead of turning exponential', () => {
+    expect(formatFileSize(1000)).toBe('1000 B');
+    expect(formatFileSize(1023 * 1024)).toBe('1023 kB');
+  });
+});
+
+describe('attachmentDetails', () => {
+  it('joins the type and the size', () => {
+    expect(attachmentDetails({ kind: 'file', name: 'report.pdf', size: 2_453_000 })).toBe(
+      'PDF · 2.34 MB',
+    );
+  });
+
+  it('takes the type from the URL, then the media type', () => {
+    expect(attachmentDetails({ kind: 'file', url: 'https://x.io/a/notes.txt?v=1' })).toBe('TXT');
+    expect(attachmentDetails({ kind: 'file', mimeType: 'image/svg+xml' })).toBe('SVG');
+  });
+
+  it('is empty with nothing to say', () => {
+    expect(attachmentDetails({ kind: 'file' })).toBe('');
+  });
+});
+
+describe('AIMessageAttachment', () => {
+  it('shows an image as a thumbnail named for it, which does not open', () => {
+    const openURL = jest.spyOn(Linking, 'openURL').mockResolvedValue(undefined);
+    renderWithTheme(
+      <AIMessageAttachment attachment={{ kind: 'image', url: 'https://x.io/cat.png' }} />,
+    );
+    expect(screen.getByLabelText('cat.png')).toBeTruthy();
+    expect(screen.queryByRole('imagebutton')).toBeNull();
+    expect(screen.queryByRole('link')).toBeNull();
+    expect(openURL).not.toHaveBeenCalled();
+  });
+
+  it('shows an image without a URL as a file', () => {
+    renderWithTheme(<AIMessageAttachment attachment={{ kind: 'image', name: 'photo.png' }} />);
+    expect(screen.getByText('photo.png')).toBeTruthy();
+    expect(screen.getByText('PNG')).toBeTruthy();
+  });
+
+  it('shows a file with its name, type and size, and opens one at a web URL', () => {
+    const openURL = jest.spyOn(Linking, 'openURL').mockResolvedValue(undefined);
+    renderWithTheme(
+      <AIMessageAttachment
+        attachment={{ kind: 'file', name: 'report.pdf', size: 2_453_000, url: 'https://x.io/r' }}
+      />,
+    );
+    expect(screen.getByText('report.pdf')).toBeTruthy();
+    expect(screen.getByText('PDF · 2.34 MB')).toBeTruthy();
+    fireEvent.press(screen.getByRole('link'));
+    expect(openURL).toHaveBeenCalledWith('https://x.io/r');
+  });
+
+  it("doesn't open anything but a web URL", () => {
+    renderWithTheme(
+      <AIMessageAttachment attachment={{ kind: 'file', name: 'x', url: 'javascript:alert(1)' }} />,
+    );
+    expect(screen.queryByRole('link')).toBeNull();
+  });
+
+  it('names one without a name by its kind, and shows a kind it does not know as a file', () => {
+    renderWithTheme(<AIMessageAttachment attachment={{ kind: 'image' }} />);
+    expect(screen.getByText('Image')).toBeTruthy();
+    renderWithTheme(<AIMessageAttachment attachment={{ kind: 'audio' }} />);
+    expect(screen.getByText('File')).toBeTruthy();
+  });
+});
+
+describe('AIUserMessage', () => {
+  it('shows the text and the attachments', () => {
+    renderWithTheme(
+      <AIUserMessage attachments={[{ kind: 'file', name: 'a.pdf' }]} text='Summarise this' />,
+    );
+    expect(screen.getByText('Summarise this')).toBeTruthy();
+    expect(screen.getByText('a.pdf')).toBeTruthy();
+  });
+
+  it('offers editing only with onEdit', () => {
+    const onEdit = jest.fn();
+    const { rerender } = renderWithTheme(<AIUserMessage text='Hi' />);
+    expect(screen.queryByRole('button', { name: 'Edit' })).toBeNull();
+    rerender(
+      <StreamTheme>
+        <AIUserMessage onEdit={onEdit} text='Hi' />
+      </StreamTheme>,
+    );
+    fireEvent.press(screen.getByRole('button', { name: 'Edit' }));
+    expect(onEdit).toHaveBeenCalledTimes(1);
+  });
+
+  it('shows no bubble for a message of attachments alone', () => {
+    renderWithTheme(<AIUserMessage attachments={[{ kind: 'file', name: 'a.pdf' }]} text='' />);
+    expect(screen.queryByRole('button', { name: 'Edit' })).toBeNull();
+    expect(screen.getByText('a.pdf')).toBeTruthy();
+  });
+});
+
+describe('AIAssistantMessage', () => {
+  it('shows the steps, then the answer, then the attachments', () => {
+    const parts = parseMessageParts([
+      { id: 'r1', status: 'completed', summary: 'Looked it up', type: 'ai_reasoning' },
+    ]);
+    renderWithTheme(
+      <AIAssistantMessage
+        attachments={[{ kind: 'file', name: 'chart.csv' }]}
+        parts={parts}
+        text='The answer'
+      />,
+    );
+    expect(screen.getByTestId('ai-message-parts')).toBeTruthy();
+    expect(screen.getByText('The answer')).toBeTruthy();
+    expect(screen.getByText('chart.csv')).toBeTruthy();
+  });
+
+  it('starts its steps afresh for another message, whose step ids may repeat', () => {
+    // Every reply's first reasoning step can be `r1`: only the message tells them apart.
+    const parts = parseMessageParts([
+      { id: 'r1', status: 'completed', summary: 'Looked it up', type: 'ai_reasoning' },
+    ]);
+    const view = (id: string) => (
+      <StreamTheme>
+        <AIAssistantMessage
+          id={id}
+          parts={parts}
+          reasoningText={() => 'The whole thought'}
+          text='The answer'
+        />
+      </StreamTheme>
+    );
+    const { rerender } = render(view('a'));
+    fireEvent.press(screen.getByRole('button', { expanded: false }));
+    expect(screen.getByText('The whole thought')).toBeTruthy();
+
+    rerender(view('a'));
+    expect(screen.getByRole('button', { expanded: true })).toBeTruthy();
+
+    // As when a list reuses the view for another reply.
+    rerender(view('b'));
+    expect(screen.getByRole('button', { expanded: false })).toBeTruthy();
+    expect(screen.queryByText('The whole thought')).toBeNull();
+  });
+
+  it('is busy while the agent writes it', () => {
+    renderWithTheme(<AIAssistantMessage isGenerating text='Partial' />);
+    expect(screen.getByTestId('ai-assistant-message').props.accessibilityState).toEqual({
+      busy: true,
+    });
+  });
+
+  it('shows nothing of the answer before it has text', () => {
+    renderWithTheme(<AIAssistantMessage text='' />);
+    expect(screen.queryByTestId('ai-message-parts')).toBeNull();
+  });
+});
+
+describe('AIReplyActions', () => {
+  it('copies the text and shows it was copied for a moment', () => {
+    jest.useFakeTimers();
+    renderWithTheme(<AIReplyActions text='The answer' />);
+    fireEvent.press(screen.getByRole('button', { name: 'Copy' }));
+    expect(setClipboardString).toHaveBeenCalledWith('The answer');
+    expect(screen.getByRole('button', { name: 'Copied' })).toBeTruthy();
+    act(() => {
+      jest.advanceTimersByTime(1500);
+    });
+    expect(screen.getByRole('button', { name: 'Copy' })).toBeTruthy();
+  });
+
+  it('shares the text through the system share sheet', () => {
+    const share = jest
+      .spyOn(Share, 'share')
+      .mockResolvedValue({ action: 'sharedAction', activityType: undefined });
+    renderWithTheme(<AIReplyActions text='The answer' />);
+    fireEvent.press(screen.getByRole('button', { name: 'Share' }));
+    expect(share).toHaveBeenCalledWith({ message: 'The answer' });
+  });
+
+  it('offers regenerating and rating only when given what they do', () => {
+    renderWithTheme(<AIReplyActions text='x' />);
+    expect(screen.queryByRole('button', { name: 'Regenerate' })).toBeNull();
+    expect(screen.queryByRole('button', { name: 'Good response' })).toBeNull();
+  });
+
+  it('regenerates', () => {
+    const onRegenerate = jest.fn();
+    renderWithTheme(<AIReplyActions onRegenerate={onRegenerate} text='x' />);
+    fireEvent.press(screen.getByRole('button', { name: 'Regenerate' }));
+    expect(onRegenerate).toHaveBeenCalledTimes(1);
+  });
+
+  it('rates, and takes a rating back', () => {
+    const onRate = jest.fn();
+    const { rerender } = renderWithTheme(<AIReplyActions onRate={onRate} text='x' />);
+    fireEvent.press(screen.getByRole('button', { name: 'Bad response' }));
+    expect(onRate).toHaveBeenLastCalledWith('negative');
+
+    rerender(
+      <StreamTheme>
+        <AIReplyActions onRate={onRate} rating='positive' text='x' />
+      </StreamTheme>,
+    );
+    const good = screen.getByRole('button', { name: 'Good response' });
+    expect(good.props.accessibilityState).toEqual({ selected: true });
+    fireEvent.press(good);
+    expect(onRate).toHaveBeenLastCalledWith(null);
+  });
+});
+
+const iconNamed =
+  (name: string): AIIcon =>
+  () => <Text>{`icon:${name}`}</Text>;
+
+describe('icons', () => {
+  it('draws with the theme’s icons over the defaults', () => {
+    render(
+      <StreamTheme style={{ icons: { Copy: iconNamed('Copy'), Share: iconNamed('Share') } }}>
+        <AIReplyActions onRate={jest.fn()} text='x' />
+      </StreamTheme>,
+    );
+    expect(screen.getByText('icon:Copy')).toBeTruthy();
+    expect(screen.getByText('icon:Share')).toBeTruthy();
+    expect(screen.queryByText('icon:ThumbsUp')).toBeNull();
+  });
+
+  it('keeps icons as they are when themes merge', () => {
+    const Copy = iconNamed('Copy');
+    const Share = iconNamed('Share');
+    const theme = mergeThemes({ style: { icons: { Copy } } });
+    expect(theme.icons?.Copy).toBe(Copy);
+    const merged = mergeThemes({ style: { icons: { Share } }, theme });
+    expect(merged.icons).toEqual({ Copy, Share });
+    expect(merged.colors).toEqual(theme.colors);
+  });
+
+  it.each([
+    [{ kind: 'file', name: 'report.pdf' }, 'Pdf'],
+    [{ kind: 'file', mimeType: 'application/pdf', name: 'report' }, 'Pdf'],
+    [{ kind: 'file', name: 'song.mp3' }, 'Audio'],
+    [{ kind: 'file', mimeType: 'video/mp4', name: 'clip' }, 'Video'],
+    [{ kind: 'file', name: 'backup.zip' }, 'Archive'],
+    [{ kind: 'file', mimeType: 'application/vnd.rar', name: 'x' }, 'Archive'],
+    [{ kind: 'image', name: 'photo' }, 'Image'],
+    [{ kind: 'file', name: 'notes.txt' }, 'File'],
+  ])('gives a file of %o the %s icon', (attachment, icon) => {
+    const icons = Object.fromEntries(
+      Object.keys(defaultAIIcons).map((name) => [name, iconNamed(name)]),
+    );
+    render(
+      <StreamTheme style={{ icons }}>
+        <AIMessageAttachment attachment={attachment} />
+      </StreamTheme>,
+    );
+    expect(screen.getByText(`icon:${icon}`)).toBeTruthy();
+  });
+});
+
+describe('Attachment slot', () => {
+  const Mine = ({ attachment, role }: AIMessageAttachmentProps) => (
+    <Text>{`mine:${role}:${attachment.name}`}</Text>
+  );
+
+  it('shows the person’s attachments with a view of your own', () => {
+    renderWithTheme(
+      <AIUserMessage Attachment={Mine} attachments={[{ kind: 'file', name: 'a.pdf' }]} text='' />,
+    );
+    expect(screen.getByText('mine:user:a.pdf')).toBeTruthy();
+  });
+
+  it('shows the agent’s attachments with a view of your own', () => {
+    renderWithTheme(
+      <AIAssistantMessage
+        Attachment={Mine}
+        attachments={[{ kind: 'file', name: 'b.csv' }]}
+        text='x'
+      />,
+    );
+    expect(screen.getByText('mine:assistant:b.csv')).toBeTruthy();
+  });
+});