import { fireEvent, render, screen } from '@testing-library/react';
import { describe, expect, it, vi } from 'vitest';
import { DataServicePluginSettings } from '@/components/plugins/data-service-settings';

const ready = {
  instance_id: 'instance-1', project_id: 'cloud-project',
  collections: [{ name: 'todos', document_count: 3, total_bytes: 2048, created_at: '2026-08-27T00:00:00Z' }],
  usage: { document_count: 3, total_bytes: 2048 },
  limits: { max_collections: 20, max_documents: 1000, max_total_bytes: 20971520, max_document_bytes: 65536, list_default_limit: 50, list_max_limit: 100, list_max_data_bytes: 1048576, mutations_per_minute: 120 },
  created_at: '2026-08-27T00:00:00Z', updated_at: '2026-08-27T00:00:00Z',
};

describe('Data Service plugin settings', () => {
  it('requires explicit collection input before configuration and prevents duplicate submit', () => {
    const onConfigure = vi.fn();
    render(<DataServicePluginSettings state="configuration_required" projectName="Demo" data={null} pending={{}} onConfigure={onConfigure} onReset={vi.fn()} onRemoveCollection={vi.fn()} onRemoveProject={vi.fn()} />);

    fireEvent.change(screen.getByLabelText('初始 collection'), { target: { value: 'todos, settings' } });
    fireEvent.click(screen.getByRole('button', { name: '创建开发数据空间' }));
    expect(onConfigure).toHaveBeenCalledWith(['todos', 'settings']);
  });

  it('shows fixed usage and limits with tabular numerals and typed destructive confirmation', () => {
    const onRemoveCollection = vi.fn();
    render(<DataServicePluginSettings state="ready" projectName="Demo" data={ready} pending={{}} onConfigure={vi.fn()} onReset={vi.fn()} onRemoveCollection={onRemoveCollection} onRemoveProject={vi.fn()} />);

    expect(screen.getByText('3 / 1,000')).toHaveClass('tabular-nums');
    expect(screen.getByText('2 KB / 20 MB')).toHaveClass('tabular-nums');
    fireEvent.click(screen.getByRole('button', { name: '移除 collection todos' }));
    expect(screen.getByRole('dialog')).toHaveTextContent('todos');
    const input = screen.getByLabelText('输入确认目标');
    fireEvent.change(input, { target: { value: 'wrong' } });
    expect(screen.getByRole('button', { name: '确认移除' })).toBeDisabled();
    fireEvent.change(input, { target: { value: 'todos' } });
    fireEvent.click(screen.getByRole('button', { name: '确认移除' }));
    expect(onRemoveCollection).toHaveBeenCalledWith('todos');
  });

  it('retains last usage structure in degraded state and disables destructive actions', () => {
    render(<DataServicePluginSettings state="degraded" projectName="Demo" data={ready} pending={{}} onConfigure={vi.fn()} onReset={vi.fn()} onRemoveCollection={vi.fn()} onRemoveProject={vi.fn()} />);
    expect(screen.getByRole('status')).toHaveTextContent('保留页面结构和上次用量');
    expect(screen.getByText('3 / 1,000')).toBeVisible();
    expect(screen.getByRole('button', { name: '移除 collection todos' })).toBeDisabled();
    expect(screen.getByRole('button', { name: '重置数据' })).toBeDisabled();
  });
});