import { renderHook } from '@testing-library/react'
import type { ReactNode } from 'react'
import { describe, expect, it } from 'vitest'
import { PaymentUiContext, type PaymentUiContextValue } from './context'
import { usePaymentElement } from './usePaymentElement'

function wrapper(value: PaymentUiContextValue) {
  return ({ children }: { children: ReactNode }) => (
    <PaymentUiContext.Provider value={value}>{children}</PaymentUiContext.Provider>
  )
}

describe('usePaymentElement', () => {
  it('throws PaymentProviderError outside a provider', () => {
    expect(() => renderHook(() => usePaymentElement())).toThrow(/provider/i)
  })

  it('surfaces ready + error from the context', () => {
    const value: PaymentUiContextValue = { ready: true, confirm: async () => ({ kind: 'succeeded' }), error: null }
    const { result } = renderHook(() => usePaymentElement(), { wrapper: wrapper(value) })
    expect(result.current.ready).toBe(true)
    expect(result.current.error).toBeNull()
  })
})