@applicaster/zapp-react-native-utils 12.0.0-rc.29 → 12.0.0-rc.30

package/analyticsUtils/helpers/hooks.ts

@@ -26,7 +26,7 @@ export const useHookAnalytics = (props): void => {
     if (screenData?.hookPlugin?.module?.runInBackground) {
       sendScreenEvent({ analyticsScreenData });
     }
-  }, [hookPlugin.screen_id]);
+  }, [sendScreenEvent, screenData, hookPlugin.screen_id]);
 };
 
 export const useScreenAnalytics = (props) => {

package/focusManager/index.ts

@@ -86,7 +86,7 @@ export const isFocusable = (component: ZappEntry | ZappUIComponent | any) =>
 
 type Props = {
   component: ZappUIComponent;
-  zappPipesData: ZappPipesData;
+  zappPipesData?: ZappPipesData;
 } & Record<string, any>;
 
 export const useIsFocusable = (props: Props): void => {

package/localizationUtils/index.ts

@@ -64,10 +64,13 @@ export function getIsRTLFromLocalizations(localizations): boolean {
   return R.contains(localeToUse, RTL_LOCALES);
 }
 
+const remoteConfigLocalizationSelector = R.path([
+  "remoteConfigurations",
+  "localizations",
+]);
+
 export function useIsRTL(): boolean {
-  const localizations = useSelector(
-    R.path(["remoteConfigurations", "localizations"])
-  );
+  const localizations = useSelector(remoteConfigLocalizationSelector);
 
   return getIsRTLFromLocalizations(localizations);
 }

package/logger/index.ts

@@ -72,7 +72,7 @@ const { quickBrickLogger, coreLogger, logger, logLevels, utilsLogger } =
 function useLogger(
   logger: XRayLoggerI,
   eventData: UseLoggerHookArgs,
-  deps = []
+  deps: string[] = []
 ) {
   const {
     level = logLevels.verbose,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-utils",
-  "version": "12.0.0-rc.29",
+  "version": "12.0.0-rc.30",
   "description": "Applicaster Zapp React Native utilities package",
   "main": "index.js",
   "types": "index.d.ts",
@@ -28,7 +28,7 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "12.0.0-rc.29",
+    "@applicaster/applicaster-types": "12.0.0-rc.30",
     "buffer": "^5.2.1",
     "camelize": "^1.0.0",
     "create-react-context": "^0.2.3",

package/reactHooks/flatList/useLoadNextPageIfNeeded.ts

@@ -5,27 +5,34 @@ type Return = (index: number) => void;
 
 type Predicate = (
   entry: ZappUIComponentProps["zappPipesData"]["data"]["entry"],
-  index: number
+  index: number,
+  numberOfColumns: number
 ) => boolean;
 
 type Props = {
   ifNeeded: Predicate;
   loadNextData: () => void;
   entry: ZappUIComponentProps["zappPipesData"]["data"]["entry"];
+  numberOfColumns?: number;
 };
 
 const handleLoadNextPage =
   (
-    ifNeeded: (entry: ZappEntry[], index: number) => boolean,
+    ifNeeded: (
+      entry: ZappEntry[],
+      index: number,
+      numberOfColumns?: number
+    ) => boolean,
     loadNextData: () => void,
-    entry: ZappEntry[]
+    entry: ZappEntry[],
+    numberOfColumns
   ) =>
   (index: number) => {
     /**
      * Lazy-Loading, invoke nextLoadData if we reach the end of the List
      */
 
-    if (ifNeeded(entry, index)) {
+    if (ifNeeded(entry, index, numberOfColumns)) {
       loadNextData();
     }
   };
@@ -34,10 +41,10 @@ export const useLoadNextPageIfNeeded = ({
   ifNeeded,
   loadNextData = noop,
   entry,
+  numberOfColumns = 0,
 }: Props): Return => {
-  return React.useCallback(handleLoadNextPage(ifNeeded, loadNextData, entry), [
-    ifNeeded,
-    loadNextData,
-    entry,
-  ]);
+  return React.useCallback(
+    handleLoadNextPage(ifNeeded, loadNextData, entry, numberOfColumns),
+    [ifNeeded, loadNextData, entry, numberOfColumns]
+  );
 };

package/reactHooks/state/useRivers.ts

@@ -1,7 +1,9 @@
 import { usePickFromState } from "@applicaster/zapp-react-native-redux/hooks";
 
+const riversSelector = ["rivers"];
+
 export const useRivers = () => {
-  const { rivers } = usePickFromState(["rivers"]);
+  const { rivers } = usePickFromState(riversSelector as any);
 
   return rivers;
 };

package/reactHooks/videoModal/hooks/useVideoModalScreenData.tsx

@@ -1,8 +1,7 @@
-import {
-  useContentTypes,
-  usePickFromState,
-} from "@applicaster/zapp-react-native-redux/hooks";
+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";
 
 export const useVideoModalScreenData = ():
   | (ZappEntry & { targetScreen: any }) // TODO: fix ZappEntry type ( was ZappRiver but conflict )
@@ -12,11 +11,13 @@ export const useVideoModalScreenData = ():
   } = useNavigation();
 
   const contentTypes = useContentTypes();
-  const { rivers } = usePickFromState(["rivers"]);
+  const rivers = useRivers();
 
-  if (item?.type?.value) {
-    const screenId = contentTypes[item?.type?.value].screen_id;
+  return React.useMemo(() => {
+    if (item?.type?.value) {
+      const screenId = contentTypes[item?.type?.value].screen_id;
 
-    return { ...item, targetScreen: rivers?.[screenId] };
-  }
+      return { ...item, targetScreen: rivers?.[screenId] };
+    }
+  }, [item]);
 };

package/riverComponetsMeasurementProvider/index.tsx

@@ -3,7 +3,7 @@ import { NativeModules, StyleSheet, View } from "react-native";
 import { getXray } from "@applicaster/zapp-react-native-utils/logger";
 
 import { isApplePlatform, isWeb } from "../reactUtils";
-import { usePickFromState } from "@applicaster/zapp-react-native-redux/hooks";
+import { useRivers } from "../reactHooks/state";
 
 const layoutReducer = (state, { payload }) => {
   return state.map((item, index, _state) => ({
@@ -58,7 +58,7 @@ export const ScreenLoadingMeasurements = ({
   numberOfComponents,
   riverId,
 }: Props) => {
-  const { rivers } = usePickFromState(["rivers"]);
+  const rivers = useRivers();
   const screenData = rivers?.[riverId];
 
   const [itemsLayout, dispatchItemLayout] = React.useReducer(