import { useGlobal, useContext } from "reactn";

import firebase from "../config/firebase";
import { checkBillingDetails } from "../helpers";

import { StripeEmbeddedContext } from "../providers/StripeEmbeddedProvider";
import { useWebView } from "../providers/WebViewProvider";

import useLayoutType from "./useLayoutType";

const usePaymentSession = () => {
  const [, setIsLoading] = useGlobal("_isLoading");
  const [, setTooltip] = useGlobal("_tooltip");

  const { isNative } = useLayoutType();
  const { setWebViewUrl } = useWebView();

  const [currentProjectID] = useGlobal("currentProjectID");

  const { setClientSecret } = useContext(StripeEmbeddedContext);

  const onCreatePaymentSession = async ({
    numberOfCoin = 0,
    taskList = [],
  } = {}) => {
    checkBillingDetails({
      onValidBillingDetails: () => {
        triggerPayment({ numberOfCoin, taskList });
      },
    });
  };

  const triggerPayment = async ({ numberOfCoin = 0, taskList = [] }) => {
    try {
      setIsLoading(true);

      const { data } = await firebase
        .functions()
        .httpsCallable("coins-createPaymentSession")({
        numberOfCoin,
        taskList,
        projectID: currentProjectID,
        type: "CHECKOUT",
        isEmbedded: !isNative,
      });

      if (data) {
        if (isNative) {
          setWebViewUrl(data);
        } else {
          setClientSecret(data);
        }
      } else {
        throw new Error("Erreur lors de la création du paiement");
      }
    } catch (error) {
      console.log(error);
      setTooltip({
        type: "error",
        text: error.message,
      });
    } finally {
      setIsLoading(false);
    }
  };

  return {
    onCreatePaymentSession,
  };
};

export default usePaymentSession;