import React from 'react'
import { render } from '@testing-library/react'
import '@testing-library/jest-dom'
import userEvent from '@testing-library/user-event'

import { Diagnostics } from '~/src/types/diagnostics'
import { inspector, InspectorShell } from '../src/index'


jest.mock('@segment/analytics-react', () => ({
  useAnalytics: () => ({
    track: jest.fn(),
    page: jest.fn(),
    addSourceMiddleware: jest.fn()
  })
}))

describe('Nav Bar', () => {
  const mockDiagnostics: Diagnostics = {
    writeKey: 'Df2O5pN98DxX345uiEDnmM2',
    analyticsVersion: '1.42.3',
    hostname: 'localhost9000',
    failedIntegrations: ['keen'],
    integrations: [
      { name: 'Braze Web Mode', type: 'destination', version: '0.1.0' },
      { name: 'Mixpanel', type: 'destination', version: '0.1.0' },
      { name: 'Google Analytics', type: 'destination', version: '0.1.0' }
    ]
  }

  it('shows diagnostics page when diagnostics icon is clicked', async () => {
    inspector.start()
    inspector.setDiagnostics(mockDiagnostics)
    const screen = render(<InspectorShell landingPage='events' />)
    expect(screen.getByText(/waiting for events/i)).toBeInTheDocument()

    await userEvent.click(screen.getByRole('button', { name: 'View diagnostics' }))
    expect(screen.getByText(/write key/i)).toBeInTheDocument()
  })

  it('shows userDetails page when user icon is clicked', async () => {
    inspector.start()
    const screen = render(<InspectorShell landingPage='events' />)
    expect(screen.getByText(/waiting for events/i)).toBeInTheDocument()

    await userEvent.click(screen.getByRole('button', { name: 'View user' }))

    expect(screen.getByText(/Street address/i)).toBeInTheDocument()
  })

  it('shows Events page when events icon is clicked', async () => {
    inspector.start()
    inspector.setDiagnostics(mockDiagnostics)
    const screen = render(<InspectorShell landingPage='diagnostics' />)
    expect(screen.getByText(/write key/i)).toBeInTheDocument()

    await userEvent.click(screen.getByRole('button', { name: 'View events' }))

    expect(screen.getByText(/Waiting for event/i)).toBeInTheDocument()
  })
})