import { useState, type ReactNode } from "react";
import { useSightingFeed } from "../../hooks/useSightingFeed";
import { SightingFeedContext } from "../SightingFeedContext";

type SightingFeedProviderProps = {
  url?: string | undefined;
  children: ReactNode;
  side?: string | undefined;
};

export const SightingFeedProvider = ({
  children,
  url,
  side,
}: SightingFeedProviderProps) => {
  const {
    sightings,
    selectedRef,
    setSelectedRef,
    data,
    isLoading,
    isError,
    setSelectedSighting,
    selectedSighting,
    mostRecent,
    sessionStarted,
  } = useSightingFeed(url);

  const [isSightingModalOpen, setSightingModalOpen] = useState(false);

  return (
    <SightingFeedContext.Provider
      value={{
        sightings,
        selectedRef,
        setSelectedRef,
        setSelectedSighting,
        selectedSighting,
        setSightingModalOpen,
        isSightingModalOpen,
        mostRecent,
        isError,
        isLoading,
        side,
        data,
        sessionStarted,
      }}
    >
      {children}
    </SightingFeedContext.Provider>
  );
};