import { act, fireEvent, render, screen, waitFor, within } from '@testing-library/react';
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { ImageWorkspaceApiError } from '@/lib/image-workspace';
import { ImageCanvas } from '@/pages/ImageCanvas';
import { useAuthStore } from '@/stores/auth';
import { useImagePromptMuseumStore } from '@/stores/image-prompt-museum';
import { useImageWorkspaceStore } from '@/stores/image-workspace';
import {
  designBootstrapFixture,
  designFormFixture,
  designQuoteFixture,
  designWorkspaceFixture,
} from '../fixtures/design-workspace-v2';

const { toastErrorMock } = vi.hoisted(() => ({ toastErrorMock: vi.fn() }));

vi.mock('sonner', () => ({
  toast: { error: toastErrorMock, success: vi.fn() },
}));

vi.mock('@/lib/image-workspace', async (importOriginal) => {
  const original = await importOriginal<typeof import('@/lib/image-workspace')>();
  return {
    ...original,
    resolveImageWorkspaceAssetUrl: vi.fn().mockReturnValue(new Promise(() => undefined)),
    saveImageWorkspaceAsset: vi.fn().mockResolvedValue({ status: 'saved' }),
    uploadImageWorkspaceAsset: vi.fn(),
  };
});

function setViewport(desktop: boolean) {
  window.matchMedia = vi.fn().mockImplementation(() => ({
    matches: desktop,
    media: '(min-width: 1024px)',
    onchange: null,
    addEventListener: vi.fn(),
    removeEventListener: vi.fn(),
    addListener: vi.fn(),
    removeListener: vi.fn(),
    dispatchEvent: vi.fn(),
  }));
}

function prepareWorkspace(overrides = {}) {
  const workspace = designWorkspaceFixture(overrides);
  const actions = {
    load: vi.fn(),
    connectEvents: vi.fn(),
    disconnectEvents: vi.fn(),
    refreshWorkspace: vi.fn().mockResolvedValue(workspace),
    createProject: vi.fn().mockResolvedValue(workspace),
    renameProject: vi.fn().mockResolvedValue(workspace),
    deleteProject: vi.fn().mockResolvedValue({ workspaceId: 'workspace-1', deleted: true }),
    selectProject: vi.fn().mockResolvedValue(undefined),
    applyFieldOperations: vi.fn().mockResolvedValue(workspace),
    sendChat: vi.fn().mockResolvedValue(workspace),
    resolveDecisionPrompt: vi.fn().mockResolvedValue(workspace),
    requestQuote: vi.fn().mockResolvedValue(workspace),
    confirmGeneration: vi.fn().mockResolvedValue(workspace),
    retryOperation: vi.fn().mockResolvedValue(workspace),
  };
  useImageWorkspaceStore.setState({
    status: 'ready',
    bootstrap: designBootstrapFixture(workspace.workspace),
    activeWorkspaceId: workspace.workspace.workspaceId,
    workspace,
    eventState: 'connected',
    lastEventId: null,
    pendingOperations: {},
    fieldDrafts: {},
    chatDraft: '',
    assistantActivities: {},
    assistantStreams: {},
    quoteBlockers: [],
    error: null,
    ...actions,
  });
  return { workspace, actions };
}

