'use client'

import { createContext, useContext, useEffect, ReactNode, Suspense } from 'react'
import { usePathname, useSearchParams } from 'next/navigation'
import { initializeAnalytics, trackPageView, trackUsage } from '@/lib/analytics'

interface AnalyticsContextType {
  isInitialized: boolean
}

const AnalyticsContext = createContext<AnalyticsContextType>({
  isInitialized: false,
})

export const useAnalytics = () => {
  const context = useContext(AnalyticsContext)
  if (!context) {
    throw new Error('useAnalytics must be used within an AnalyticsProvider')
  }
  return context
}

interface AnalyticsProviderProps {
  children: ReactNode
}

function AnalyticsTracker() {
  const pathname = usePathname()
  const searchParams = useSearchParams()
  
  useEffect(() => {
    // Initialize analytics on mount
    if (typeof window !== 'undefined') {
      initializeAnalytics()
      trackUsage.sessionStart()
    }
  }, [])

  useEffect(() => {
    // Track page views on route changes
    if (typeof window !== 'undefined') {
      const url = `${pathname}${searchParams ? `?${searchParams}` : ''}`
      trackPageView(url)
    }
  }, [pathname, searchParams])

  return null
}

export function AnalyticsProvider({ children }: AnalyticsProviderProps) {
  return (
    <AnalyticsContext.Provider value={{ isInitialized: true }}>
      <Suspense fallback={null}>
        <AnalyticsTracker />
      </Suspense>
      {children}
    </AnalyticsContext.Provider>
  )
}