import React from 'react';
import { describe, it, expect, vi, beforeEach } from 'vitest';
import { render, screen, fireEvent, waitFor } from '@testing-library/react';
import { ProactiveAISettings } from '@/pages/ProactiveAISettings';

const mockSettings = {
  enabled: true,
  suggestion_categories: ['mail', 'tasks'],
  confidence_threshold: 0.7,
  rate_limit_seconds: 15,
  model: 'ollama/deepseek-v4',
  heartbeat_enabled: true,
  heartbeat_interval_seconds: 300,
  heartbeat_target_room: 'Live KI',
};

const apiGetMock = vi.fn();
const apiPutMock = vi.fn();

vi.mock('@/api/client', () => ({
  apiClient: {
    get: (...args: any[]) => apiGetMock(...args),
    post: vi.fn().mockResolvedValue({ data: {} }),
    put: (...args: any[]) => apiPutMock(...args),
  },
}));

beforeEach(() => {
  vi.clearAllMocks();
  apiGetMock.mockResolvedValue({ data: mockSettings });
  apiPutMock.mockResolvedValue({ data: mockSettings });
});

describe('ProactiveAISettings', () => {
  it('renders proactive AI settings with title', async () => {
    render(<ProactiveAISettings />);
    await waitFor(() => {
      expect(screen.getByText('Proaktive KI')).toBeInTheDocument();
    });
  });

  it('renders enable/disable toggle', async () => {
    render(<ProactiveAISettings />);
    await waitFor(() => {
      expect(screen.getByText('Proaktive KI')).toBeInTheDocument();
    });
  });

  it('renders category checkboxes', async () => {
    render(<ProactiveAISettings />);
    await waitFor(() => {
      expect(screen.getByText('E-Mails')).toBeInTheDocument();
      expect(screen.getByText('Aufgaben')).toBeInTheDocument();
      expect(screen.getByText('Kontakte')).toBeInTheDocument();
      expect(screen.getByText('Firmen')).toBeInTheDocument();
      expect(screen.getByText('Erkenntnisse')).toBeInTheDocument();
    });
  });

  it('renders confidence threshold section', async () => {
    render(<ProactiveAISettings />);
    await waitFor(() => {
      expect(screen.getByText('Confidence Schwellwert')).toBeInTheDocument();
    });
  });

  it('renders rate limit section', async () => {
    render(<ProactiveAISettings />);
    await waitFor(() => {
      expect(screen.getByText('Rate Limit')).toBeInTheDocument();
    });
  });

  it('renders model selection dropdown', async () => {
    render(<ProactiveAISettings />);
    await waitFor(() => {
      expect(screen.getByText('KI Modell (Ollama Cloud)')).toBeInTheDocument();
    });
  });

  it('renders heartbeat section', async () => {
    render(<ProactiveAISettings />);
    await waitFor(() => {
      expect(screen.getByText('Heartbeat')).toBeInTheDocument();
    });
  });

  it('renders loading state when settings not loaded', () => {
    apiGetMock.mockReturnValue(new Promise(() => {}));
    render(<ProactiveAISettings />);
    expect(screen.getByText('Lade Einstellungen...')).toBeInTheDocument();
  });

  it('shows confidence percentage', async () => {
    render(<ProactiveAISettings />);
    await waitFor(() => {
      expect(screen.getByText('70%')).toBeInTheDocument();
    });
  });

  it('shows rate limit value', async () => {
    render(<ProactiveAISettings />);
    await waitFor(() => {
      expect(screen.getByText('15s')).toBeInTheDocument();
    });
  });
});