@applicaster/zapp-react-native-utils/analyticsUtils/helpers/hooks.ts

Applicaster Zapp React Native utilities package

import * as R from "ramda";
import * as React from "react";

import { isTV } from "@applicaster/zapp-react-native-utils/reactUtils";
import { useScreenContext } from "@applicaster/zapp-react-native-utils/reactHooks/screen";

import { getAnalyticsScreenPropertiesFromScreenData } from "@applicaster/zapp-react-native-utils/analyticsUtils/currentScreenProperities";
import { useAnalytics } from "@applicaster/zapp-react-native-utils/analyticsUtils";
import { useNavigation } from "@applicaster/zapp-react-native-utils/reactHooks";
import { usePrevious } from "@applicaster/zapp-react-native-utils/reactHooks/utils";

import { useVideoModalScreenData } from "@applicaster/zapp-react-native-utils/reactHooks/videoModal/hooks/useVideoModalScreenData";

export const useHookAnalytics = (props): void => {
  const { sendScreenEvent } = useAnalytics(props);

  const screenData = props?.screenData;
  const hookPlugin = screenData?.hookPlugin;

  React.useEffect(() => {
    const analyticsScreenData =
      getAnalyticsScreenPropertiesFromScreenData(screenData);

    // Was disided that if hook do not implement run in background
    // Protocol, plugin respinsibility to call send screen event
    if (screenData?.hookPlugin?.module?.runInBackground) {
      sendScreenEvent({ analyticsScreenData });
    }
  }, [sendScreenEvent, screenData, hookPlugin.screen_id]);
};

export const useScreenAnalytics = (props) => {
  const { sendScreenEvent } = useAnalytics(props);
  const navigator = useNavigation();

  const screenData = props?.screenData;
  const hookPlugin = screenData?.hookPlugin;
  const screenId = props?.screenId;

  React.useEffect(() => {
    // Hooks must be notified when preseneted in HookManager
    if (R.not(R.isNil(hookPlugin))) {
      return;
    }

    // We need this hack since on apple tv behaviour differ from mobile,
    // TV not updating screen id for player in navigator
    const isPlayableTv = props?.screenType === "playable" && isTV();

    if (screenId !== navigator.activeRiver?.id && isPlayableTv === false) {
      return;
    }

    const analyticsScreenData = getAnalyticsScreenPropertiesFromScreenData(
      props?.screenData
    );

    sendScreenEvent({ analyticsScreenData });
  }, [navigator?.activeRiver, navigator?.videoModalState?.visible]);
};

export const useVideoModalAnalytics = (): (() => void) => {
  const videoModalScreenData = useVideoModalScreenData();
  const { sendScreenEvent } = useAnalytics({});

  const {
    videoModalState: { mode },
    screenData,
  } = useNavigation();

  const previousMode: VideoModalMode = usePrevious(mode);

  const updateScreenPropertiesAndSendEvent = (data) => {
    const analyticsScreenData =
      getAnalyticsScreenPropertiesFromScreenData(data);

    sendScreenEvent({ analyticsScreenData });
  };

  React.useEffect(() => {
    if (previousMode === "MAXIMIZED" && mode === "MINIMIZED") {
      updateScreenPropertiesAndSendEvent(screenData);
    }

    if (
      (previousMode === "MINIMIZED" && mode === "MAXIMIZED") ||
      R.isNil(previousMode)
    ) {
      updateScreenPropertiesAndSendEvent(videoModalScreenData);
    }
  }, [mode]);

  return () => {
    updateScreenPropertiesAndSendEvent(videoModalScreenData);
  };
};

export const useTabScreenAnalytics = (props) => {
  const { sendScreenEvent } = useAnalytics(props);
  const navigator = useNavigation();
  const nestedScreen = navigator.data?.nested;
  const previousNestedScreen = usePrevious(nestedScreen);

  React.useEffect(() => {
    if (R.isNil(nestedScreen) || nestedScreen === previousNestedScreen) {
      return;
    }

    const analyticsScreenData = getAnalyticsScreenPropertiesFromScreenData({
      targetScreen: nestedScreen?.screen,
      ...nestedScreen?.entry,
    });

    sendScreenEvent({ analyticsScreenData });
  }, [props?.activeTab, nestedScreen]);
};

export const useSendAnalyticsEventWithFunction = (): ((
  analticsEventProperties: AnalyticsEventHookProperties
) => void) => {
  const screenData = useScreenContext();

  return ({
    sendAnalyticsFunction,
    extraProps = {},
  }: AnalyticsEventHookProperties) => {
    const currentScreenProperities = getAnalyticsScreenPropertiesFromScreenData(
      {
        targetScreen: screenData?.screen,
        ...screenData?.entry,
      }
    );

    // logs error inside getAnalyticsScreenPropertiesFromScreenData
    if (!currentScreenProperities) {
      return;
    }

    sendAnalyticsFunction({
      extraProps,
      analyticsScreenData: currentScreenProperities,
    });
  };
};