import { fireEvent, render, screen, waitFor } from '@testing-library/react';
import type { EditableMapDocument } from '../../map/editor/types';
import { MapEditorPanel } from './MapEditorPanel';

const interactionProps = {
  onConvert: async () => true,
  canConvert: true,
  onBindInteraction: () => {},
  onSelectPreview: () => {},
  onTransformMode: () => {},
  onSnapping: () => {},
};
const document: EditableMapDocument = {
  schemaVersion: 1,
  mapId: 'map',
  revision: 0,
  objects: [],
  spawnPoints: [],
};

describe('MapEditorPanel', () => {
  it('新增并编辑对象后应用递增 revision', async () => {
    const apply = vi.fn(async (documentValue: EditableMapDocument) => Boolean(documentValue)),
      preview = vi.fn();
    render(
      <MapEditorPanel
        {...interactionProps}
        document={document}
        loading={false}
        onPreview={preview}
        onApply={apply}
        onExport={() => {}}
      />,
    );
    fireEvent.click(screen.getByRole('button', { name: '新增' }));
    fireEvent.change(screen.getByLabelText('对象位置X'), { target: { value: '2' } });
    fireEvent.click(screen.getByRole('button', { name: '应用并重新编译' }));
    await waitFor(() => expect(apply).toHaveBeenCalled());
    expect(apply.mock.calls[0][0]).toEqual(
      expect.objectContaining({
        revision: 1,
        objects: [
          expect.objectContaining({ pose: expect.objectContaining({ position: [2, 0, 0.5] }) }),
        ],
      }),
    );
  });

  it('锁定放置方式后禁用位姿编辑', () => {
    render(
      <MapEditorPanel
        {...interactionProps}
        document={document}
        loading={false}
        onPreview={() => {}}
        onApply={async () => true}
        onExport={() => {}}
      />,
    );
    fireEvent.click(screen.getByRole('button', { name: '新增' }));
    fireEvent.change(screen.getByLabelText('对象放置方式'), { target: { value: 'locked' } });
    expect(screen.getByLabelText('对象位置X')).toBeDisabled();
    expect(screen.getByLabelText('对象绕Z旋转')).toBeDisabled();
    expect(screen.getByRole('button', { name: '对齐地面' })).toBeDisabled();
  });

  it('编辑出生点并包含在应用文档中', async () => {
    const apply = vi.fn(async (value: EditableMapDocument) => Boolean(value));
    render(
      <MapEditorPanel
        {...interactionProps}
        document={document}
        loading={false}
        onPreview={() => {}}
        onApply={apply}
        onExport={() => {}}
      />,
    );
    fireEvent.click(screen.getByRole('button', { name: '新增出生点' }));
    const name = screen.getByLabelText(/出生点名称/);
    fireEvent.change(name, { target: { value: '装卸区' } });
    const yaw = screen.getByLabelText(/出生点.*朝向/);
    fireEvent.change(yaw, { target: { value: '90' } });
    fireEvent.click(screen.getByRole('button', { name: '应用并重新编译' }));
    await waitFor(() => expect(apply).toHaveBeenCalled());
    expect(apply.mock.calls[0][0].spawnPoints[0]).toMatchObject({ name: '装卸区', yawDeg: 90 });
  });

  it('没有 authoring 文档时可请求创建可编辑副本', async () => {
    const convert = vi.fn(async () => true);
    render(
      <MapEditorPanel
        {...interactionProps}
        onConvert={convert}
        document={null}
        loading={false}
        onPreview={() => {}}
        onApply={async () => true}
        onExport={() => {}}
      />,
    );
    expect(screen.getByText(/保持只读/)).toBeInTheDocument();
    fireEvent.click(screen.getByRole('button', { name: '创建可编辑副本' }));
    await waitFor(() => expect(convert).toHaveBeenCalledOnce());
  });
});