import type { Dispatch, PropsWithChildren, Reducer } from "react";
import { createContext, useContext, useReducer } from "react";

import { RoomContextReducer } from "./reducer/room-reducer";
import type { RoomContextActionType } from "./types/room-action";
import type { RoomContextReducerType } from "./types/room-reduce";

interface RoomDataContextType extends RoomContextReducerType {
  dispatch: Dispatch<RoomContextActionType>;
}

const RoomContext = createContext<RoomDataContextType>(
  {} as RoomDataContextType,
);

export function RoomsCtxProvider(
  props: PropsWithChildren<RoomContextReducerType>,
) {
  const [state, dispatch] = useReducer<Reducer<RoomContextReducerType, any>>(
    RoomContextReducer,
    {
      selectedRooms: props.selectedRooms,
      activeTab: props.activeTab,
      roomCount: props.roomCount,
      searchId: props.searchId,
      roomGroupResult: props.roomGroupResult,
      passengerKeys: props.passengerKeys,
    },
  );

  return (
    // eslint-disable-next-line react/jsx-no-constructed-context-values
    <RoomContext.Provider value={{ ...state, dispatch }}>
      {props.children}
    </RoomContext.Provider>
  );
}

export function useRoomCtx(): [
  RoomContextReducerType,
  Dispatch<RoomContextActionType>,
] {
  const { dispatch, ...state } = useContext(RoomContext);
  return [state, dispatch];
}