import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
import { render } from '@testing-library/react-native'
import React from 'react'
import { buildTestQueryClient } from '../../../__utils__/query_client'
import { ChatProvider } from '../../../contexts/chat_context'
import { VersionFooter } from '../version_footer'

const { version: packageVersion } = require('../../../../package.json') as { version: string }

let queryClient: QueryClient

beforeEach(() => {
  queryClient = buildTestQueryClient()
})

afterEach(() => {
  queryClient.clear()
})

const Wrapper = ({ children }: { children: React.ReactNode }) => (
  <QueryClientProvider client={queryClient}>
    <ChatProvider
      value={{
        token: {
          access_token: '',
          created_at: 0,
          expires_in: 0,
          scope: '',
          refresh_token: '',
          token_type: '',
        },
        onUnauthorizedResponse: () => {},
        theme: { theme: { colors: {} }, colorScheme: 'light' },
      }}
    >
      {children}
    </ChatProvider>
  </QueryClientProvider>
)

describe('VersionFooter', () => {
  it('shows the published chat-react-native version', () => {
    const { getByText } = render(<VersionFooter />, { wrapper: Wrapper })

    expect(packageVersion).toMatch(/^\d+\.\d+\.\d+/)
    expect(getByText(`Chat v${packageVersion}`)).toBeTruthy()
  })
})