"use client"

import { useEnterDetailsStore } from "@/stores/enter-details"

import { RoomContext } from "@/contexts/Details/Room"

import type { RoomProviderProps } from "@/types/providers/details/room"

export default function RoomProvider({ children, idx }: RoomProviderProps) {
  const { actions, isComplete, room, steps } = useEnterDetailsStore(
    (state) => ({
      actions: state.rooms[idx].actions,
      isComplete: state.rooms[idx].isComplete,
      room: state.rooms[idx].room,
      steps: state.rooms[idx].steps,
    })
  )

  return (
    <RoomContext.Provider
      value={{
        actions,
        idx,
        isComplete,
        room,
        roomNr: idx + 1,
        steps,
      }}
    >
      {children}
    </RoomContext.Provider>
  )
}