import { createContext, useContext, useEffect, useState, type ReactNode } from 'react'
import { apiFetch, ApiError } from './api'

export interface Route {
  id: number
  name: string
}

const ROUTE_STORAGE_KEY = 'vinindkoeb_admin_route_id'

interface RouteState {
  routes: Route[]
  selectedRouteId: number | null
  selectRoute: (id: number) => void
  loading: boolean
  error: string | null
}

const RouteContext = createContext<RouteState | null>(null)

export function RouteProvider({ children }: { children: ReactNode }) {
  const [routes, setRoutes] = useState<Route[]>([])
  const [selectedRouteId, setSelectedRouteId] = useState<number | null>(null)
  const [loading, setLoading] = useState(true)
  const [error, setError] = useState<string | null>(null)

  useEffect(() => {
    apiFetch<Route[]>('/routes')
      .then((data) => {
        setRoutes(data)
        if (data.length === 0) return
        const stored = localStorage.getItem(ROUTE_STORAGE_KEY)
        const storedId = stored ? Number(stored) : null
        const validStoredId = storedId !== null && data.some((r) => r.id === storedId) ? storedId : null
        setSelectedRouteId(validStoredId ?? data[0].id)
      })
      .catch((err) => {
        setError(err instanceof ApiError ? err.message : 'Kunne ikke hente ruter')
      })
      .finally(() => setLoading(false))
  }, [])

  function selectRoute(id: number) {
    setSelectedRouteId(id)
    localStorage.setItem(ROUTE_STORAGE_KEY, String(id))
  }

  return (
    <RouteContext.Provider value={{ routes, selectedRouteId, selectRoute, loading, error }}>
      {children}
    </RouteContext.Provider>
  )
}

export function useRoute(): RouteState {
  const context = useContext(RouteContext)
  if (!context) throw new Error('useRoute skal bruges inden i RouteProvider')
  return context
}