/**
 * Dashboard Component Tests
 */

import { describe, it, expect, vi, beforeEach } from 'vitest'
import { render, screen, waitFor } from '@testing-library/react'
import { MockedProvider } from '@apollo/client/testing'
import Dashboard from '../dashboards/Dashboard'
import { GET_REGIONS } from '@/lib/graphql/queries/resources'
import { GET_RESOURCES } from '@/lib/graphql/queries'
import { GET_METRICS } from '@/lib/graphql/queries/metrics'

const mocks = [
  {
    request: {
      query: GET_REGIONS,
    },
    result: {
      data: {
        regions: [
          {
            id: 'region-1',
            name: 'US East',
            code: 'us-east-1',
            country: 'USA',
            coordinates: { latitude: 39.8283, longitude: -98.5795 },
            sites: [],
          },
        ],
      },
    },
  },
  {
    request: {
      query: GET_RESOURCES,
    },
    result: {
      data: {
        resources: [
          {
            id: 'resource-1',
            name: 'test-resource',
            type: 'VM',
            status: 'RUNNING',
            site: { id: 'site-1', name: 'Test Site', region: 'us-east-1' },
            metadata: {},
            createdAt: new Date().toISOString(),
            updatedAt: new Date().toISOString(),
          },
        ],
      },
    },
  },
  {
    request: {
      query: GET_METRICS,
      variables: {
        resourceId: 'resource-1',
        metricType: 'CPU_USAGE',
        timeRange: {
          start: expect.any(String),
          end: expect.any(String),
        },
      },
    },
    result: {
      data: {
        metrics: {
          resource: { id: 'resource-1', name: 'test-resource' },
          metricType: 'CPU_USAGE',
          values: [
            { timestamp: new Date().toISOString(), value: 50, labels: {} },
            { timestamp: new Date().toISOString(), value: 55, labels: {} },
          ],
          timeRange: {
            start: new Date().toISOString(),
            end: new Date().toISOString(),
          },
        },
      },
    },
  },
]

describe('Dashboard', () => {
  beforeEach(() => {
    vi.clearAllMocks()
  })

  it('should render dashboard with metrics', async () => {
    render(
      <MockedProvider mocks={mocks} addTypename={false}>
        <Dashboard />
      </MockedProvider>
    )

    await waitFor(() => {
      expect(screen.getByText('Dashboard')).toBeInTheDocument()
    })

    // Check for metric cards
    expect(screen.getByText('Total Regions')).toBeInTheDocument()
    expect(screen.getByText('Active Services')).toBeInTheDocument()
  })

  it('should display loading state', () => {
    render(
      <MockedProvider mocks={[]} addTypename={false}>
        <Dashboard />
      </MockedProvider>
    )

    expect(screen.getByText('Loading...')).toBeInTheDocument()
  })
})

