import { useState } from 'react';
import { describe, it, expect, vi } from 'vitest';
import { screen, fireEvent } from '@testing-library/react';
import { renderWithProviders } from '../test/utils';
import FieldSchemaEditor from './FieldSchemaEditor';
import type { TreatmentFormField } from '../types';

const selectField = (options?: TreatmentFormField['options']): TreatmentFormField => ({
  key: 'spot',
  label: 'اسپات',
  type: 'select',
  required: false,
  sort_order: 0,
  options,
});

/** والدِ کنترل‌شده — همان قراردادی که مودال نوع منبع دارد. */
function Harness({ initial, onEmit }: {
  initial: TreatmentFormField[];
  onEmit?: (fields: TreatmentFormField[]) => void;
}) {
  const [value, setValue] = useState(initial);
  return (
    <FieldSchemaEditor
      value={value}
      onChange={(next) => { setValue(next); onEmit?.(next); }}
    />
  );
}

const optionsInput = () =>
  screen.getByPlaceholderText('7, 8, 9, 10, 12, 14, 16, 18') as HTMLInputElement;

describe('FieldSchemaEditor — ورودی گزینه‌های فیلد select', () => {
  it('کاما در فیلد باقی می‌ماند و پاک نمی‌شود', () => {
    renderWithProviders(<Harness initial={[selectField(['7'])]} />);

    fireEvent.change(optionsInput(), { target: { value: '7,' } });

    expect(optionsInput().value).toBe('7,');
  });

  it('فاصلهٔ بعد از کاما حفظ می‌شود و گزینهٔ بعدی تایپ‌شدنی است', () => {
    const onEmit = vi.fn();
    renderWithProviders(<Harness initial={[selectField(['7'])]} onEmit={onEmit} />);

    fireEvent.change(optionsInput(), { target: { value: '7, ' } });
    expect(optionsInput().value).toBe('7, ');

    fireEvent.change(optionsInput(), { target: { value: '7, 8' } });
    expect(optionsInput().value).toBe('7, 8');
    expect(onEmit).toHaveBeenLastCalledWith([expect.objectContaining({ options: ['7', '8'] })]);
  });

  it('کامای فارسی هم جداکننده است', () => {
    const onEmit = vi.fn();
    renderWithProviders(<Harness initial={[selectField([])]} onEmit={onEmit} />);

    fireEvent.change(optionsInput(), { target: { value: 'کم، زیاد' } });

    expect(onEmit).toHaveBeenLastCalledWith([expect.objectContaining({ options: ['کم', 'زیاد'] })]);
  });

  it('مقدار اولیه از آرایه ساخته می‌شود', () => {
    renderWithProviders(<Harness initial={[selectField(['7', '8', '9'])]} />);

    expect(optionsInput().value).toBe('7, 8, 9');
  });

  it('گزینهٔ خالی به بک‌اند فرستاده نمی‌شود', () => {
    const onEmit = vi.fn();
    renderWithProviders(<Harness initial={[selectField([])]} onEmit={onEmit} />);

    fireEvent.change(optionsInput(), { target: { value: '7,,  ,8,' } });

    expect(onEmit).toHaveBeenLastCalledWith([expect.objectContaining({ options: ['7', '8'] })]);
  });
});