import { useState, useEffect } from 'react'
import { useAuth } from '@/components/AuthProvider'
import { useProfile } from './useProfile'
import { supabase } from '@/lib/supabase'

export function useWelcomeTour() {
  const { user } = useAuth()
  const { profile, loading: profileLoading, refetch } = useProfile()
  const [isOpen, setIsOpen] = useState(false)
  const [loading, setLoading] = useState(false)
  const [tourStartTime, setTourStartTime] = useState<number | null>(null)
  const [isCompleting, setIsCompleting] = useState(false)

  // Determine if the tour should be shown
  const shouldShowTour = !!(
    user && 
    profile && 
    !profileLoading && 
    !profile.welcome_tour_completed
  )

  // Auto-open tour for new users
  useEffect(() => {
    if (shouldShowTour && !isOpen && !isCompleting) {
      // Small delay to ensure the page has loaded
      const timer = setTimeout(() => {
        setIsOpen(true)
      }, 1000)

      return () => clearTimeout(timer)
    }
  }, [shouldShowTour, isOpen, isCompleting])

  const openTour = async () => {
    setIsOpen(true)
    setTourStartTime(Date.now())
    
    // Track tour start
    if (user?.id) {
      try {
        const { data: { session } } = await supabase.auth.getSession()
        if (session) {
          await fetch('/api/profile/tour-tracking', {
            method: 'POST',
            headers: {
              'Content-Type': 'application/json',
              'Authorization': `Bearer ${session.access_token}`
            },
            body: JSON.stringify({
              action: 'start',
              tourVersion: 'v1' // Default version for manual tour opening
            })
          })
        }
      } catch (error) {
        console.error('Error tracking tour start:', error)
      }
    }
  }

  const closeTour = async (type: 'skipped' | 'abandoned' = 'abandoned') => {
    setIsOpen(false)
    setIsCompleting(true)
    
    // Track tour close
    if (user?.id) {
      try {
        const totalTime = tourStartTime ? Math.round((Date.now() - tourStartTime) / 1000) : 0
        const { data: { session } } = await supabase.auth.getSession()
        if (session) {
          await fetch('/api/profile/tour-tracking', {
            method: 'POST',
            headers: {
              'Content-Type': 'application/json',
              'Authorization': `Bearer ${session.access_token}`
            },
            body: JSON.stringify({
              action: 'close',
              completionType: type,
              totalTimeSeconds: totalTime,
              tourVersion: 'v1' // Default version for manual tour closing
            })
          })
        }
        
        // Refetch profile to update the tour completion status
        await refetch()
        
      } catch (error) {
        console.error('Error tracking tour close:', error)
      }
    }
    setTourStartTime(null)
    setIsCompleting(false)
  }

  const completeTour = async () => {
    if (!user?.id) return

    setLoading(true)
    setIsCompleting(true)
    try {
      // Close the tour immediately
      setIsOpen(false)

      // The tour completion tracking is handled by the WelcomeTour component
      // via the tour-tracking API, so we just need to refetch the profile
      // to get the updated completion status
      await refetch()
      
    } catch (error) {
      console.error('Error completing tour:', error)
      throw error
    } finally {
      setLoading(false)
      setIsCompleting(false)
    }
  }

  return {
    isOpen,
    shouldShowTour,
    loading,
    openTour,
    closeTour,
    completeTour
  }
}