import React from 'react';
import { describe, it, expect, vi, beforeEach } from 'vitest';
import { render, screen } from '@testing-library/react';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { MemoryRouter } from 'react-router-dom';
import { I18nextProvider } from 'react-i18next';
import { ThemeProvider } from '@/app/providers/ThemeProvider';
import '@testing-library/jest-dom';
import { PortfolioDetailedGantt } from '@/features/projects/components/PortfolioDetailedGantt';
import * as projectService from '@/features/projects/services/projectService';
import i18n from '@/locales/i18n';
import type { PortfolioTimelineRow } from '@/features/projects/types/project.types';

vi.mock('@/features/projects/services/projectService');

const rows: PortfolioTimelineRow[] = [
  {
    id: 'project-p1',
    project_id: 'p1',
    title: 'Mobile App',
    owner: 'PM',
    department: 'IT',
    start_date: '2026-01-01',
    end_date: '2026-06-01',
    planned_start_date: '2026-01-01',
    planned_end_date: '2026-06-01',
    actual_start_date: null,
    actual_end_date: null,
    progress_percentage: 50,
    status: 'active',
    health: 'healthy',
    current_sprint: null,
    next_milestone: null,
    delayed_milestones_count: 0,
    milestones_count: 0,
    open_risks_count: 0,
    blocked_dependencies_count: 0,
    is_delayed: false,
    is_blocked: false,
    milestones: [],
  },
];

const projectGantt = {
  project: { id: 'p1', name: 'Mobile App', status: 'active', health: 'healthy', progress_percentage: 50 },
  timeline: [
    {
      id: 'project-p1',
      entity_id: 'p1',
      entity_type: 'project' as const,
      title: 'Mobile App',
      start_date: '2026-01-01',
      end_date: '2026-06-01',
      progress_percentage: 50,
      status: 'active',
      parent_id: null,
      depends_on: [],
      blocked_by: [],
      is_delayed: false,
      is_blocked: false,
    },
    {
      id: 'sprint-s1',
      entity_id: 's1',
      entity_type: 'sprint' as const,
      title: 'Sprint 1',
      start_date: '2026-01-01',
      end_date: '2026-01-14',
      progress_percentage: 0,
      status: 'active',
      parent_id: 'project-p1',
      depends_on: [],
      blocked_by: [],
      is_delayed: false,
      is_blocked: false,
    },
  ],
  dependencies: [],
  milestones: [],
  summary: {
    total_items: 2,
    completed_items: 0,
    blocked_items: 0,
    delayed_items: 0,
    upcoming_milestones: 0,
  },
};

describe('PortfolioDetailedGantt', () => {
  beforeEach(() => {
    vi.mocked(projectService.fetchProjectGantt).mockResolvedValue(projectGantt);
  });

  it('lazy-loads detailed hierarchy for first batch', async () => {
    const client = new QueryClient({ defaultOptions: { queries: { retry: false } } });

    render(
      <QueryClientProvider client={client}>
        <I18nextProvider i18n={i18n}>
          <ThemeProvider>
            <MemoryRouter>
              <PortfolioDetailedGantt
                rows={rows}
                rangeStart={new Date('2026-01-01')}
                rangeEnd={new Date('2026-12-31')}
                summary={{
                  total_projects: 1,
                  delayed_projects: 0,
                  blocked_projects: 0,
                  at_risk_projects: 0,
                }}
              />
            </MemoryRouter>
          </ThemeProvider>
        </I18nextProvider>
      </QueryClientProvider>,
    );

    expect(await screen.findByText('Sprint 1')).toBeInTheDocument();
    expect(projectService.fetchProjectGantt).toHaveBeenCalledWith('p1');
  });
});