describe('AI Design Canvas page', () => {
  beforeEach(() => {
    vi.clearAllMocks();
    setViewport(false);
    useAuthStore.setState({
      initialized: true,
      accessToken: 'token',
      expiresAt: Date.now() + 60_000,
      lastActiveAt: Date.now(),
      canRefresh: true,
      user: {
        username: 'canvas-tester',
        userId: 'canvas-user',
        tenantId: null,
        deptId: null,
        authorities: [],
      },
    });
    useImagePromptMuseumStore.setState({ pendingPrompt: null });
    useImageWorkspaceStore.getState().reset();
  });

  it('keeps the loading shell until the first Workspace bootstrap settles', () => {
    const load = vi.fn();
    useImageWorkspaceStore.setState({ status: 'idle', workspace: null, bootstrap: null, load });

    render(<ImageCanvas />);

    expect(screen.getByLabelText('正在加载 AI 设计')).toBeInTheDocument();
    expect(screen.queryByTestId('image-workspace-empty-state')).not.toBeInTheDocument();
    expect(load).toHaveBeenCalledOnce();
  });

  it('keeps conversation and the active editable plan together in the center', () => {
    prepareWorkspace();
    render(<ImageCanvas />);

    const conversation = screen.getByTestId('image-workspace-conversation');
    expect(conversation).toHaveClass('bg-background');
    expect(conversation).not.toHaveClass('bg-surface-subtle/45');
    expect(within(conversation).getByTestId('design-message-composer')).toHaveClass('max-w-[50rem]');
    expect(within(conversation).getByTestId('design-message-composer-surface')).toHaveClass('chat-composer-surface');
    expect(within(conversation).queryByRole('heading', { name: '和 AI 一起完善创作' })).not.toBeInTheDocument();
    expect(within(conversation).getByRole('heading', { name: '制作方案' })).toBeInTheDocument();
    expect(within(conversation).getByRole('textbox', { name: '创作提示词' })).toHaveValue(
      '把便携咖啡机呈现为城市通勤中的精密工具',
    );
    expect(within(conversation).getByRole('combobox', { name: '画幅' })).toHaveValue('3:4');
    expect(screen.queryByText('Living Form')).not.toBeInTheDocument();
    expect(screen.queryByText(/规格版本|编译器|生成策略|字段决策/)).not.toBeInTheDocument();
  });

  it('does not disable the current composer for another Workspace command', () => {
    prepareWorkspace();
    useImageWorkspaceStore.setState({
      chatDraft: '当前项目的新想法',
      pendingOperations: {
        'operation-workspace-2': {
          id: 'operation-workspace-2',
          label: '发送创作想法',
          command: {
            kind: 'apply_input',
            workspaceId: 'workspace-2',
            sessionId: 'session-2',
            expectedDirectionRevision: 2,
            clientOperationId: 'operation-workspace-2',
            input: { kind: 'chat', message: '另一个项目还在处理' },
          },
          status: 'submitting',
          error: null,
          clearDraftPaths: [],
          clearChatDraft: true,
          baseRawTurnSequence: 1,
        },
      },
    });

    render(<ImageCanvas />);

    expect(screen.getByRole('textbox', { name: '告诉 AI 你想创作什么' })).toBeEnabled();
    expect(screen.getByRole('button', { name: '发送' })).toBeEnabled();
  });

  it('places desktop production history in a full-height right rail', () => {
    setViewport(true);
    prepareWorkspace();
    render(<ImageCanvas />);

    const historyRail = screen.getByTestId('image-workspace-history-rail');
    expect(historyRail).toHaveClass('h-full', 'w-64', 'border-l');
    expect(screen.getByTestId('image-workspace-header')).toHaveClass('h-10');
    expect(screen.getByTestId('image-workspace-history-header')).toHaveClass('h-10');
    expect(within(historyRail).getByRole('heading', { name: '历史作品' })).toBeInTheDocument();
    expect(within(historyRail).queryByText('当前设计项目的制作记录')).not.toBeInTheDocument();
    expect(within(historyRail).getByText('还没有历史作品')).toBeInTheDocument();
    expect(screen.queryByTestId('image-workspace-works-rail')).not.toBeInTheDocument();
    expect(screen.queryByRole('button', { name: '项目' })).not.toBeInTheDocument();
    expect(screen.queryByText('实时同步')).not.toBeInTheDocument();
    expect(screen.queryByRole('button', { name: '刷新作品' })).not.toBeInTheDocument();
  });

  it('keeps an offered current plan actionable without a second header status row', () => {
    setViewport(true);
    prepareWorkspace({
      form: designFormFixture({ activeQuotes: [designQuoteFixture()] }),
    });
    render(<ImageCanvas />);

    expect(screen.getByRole('button', { name: '确认并开始制作' })).toBeInTheDocument();
    expect(screen.queryByText(/制作方案已准备好，确认前仍可修改/)).not.toBeInTheDocument();
    expect(screen.getByTestId('image-workspace-history-rail')).toBeInTheDocument();
    expect(screen.queryByTestId('image-workspace-works-rail')).not.toBeInTheDocument();
  });

  it('shows an incomplete meaningful plan and does not invent a selected aspect ratio', async () => {
    const form = designFormFixture();
    form.specification.values.content.concept = null;
    form.specification.values.content.action = '一只狗和一只猫在草地上互相扑咬玩闹';
    form.specification.values.output.aspect_ratio = null;
    form.specification.values.output.orientation = 'portrait';
    const { actions } = prepareWorkspace({ form });
    useImageWorkspaceStore.setState({
      quoteBlockers: [{
        code: 'aspect_ratio_required',
        message: 'Choose an aspect ratio before requesting a production quote.',
        severity: 'blocker',
        path: 'output.aspect_ratio',
      }],
    });

    render(<ImageCanvas />);

    expect(screen.getByRole('heading', { name: '制作方案' })).toBeInTheDocument();
    expect(screen.getByText('先选择作品形状。')).toBeInTheDocument();
    expect(screen.getByRole('combobox', { name: '画幅' })).toHaveValue('');
    expect(screen.getByRole('button', { name: '准备制作方案' })).toBeDisabled();

    fireEvent.change(screen.getByRole('combobox', { name: '画幅' }), {
      target: { value: '9:16' },
    });
    await waitFor(() => {
      expect(actions.applyFieldOperations).toHaveBeenCalledWith([
        { kind: 'set', path: 'output.aspect_ratio', value: '9:16' },
        { kind: 'set', path: 'output.orientation', value: 'portrait' },
      ]);
    });
  });

  it('opens project navigation as a left sheet on compact layouts', () => {
    prepareWorkspace();
    render(<ImageCanvas />);

    fireEvent.click(screen.getByRole('button', { name: '项目' }));
    const rail = screen.getByTestId('image-workspace-works-rail');
    expect(rail).toBeInTheDocument();
    expect(within(rail).getByRole('heading', { name: '设计项目' })).toBeInTheDocument();
    expect(rail.closest('[role="dialog"]')).toHaveClass('left-0');
    expect(rail.closest('[role="dialog"]')).not.toHaveClass('right-0');
  });

  it('shows one unfinished assistant reply incrementally and replaces it with the canonical turn', async () => {
    const { workspace } = prepareWorkspace();
    const firstChunk = '收到，我们要制作';
    const unfinishedDraft = `${firstChunk}一张社团活动海报。`;
    useImageWorkspaceStore.setState({
      assistantStreams: { 'operation-chat-1': firstChunk },
      pendingOperations: {
        'operation-chat-1': {
          id: 'operation-chat-1',
          label: '发送创作想法',
          command: {
            kind: 'apply_input',
            workspaceId: 'workspace-1',
            sessionId: 'session-1',
            expectedDirectionRevision: 4,
            clientOperationId: 'operation-chat-1',
            input: { kind: 'chat', message: '做一张社团活动海报' },
          },
          status: 'submitting',
          error: null,
          clearDraftPaths: [],
          clearChatDraft: true,
          baseRawTurnSequence: 1,
        },
      },
    });

    render(<ImageCanvas />);
    const conversation = screen.getByTestId('image-workspace-conversation');
    expect(within(conversation).getByTestId('pending-design-chat-operation-chat-1')).toHaveTextContent('发送中');
    expect(within(conversation).getByTestId('streaming-design-assistant-operation-chat-1')).toHaveTextContent(firstChunk);
    expect(within(conversation).queryByTestId('youth-creation-card')).not.toBeInTheDocument();

    act(() => {
      useImageWorkspaceStore.setState({ assistantStreams: { 'operation-chat-1': unfinishedDraft } });
    });
    expect(within(conversation).getByTestId('streaming-design-assistant-operation-chat-1')).toHaveTextContent(unfinishedDraft);

    act(() => {
      useImageWorkspaceStore.setState({
        workspace: {
          ...workspace,
          turns: [...workspace.turns, {
            turnId: 'turn-2',
            rawTurnSequence: 2,
            userMessage: '做一张社团活动海报',
            assistantMessage: unfinishedDraft,
          }],
        },
        pendingOperations: {},
      });
    });

    await waitFor(() => {
      expect(within(conversation).queryByTestId('streaming-design-assistant-operation-chat-1')).not.toBeInTheDocument();
    });
    expect(within(conversation).getAllByText(unfinishedDraft)).toHaveLength(1);
    expect(within(conversation).getByTestId('youth-creation-card')).toBeInTheDocument();
  });

  it('keeps each pending reply beside the user message that started it', () => {
    prepareWorkspace({ turns: [] });
    useImageWorkspaceStore.setState({
      pendingOperations: {
        'operation-chat-1': {
          id: 'operation-chat-1',
          label: '发送创作想法',
          command: {
            kind: 'apply_input',
            workspaceId: 'workspace-1',
            sessionId: 'session-1',
            expectedDirectionRevision: 4,
            clientOperationId: 'operation-chat-1',
            input: { kind: 'chat', message: '先画一只小熊' },
          },
          status: 'unknown',
          error: '结果尚未确认',
          clearDraftPaths: [],
          clearChatDraft: true,
          baseRawTurnSequence: 1,
        },
        'operation-chat-2': {
          id: 'operation-chat-2',
          label: '发送创作想法',
          command: {
            kind: 'apply_input',
            workspaceId: 'workspace-1',
            sessionId: 'session-1',
            expectedDirectionRevision: 4,
            clientOperationId: 'operation-chat-2',
            input: { kind: 'chat', message: '再补充一只小兔子' },
          },
          status: 'submitting',
          error: null,
          clearDraftPaths: [],
          clearChatDraft: true,
          baseRawTurnSequence: 1,
        },
      },
      assistantStreams: {
        'operation-chat-1': '小熊会站在月亮旁边。',
      },
    });

    render(<ImageCanvas />);

    const conversation = screen.getByTestId('image-workspace-conversation');
    const firstMessage = within(conversation).getByTestId('pending-design-chat-operation-chat-1');
    const firstReply = within(conversation)
      .getByTestId('streaming-design-assistant-operation-chat-1');
    const secondMessage = within(conversation).getByTestId('pending-design-chat-operation-chat-2');
    expect(firstMessage.compareDocumentPosition(firstReply) & Node.DOCUMENT_POSITION_FOLLOWING)
      .toBeTruthy();
    expect(firstReply.compareDocumentPosition(secondMessage) & Node.DOCUMENT_POSITION_FOLLOWING)
      .toBeTruthy();
  });

  it('shows public AI activity under the submitted message and collapses it beside the final turn', async () => {
    const message = '画一只在月球踢球的熊猫';
    const { workspace } = prepareWorkspace({ turns: [] });
    useImageWorkspaceStore.setState({
      pendingOperations: {
        'operation-chat-1': {
          id: 'operation-chat-1',
          label: '发送创作想法',
          command: {
            kind: 'apply_input',
            workspaceId: 'workspace-1',
            sessionId: 'session-1',
            expectedDirectionRevision: 4,
            clientOperationId: 'operation-chat-1',
            input: { kind: 'chat', message },
          },
          status: 'submitting',
          error: null,
          clearDraftPaths: [],
          clearChatDraft: true,
          baseRawTurnSequence: 1,
        },
      },
      assistantActivities: {
        'operation-chat-1': {
          workspaceId: 'workspace-1',
          directionId: 'direction-1',
          status: 'active',
          turnId: null,
          steps: [
            { stage: 'understanding', message: '正在听懂你刚补充的内容…' },
            { stage: 'reviewing_context', message: '正在把它和前面的设计想法放在一起看…' },
          ],
        },
      },
    });

    render(<ImageCanvas />);

    const conversation = screen.getByTestId('image-workspace-conversation');
    const pending = within(conversation).getByTestId('pending-design-chat-operation-chat-1');
    const activity = within(conversation).getByTestId('design-assistant-activity-operation-chat-1');
    expect(pending.compareDocumentPosition(activity) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
    expect(within(activity).getByRole('button', { name: /AI 处理过程/ }))
      .toHaveAttribute('aria-expanded', 'true');
    expect(within(activity).getByText('正在听懂你刚补充的内容…')).toBeInTheDocument();
    expect(within(activity).getAllByText('正在把它和前面的设计想法放在一起看…'))
      .not.toHaveLength(0);
    expect(within(activity).queryByText(/思考过程|推理内容/)).not.toBeInTheDocument();

    act(() => {
      useImageWorkspaceStore.setState({
        workspace: {
          ...workspace,
          turns: [{
            turnId: 'turn-2',
            rawTurnSequence: 2,
            userMessage: message,
            assistantMessage: '这个画面很有趣。你想让它更像漫画还是电影？',
          }],
        },
        pendingOperations: {},
        assistantActivities: {
          'operation-chat-1': {
            workspaceId: 'workspace-1',
            directionId: 'direction-1',
            status: 'completed',
            turnId: 'turn-2',
            steps: [
              { stage: 'understanding', message: '正在听懂你刚补充的内容…' },
              { stage: 'reviewing_context', message: '正在把它和前面的设计想法放在一起看…' },
            ],
          },
        },
      });
    });

    const completedActivity = within(conversation)
      .getByTestId('design-assistant-activity-operation-chat-1');
    await waitFor(() => {
      expect(within(completedActivity).getByRole('button', { name: /AI 处理过程/ }))
        .toHaveAttribute('aria-expanded', 'false');
    });
    expect(within(completedActivity).queryByText('正在听懂你刚补充的内容…'))
      .not.toBeInTheDocument();
    fireEvent.click(within(completedActivity).getByRole('button', { name: /AI 处理过程/ }));
    expect(within(completedActivity).getByText('正在听懂你刚补充的内容…')).toBeInTheDocument();
  });

  it('requests a Quote from the inline plan without starting a paid task', async () => {
    const { actions } = prepareWorkspace();
    const quotedWorkspace = designWorkspaceFixture({
      form: designFormFixture({ activeQuotes: [designQuoteFixture()] }),
    });
    actions.requestQuote.mockImplementationOnce(async () => {
      useImageWorkspaceStore.setState({ workspace: quotedWorkspace });
      return quotedWorkspace;
    });
    render(<ImageCanvas />);

    fireEvent.click(screen.getByRole('button', { name: '准备制作方案' }));

    expect(actions.requestQuote).toHaveBeenCalledOnce();
    expect(actions.confirmGeneration).not.toHaveBeenCalled();
    await waitFor(() => {
      expect(screen.getByRole('button', { name: '确认并开始制作' })).toBeInTheDocument();
    });
    expect(screen.getByText(/预计使用/)).toHaveTextContent('12');
  });

  it('shows a submitted message immediately and replaces it with the canonical turn', async () => {
    const message = '画一只在月球踢球的熊猫';
    const { workspace } = prepareWorkspace({ turns: [] });
    useImageWorkspaceStore.setState({
      chatDraft: message,
      pendingOperations: {
        'operation-chat-1': {
          id: 'operation-chat-1',
          label: '发送消息',
          command: {
            kind: 'apply_input',
            workspaceId: 'workspace-1',
            sessionId: 'session-1',
            expectedDirectionRevision: 4,
            clientOperationId: 'operation-chat-1',
            input: { kind: 'chat', message },
          },
          status: 'submitting',
          error: null,
          clearDraftPaths: [],
          clearChatDraft: true,
          baseRawTurnSequence: 1,
        },
      },
    });
    render(<ImageCanvas />);

    const conversation = screen.getByTestId('image-workspace-conversation');
    expect(within(conversation).getByTestId('pending-design-chat-operation-chat-1')).toHaveTextContent(message);
    expect(within(conversation).getByRole('textbox', { name: '告诉 AI 你想创作什么' })).toHaveValue('');

    act(() => {
      useImageWorkspaceStore.setState({
        workspace: {
          ...workspace,
          turns: [{
            turnId: 'turn-2',
            rawTurnSequence: 2,
            userMessage: message,
            assistantMessage: '听起来很有趣！你希望画面更像漫画，还是更像电影？',
          }],
        },
        chatDraft: '',
        pendingOperations: {},
      });
    });

    await waitFor(() => expect(within(conversation).getAllByText(message)).toHaveLength(1));
    expect(within(conversation).queryByTestId('pending-design-chat-operation-chat-1')).not.toBeInTheDocument();
  });

  it('invites a free description and does not turn a legacy decision prompt into a form', () => {
    const workspace = designWorkspaceFixture({
      form: designFormFixture({
        decisionPrompts: [{
          id: 'choice-1',
          kind: 'question',
          basedOnSpecificationRevisionId: 'specification-revision-3',
          targetPaths: ['visual.art_direction'],
          title: '画面想要什么感觉？',
          body: '请从下面选一个。',
          options: [{ id: 'cartoon', label: '有趣的卡通', description: null }],
        }],
      }),
      turns: [],
    });
    prepareWorkspace(workspace);
    render(<ImageCanvas />);

    const conversation = screen.getByTestId('image-workspace-conversation');
    expect(within(conversation).getByRole('heading', { name: '你想让麦洛和你一起创作什么？' })).toBeInTheDocument();
    expect(within(conversation).queryByText('画面想要什么感觉？')).not.toBeInTheDocument();
    fireEvent.click(within(conversation).getByRole('button', { name: '我想做一张热闹的社团招新海报' }));
    expect(within(conversation).getByRole('textbox', { name: '告诉 AI 你想创作什么' })).toHaveValue(
      '我想做一张热闹的社团招新海报',
    );
  });

  it('sends compact production edits through the existing typed field operations', async () => {
    const { actions } = prepareWorkspace();
    render(<ImageCanvas />);

    fireEvent.change(screen.getByRole('combobox', { name: '画幅' }), { target: { value: '16:9' } });

    await waitFor(() => {
      expect(actions.applyFieldOperations).toHaveBeenCalledWith([
        { kind: 'set', path: 'output.aspect_ratio', value: '16:9' },
        { kind: 'set', path: 'output.orientation', value: 'landscape' },
      ]);
    });
  });

  it('confirms only the offered Quote identity and keeps provider details private', () => {
    const quote = designQuoteFixture();
    quote.warnings = [{
      code: 'reference_observation_fallback',
      message: 'Reference observations were not reviewed by the frozen compiler.',
      severity: 'warning',
      path: 'references',
    }];
    const { actions } = prepareWorkspace({
      form: designFormFixture({ activeQuotes: [quote] }),
    });
    render(<ImageCanvas />);

    expect(screen.getByText('有张参考图还没检查完成，AI 会谨慎使用它。')).toBeInTheDocument();
    expect(screen.queryByText(/frozen compiler/i)).not.toBeInTheDocument();
    fireEvent.click(screen.getByRole('button', { name: '确认并开始制作' }));
    expect(actions.confirmGeneration).toHaveBeenCalledWith('quote-1');
  });

  it('prefills a museum Prompt without automatically submitting it', () => {
    const { actions } = prepareWorkspace();
    useImagePromptMuseumStore.setState({
      pendingPrompt: { promptId: 'prompt-1', title: '灵感', prompt: '做一张冷色调产品海报' },
    });
    render(<ImageCanvas />);

    expect(screen.getByDisplayValue('做一张冷色调产品海报')).toBeInTheDocument();
    expect(actions.sendChat).not.toHaveBeenCalled();
  });

  it('shows the safe reasoner failure instead of claiming the message was not sent', async () => {
    const { actions } = prepareWorkspace();
    actions.sendChat.mockRejectedValueOnce(new ImageWorkspaceApiError(
      502,
      'design_reasoner_invalid',
      'AI 没有整理好这次想法，请再试一次',
    ));
    render(<ImageCanvas />);

    fireEvent.change(screen.getByRole('textbox', { name: '告诉 AI 你想创作什么' }), {
      target: { value: '画一只会做饭的机器人' },
    });
    fireEvent.click(screen.getByRole('button', { name: '发送' }));

    await waitFor(() => {
      expect(toastErrorMock).toHaveBeenCalledWith(
        'AI 这次没听懂。你的内容还在输入框里，可以补充一个画面细节后再发送',
      );
    });
  });

  it('keeps an unknown accepted operation recoverable without offering a duplicate action', () => {
    const { actions } = prepareWorkspace();
    useImageWorkspaceStore.setState({
      pendingOperations: {
        'operation-1': {
          id: 'operation-1',
          label: '准备制作方案',
          command: {
            kind: 'request_quote',
            workspaceId: 'workspace-1',
            sessionId: 'session-1',
            expectedDirectionRevision: 4,
            specificationRevision: 3,
            clientOperationId: 'operation-1',
          },
          status: 'unknown',
          error: '网络已断开',
          clearDraftPaths: [],
          clearChatDraft: false,
          baseRawTurnSequence: null,
        },
      },
    });
    render(<ImageCanvas />);

    expect(screen.getByText('还在确认刚才的操作')).toBeInTheDocument();
    expect(screen.getByRole('button', { name: '准备制作方案' })).toBeDisabled();
    expect(actions.requestQuote).not.toHaveBeenCalled();
    fireEvent.click(screen.getByRole('button', { name: '查看原来的结果' }));
    expect(actions.retryOperation).toHaveBeenCalledWith('operation-1');
  });

  it('opens project creation from an empty Canvas', async () => {
    useImageWorkspaceStore.setState({
      status: 'ready',
      bootstrap: { ...designBootstrapFixture(), workspaces: [] },
      activeWorkspaceId: null,
      workspace: null,
      error: null,
      load: vi.fn(),
      createProject: vi.fn(),
    });
    render(<ImageCanvas />);

    fireEvent.click(screen.getByRole('button', { name: '开始第一个作品' }));
    await waitFor(() => expect(screen.getByRole('heading', { name: '新建项目' })).toBeInTheDocument());
  });
});