import { describe, it, expect, vi } from 'vitest';
import { waitFor } from '@testing-library/react';
import { createListPageTests } from '../../test/factories/listPageTests';
import { createFixtureList, createArticleFixture } from '../../test/fixtures';
import { renderWithProviders } from '../../test/utils/renderWithProviders';
import ArticleManageList from './ArticleManageList';

// Mock useThemeMode
vi.mock('../../hooks/useThemeMode', () => ({
  useThemeMode: () => false,
}));

const mockArticles = createFixtureList(createArticleFixture, 10, [
  { id: 'article-1', title: '健康饮食指南', status: 'published', category_name: '营养健康' },
  { id: 'article-2', title: '运动与健康', status: 'draft', category_name: '运动健身' },
]);

createListPageTests({
  Component: ArticleManageList,
  apiPath: '/api/v1/health/articles',
  columns: ['标题', '分类', '状态'],
  firstRowTexts: ['健康饮食指南'],
  totalItems: 10,
  hasCreateButton: true,
  createButtonText: '新建文章',
  hasSearch: true,
  hasPagination: true,
  mockItems: mockArticles as Record<string, unknown>[],
});

describe('ArticleManageList extra tests', () => {
  it('renders status tab options after data loads', async () => {
    vi.setConfig({ testTimeout: 15000 });
    renderWithProviders(<ArticleManageList />);

    // Wait for the table to render (data loaded)
    await waitFor(() => {
      const table = document.querySelector('.ant-table');
      expect(table).toBeInTheDocument();
    });

    // Check tab items exist — Ant Design Tabs render tab labels
    const tabItems = document.querySelectorAll('[role="tab"]');
    const tabTexts = Array.from(tabItems).map((t) => t.textContent?.trim());
    // At least some tab text should be present
    expect(tabTexts.length).toBeGreaterThan(0);
  });
});
