import { render, screen } from '@testing-library/react';
import { MemoryRouter } from 'react-router';
import { describe, expect, it, vi } from 'vitest';
import SortCategorySelectModal from './sort-category-select-modal';

// CategorySelect は SWR 経由でカテゴリー一覧 API を叩くため、本テストの関心事
// （素の button → Button コンポーネント置き換えで DOM クラスが変わらないこと）とは無関係。
vi.mock('@features/category/components/category-select/category-select', () => ({
  default: () => <div data-testid="category-select-stub" />,
}));

const renderModal = () =>
  render(
    <MemoryRouter>
      <SortCategorySelectModal isOpen onClose={vi.fn()} />
    </MemoryRouter>
  );

describe('SortCategorySelectModal', () => {
  it('キャンセルボタンが Button コンポーネント経由でも既存の acms-admin-btn クラスのまま描画される', () => {
    renderModal();
    const cancelButton = screen.getByRole('button', { name: ACMS.i18n('entry_index.sort_mode.modal.cancel') });
    expect(cancelButton).toHaveClass('acms-admin-btn');
    expect(cancelButton).toHaveAttribute('type', 'button');
  });

  it('適用ボタンが acms-admin-btn-admin 系の独立クラスを維持したまま描画される（unstyled で acms-admin-btn 側の装飾は打ち消される）', () => {
    renderModal();
    const applyButton = screen.getByRole('button', { name: ACMS.i18n('entry_index.sort_mode.modal.apply') });
    expect(applyButton).toHaveClass('acms-admin-btn-admin');
    expect(applyButton).toHaveClass('acms-admin-btn-admin-primary');
    expect(applyButton).toHaveAttribute('type', 'submit');
    expect(applyButton).toHaveAttribute('form', 'sort-category-select-form');
  });
});
