'use client'

import { useEffect } from 'react'
import { useBacklogStore, type BacklogPbi, type BacklogStory, type BacklogTask } from '@/stores/backlog-store'
import { useBacklogRealtime } from '@/lib/realtime/use-backlog-realtime'

interface InitialData {
  pbis: BacklogPbi[]
  storiesByPbi: Record<string, BacklogStory[]>
  tasksByStory: Record<string, BacklogTask[]>
}

interface BacklogHydrationWrapperProps {
  initialData: InitialData
  productId: string
  children: React.ReactNode
}

export function BacklogHydrationWrapper({ initialData, productId, children }: BacklogHydrationWrapperProps) {
  const setInitialData = useBacklogStore((s) => s.setInitialData)

  useEffect(() => {
    setInitialData(initialData)
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [])

  useBacklogRealtime(productId)

  return <>{children}</>
}