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

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

const mockDevices = createFixtureList(createDeviceFixture, 10, [
  { id: 'device-1', device_model: 'BP Monitor Pro', device_type: 'blood_pressure', status: 'online' },
  { id: 'device-2', device_model: 'GlucoSense Lite', device_type: 'blood_glucose', status: 'offline' },
]);

createListPageTests({
  Component: DeviceManage,
  apiPath: '/api/v1/health/devices',
  columns: ['设备 ID', '设备型号', '设备类型', '状态'],
  firstRowTexts: ['BP Monitor Pro'],
  totalItems: 10,
  hasCreateButton: false,
  hasSearch: true,
  hasPagination: true,
  mockItems: mockDevices as Record<string, unknown>[],
});

describe('DeviceManage extra tests', () => {
  it('shows filter controls for device type and status', async () => {
    vi.setConfig({ testTimeout: 15000 });
    renderWithProviders(<DeviceManage />);
    await waitFor(() => {
      expect(screen.getByText('设备管理')).toBeInTheDocument();
    });
    const selects = document.querySelectorAll('.ant-select');
    expect(selects.length).toBeGreaterThanOrEqual(2);
  });
});
