import React from "react";
import { useContentTypes } from "@applicaster/zapp-react-native-redux/hooks";
import { useNavigation } from "@applicaster/zapp-react-native-utils/reactHooks";
import { useRivers } from "../../state";
import { createLogger } from "../../../logger";

const { log_warning } = createLogger({
  subsystem: "zapp-react-native-utils/reactHooks/videoModal",
  category: "useVideoModalScreenData",
});

export const useVideoModalScreenData = ():
  | (ZappEntry & { targetScreen: any }) // TODO: fix ZappEntry type ( was ZappRiver but conflict )
  | undefined => {
  const {
    videoModalState: { item },
  } = useNavigation();

  const contentTypes = useContentTypes();
  const rivers = useRivers();

  return React.useMemo(() => {
    const itemType = item?.type?.value;

    if (!itemType) {
      return;
    }

    const screenId = contentTypes[itemType]?.screen_id;

    if (!screenId) {
      log_warning(
        `Type mapping is missing for item type: ${itemType}, title: ${item.title}`
      );

      return;
    }

    return { ...item, targetScreen: rivers?.[screenId] };
  }, [contentTypes, item, rivers]);
};