'use client'
import { useEffect, useState } from 'react'

interface StartupTestProps {
  children: React.ReactNode
}

export function StartupTest({ children }: StartupTestProps) {
  const [testComplete, setTestComplete] = useState(false)
  const [testPassed, setTestPassed] = useState(false)

  useEffect(() => {
    // Run startup test
    const runStartupTest = async () => {
      try {
        console.log('🚀 Running application startup tests...')
        const response = await fetch('/api/startup-test')
        const result = await response.json()

        setTestPassed(result.success)
        setTestComplete(true)

        if (result.success) {
          console.log('✅ Application startup tests passed')
        } else {
          console.warn('⚠️ Application startup tests failed:', result.message)
        }
      } catch (error) {
        console.error('❌ Failed to run startup tests:', error)
        setTestPassed(false)
        setTestComplete(true)
      }
    }

    runStartupTest()
  }, [])

  // Don't render anything special, just run the test in background
  // The test results will appear in console
  return <>{children}</>
}

// Optional: Export a hook for components that want to check startup status
export function useStartupStatus() {
  const [status, setStatus] = useState<{
    complete: boolean
    passed: boolean
    services?: { mongodb: boolean; redis: boolean }
  }>({ complete: false, passed: false })

  useEffect(() => {
    const checkStatus = async () => {
      try {
        const response = await fetch('/api/startup-test')
        const result = await response.json()
        setStatus({
          complete: true,
          passed: result.success,
          services: result.services,
        })
      } catch (error) {
        setStatus({ complete: true, passed: false })
      }
    }

    checkStatus()
  }, [])

  return status
}