@applicaster/zapp-react-native-ui-components 13.0.0-alpha.5033140607 → 13.0.0-alpha.5330008750

package/Components/VideoModal/hooks/utils/index.ts

@@ -35,3 +35,36 @@ export const orientationWasChangedFromPortraitToLandscape = ({
     isOrientationLandscape(toOrientation)
   );
 };
+
+export const showDetails = ({
+  isMobile,
+  isInline,
+  isDocked,
+  isPip,
+}: {
+  isMobile: boolean;
+  isInline: boolean;
+  isDocked: boolean;
+  isPip: boolean;
+}): boolean => {
+  if (isPip) {
+    return false;
+  }
+
+  if (isDocked) {
+    return false;
+  }
+
+  // for mobile with inline mode(rotation is portrait) we always show details.
+  if (isMobile && isInline) {
+    return true;
+  }
+
+  // for mobile with landscape rotation(player is fullscreen) we always hide details. Mounting of it is very heavy operation.
+  if (isMobile && !isInline) {
+    return false;
+  }
+
+  // for tablets we always show details
+  return true;
+};

package/Components/VideoModal/utils.ts

@@ -2,10 +2,8 @@ import * as R from "ramda";
 
 import { platformSelect } from "@applicaster/zapp-react-native-utils/reactUtils";
 import { usePickFromState } from "@applicaster/zapp-react-native-redux/hooks";
-import {
-  useNavigation,
-  useIsTablet,
-} from "@applicaster/zapp-react-native-utils/reactHooks";
+import { useNavigation } from "@applicaster/zapp-react-native-utils/reactHooks/navigation/useNavigation";
+import { useIsTablet } from "@applicaster/zapp-react-native-utils/reactHooks/device/useIsTablet";
 import { playerManager } from "@applicaster/zapp-react-native-utils/appUtils";
 
 export const useConfiguration = () => {
@@ -54,7 +52,7 @@ const fullSize = {
   height: "100%",
 };
 
-export const playerDimesionsHack = platformSelect({
+export const playerDimensionsHack = platformSelect({
   android_tv: fullSize,
   amazon: fullSize,
   lg_tv: fullSize,

package/Components/Viewport/ViewportAware/__tests__/__snapshots__/viewportAware.test.js.snap

@@ -50,7 +50,7 @@ exports[`<ViewportAware /> renders its children correctly 1`] = `
     ViewportEvents {
       "firesLastEventOnAdd": true,
       "lastEvent": null,
-      "listeners": Array [],
+      "listeners": [],
       "notify": [Function],
     }
   }
@@ -60,7 +60,7 @@ exports[`<ViewportAware /> renders its children correctly 1`] = `
       ViewportEvents {
         "firesLastEventOnAdd": true,
         "lastEvent": null,
-        "listeners": Array [],
+        "listeners": [],
         "notify": [Function],
       }
     }

package/Components/Viewport/ViewportTracker/__tests__/__snapshots__/viewportTracker.test.js.snap

@@ -15,7 +15,7 @@ exports[`<ViewportTracker /> renders correctly 1`] = `
 `;
 
 exports[`<ViewportTracker /> renders correctly 2`] = `
-Object {
+{
   "children": <TestComponent />,
   "onContentSizeChange": [Function],
   "onLayout": [Function],

package/Components/ZappUIComponent/__tests__/__snapshots__/ZappUIComponent.test.js.snap

@@ -3,7 +3,7 @@
 exports[`ZappUIComponent when zapp pipes data is loading renders correctly otherwise 1`] = `
 <ContextProvider
   value={
-    Object {
+    {
       "parent": null,
     }
   }
@@ -12,7 +12,7 @@ exports[`ZappUIComponent when zapp pipes data is loading renders correctly other
     onLoadFinished={[MockFunction]}
     parent={null}
     zappPipesData={
-      Object {
+      {
         "loading": true,
       }
     }
@@ -23,7 +23,7 @@ exports[`ZappUIComponent when zapp pipes data is loading renders correctly other
 exports[`ZappUIComponent when zapp pipes data is loading renders null if no loading component is provided 1`] = `
 <ContextProvider
   value={
-    Object {
+    {
       "parent": null,
     }
   }
@@ -32,7 +32,7 @@ exports[`ZappUIComponent when zapp pipes data is loading renders null if no load
     onLoadFinished={[MockFunction]}
     parent={null}
     zappPipesData={
-      Object {
+      {
         "loading": true,
       }
     }
@@ -43,7 +43,7 @@ exports[`ZappUIComponent when zapp pipes data is loading renders null if no load
 exports[`ZappUIComponent when zapp pipes data returns properly renders correctly 1`] = `
 <ContextProvider
   value={
-    Object {
+    {
       "parent": null,
     }
   }
@@ -52,9 +52,9 @@ exports[`ZappUIComponent when zapp pipes data returns properly renders correctly
     onLoadFinished={[MockFunction]}
     parent={null}
     zappPipesData={
-      Object {
-        "data": Object {
-          "type": Object {
+      {
+        "data": {
+          "type": {
             "value": "feed",
           },
         },
@@ -68,7 +68,7 @@ exports[`ZappUIComponent when zapp pipes data returns properly renders correctly
 exports[`ZappUIComponent whenn zapp pipes data returns with error renders correctly otherwise 1`] = `
 <ContextProvider
   value={
-    Object {
+    {
       "parent": null,
     }
   }
@@ -77,8 +77,8 @@ exports[`ZappUIComponent whenn zapp pipes data returns with error renders correc
     onLoadFinished={[MockFunction]}
     parent={null}
     zappPipesData={
-      Object {
-        "error": Object {
+      {
+        "error": {
           "message": "oups",
         },
         "loading": false,

package/Components/default-cell-renderer/__tests__/__snapshots__/defaultCellRenderer.test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`DefaultCellRenderer returns a react component and it renders correctly 1`] = `
 <View
   style={
-    Object {
+    {
       "alignItems": "flex-start",
       "flex": 1,
     }
@@ -15,7 +15,7 @@ exports[`DefaultCellRenderer returns a react component and it renders correctly
     skipButtons={false}
     store={null}
     style={
-      Object {
+      {
         "backgroundColor": "transparent",
         "margin": 12,
         "opacity": 1,
@@ -23,7 +23,7 @@ exports[`DefaultCellRenderer returns a react component and it renders correctly
       }
     }
     wrapperRef={
-      Object {
+      {
         "current": null,
       }
     }
@@ -33,7 +33,7 @@ exports[`DefaultCellRenderer returns a react component and it renders correctly
       key="0"
       skipButtons={false}
       style={
-        Object {
+        {
           "borderRadius": 3,
           "height": 80,
           "width": 169,
@@ -46,7 +46,7 @@ exports[`DefaultCellRenderer returns a react component and it renders correctly
       skipButtons={false}
       store={null}
       wrapperRef={
-        Object {
+        {
           "current": null,
         }
       }
@@ -58,7 +58,7 @@ exports[`DefaultCellRenderer returns a react component and it renders correctly
         numberOfLines={2}
         skipButtons={false}
         style={
-          Object {
+          {
             "color": "#000",
             "fontFamily": "HelveticaNeue-Light",
             "fontSize": 16,
@@ -74,7 +74,7 @@ exports[`DefaultCellRenderer returns a react component and it renders correctly
 exports[`DefaultCellRenderer returns a react component for LG TVs 1`] = `
 <View
   style={
-    Object {
+    {
       "flex": 1,
       "width": 429,
     }
@@ -86,14 +86,14 @@ exports[`DefaultCellRenderer returns a react component for LG TVs 1`] = `
     skipButtons={false}
     store={null}
     style={
-      Object {
+      {
         "aspectRatio": 0.880733945,
         "flex": 1,
         "padding": 10,
       }
     }
     wrapperRef={
-      Object {
+      {
         "current": null,
       }
     }
@@ -104,7 +104,7 @@ exports[`DefaultCellRenderer returns a react component for LG TVs 1`] = `
       skipButtons={false}
       store={null}
       style={
-        Object {
+        {
           "backgroundColor": "rgba(47,47,47,1.0)",
           "borderRadius": 4,
           "flex": 1,
@@ -112,7 +112,7 @@ exports[`DefaultCellRenderer returns a react component for LG TVs 1`] = `
         }
       }
       wrapperRef={
-        Object {
+        {
           "current": null,
         }
       }
@@ -123,7 +123,7 @@ exports[`DefaultCellRenderer returns a react component for LG TVs 1`] = `
         skipButtons={false}
         store={null}
         wrapperRef={
-          Object {
+          {
             "current": null,
           }
         }
@@ -133,7 +133,7 @@ exports[`DefaultCellRenderer returns a react component for LG TVs 1`] = `
           key="0"
           skipButtons={false}
           style={
-            Object {
+            {
               "aspectRatio": 1.7782608696,
               "backgroundColor": "rgba(47,47,47,1.0)",
             }
@@ -145,7 +145,7 @@ exports[`DefaultCellRenderer returns a react component for LG TVs 1`] = `
           skipButtons={false}
           store={null}
           wrapperRef={
-            Object {
+            {
               "current": null,
             }
           }
@@ -156,7 +156,7 @@ exports[`DefaultCellRenderer returns a react component for LG TVs 1`] = `
             numberOfLines={2}
             skipButtons={false}
             style={
-              Object {
+              {
                 "color": "rgba(239,239,239,1.0)",
                 "fontSize": 26,
                 "fontWeight": "700",
@@ -173,13 +173,13 @@ exports[`DefaultCellRenderer returns a react component for LG TVs 1`] = `
           skipButtons={false}
           store={null}
           style={
-            Object {
+            {
               "paddingHorizontal": "6%",
               "paddingTop": "3%",
             }
           }
           wrapperRef={
-            Object {
+            {
               "current": null,
             }
           }
@@ -190,7 +190,7 @@ exports[`DefaultCellRenderer returns a react component for LG TVs 1`] = `
             numberOfLines={1}
             skipButtons={false}
             style={
-              Object {
+              {
                 "color": "rgba(239,239,239,1.0)",
                 "fontSize": 24,
                 "fontWeight": "400",
@@ -207,7 +207,7 @@ exports[`DefaultCellRenderer returns a react component for LG TVs 1`] = `
 exports[`DefaultCellRenderer returns a react component for Samsung TVs 1`] = `
 <View
   style={
-    Object {
+    {
       "flex": 1,
       "width": 429,
     }
@@ -219,14 +219,14 @@ exports[`DefaultCellRenderer returns a react component for Samsung TVs 1`] = `
     skipButtons={false}
     store={null}
     style={
-      Object {
+      {
         "aspectRatio": 0.880733945,
         "flex": 1,
         "padding": 10,
       }
     }
     wrapperRef={
-      Object {
+      {
         "current": null,
       }
     }
@@ -237,7 +237,7 @@ exports[`DefaultCellRenderer returns a react component for Samsung TVs 1`] = `
       skipButtons={false}
       store={null}
       style={
-        Object {
+        {
           "backgroundColor": "rgba(47,47,47,1.0)",
           "borderRadius": 4,
           "flex": 1,
@@ -245,7 +245,7 @@ exports[`DefaultCellRenderer returns a react component for Samsung TVs 1`] = `
         }
       }
       wrapperRef={
-        Object {
+        {
           "current": null,
         }
       }
@@ -256,7 +256,7 @@ exports[`DefaultCellRenderer returns a react component for Samsung TVs 1`] = `
         skipButtons={false}
         store={null}
         wrapperRef={
-          Object {
+          {
             "current": null,
           }
         }
@@ -266,7 +266,7 @@ exports[`DefaultCellRenderer returns a react component for Samsung TVs 1`] = `
           key="0"
           skipButtons={false}
           style={
-            Object {
+            {
               "aspectRatio": 1.7782608696,
               "backgroundColor": "rgba(47,47,47,1.0)",
             }
@@ -278,7 +278,7 @@ exports[`DefaultCellRenderer returns a react component for Samsung TVs 1`] = `
           skipButtons={false}
           store={null}
           wrapperRef={
-            Object {
+            {
               "current": null,
             }
           }
@@ -289,7 +289,7 @@ exports[`DefaultCellRenderer returns a react component for Samsung TVs 1`] = `
             numberOfLines={2}
             skipButtons={false}
             style={
-              Object {
+              {
                 "color": "rgba(239,239,239,1.0)",
                 "fontSize": 26,
                 "fontWeight": "700",
@@ -306,13 +306,13 @@ exports[`DefaultCellRenderer returns a react component for Samsung TVs 1`] = `
           skipButtons={false}
           store={null}
           style={
-            Object {
+            {
               "paddingHorizontal": "6%",
               "paddingTop": "3%",
             }
           }
           wrapperRef={
-            Object {
+            {
               "current": null,
             }
           }
@@ -323,7 +323,7 @@ exports[`DefaultCellRenderer returns a react component for Samsung TVs 1`] = `
             numberOfLines={1}
             skipButtons={false}
             style={
-              Object {
+              {
                 "color": "rgba(239,239,239,1.0)",
                 "fontSize": 24,
                 "fontWeight": "400",

package/Contexts/ConfigutaionContext/__tests__/__snapshots__/ConfigurationProvider.test.tsx.snap

@@ -3,7 +3,7 @@
 exports[`withConfigurationProvider provides configuration to children 1`] = `
 <View
   configuration={
-    Object {
+    {
       "target": "foobar",
     }
   }

package/Contexts/ScreenContext/index.tsx

@@ -99,8 +99,9 @@ export function ScreenContextProvider({
   const isNested = useNestedNavigationContext();
   const currentScreenScreenData = useCurrentScreenData();
 
-  const screenNavBarStateRef =
-    useRef<null | ReturnType<typeof createStore>>(null);
+  const screenNavBarStateRef = useRef<null | ReturnType<typeof createStore>>(
+    null
+  );
 
   const getScreenNavBarState = useCallback(() => {
     if (screenNavBarStateRef.current !== null) {

package/Decorators/Analytics/{index.js → index.tsx}

@@ -5,18 +5,18 @@ import { usePickFromState } from "@applicaster/zapp-react-native-redux/hooks";
 
 type ComponentProps = {
   component: {
-    id: string,
-    rules: { item_limit: number, component_cells_selectable: boolean },
-    component_type: string,
+    id: string;
+    rules: { item_limit: number; component_cells_selectable: boolean };
+    component_type: string;
     styles: {
-      cell_style: string,
-      header: { visible: boolean },
-      component_cells_selectable: boolean,
-    },
-  },
-  zappPipesData: { url: string, data: { title: string } },
-  selected: boolean,
-  assets: { menu_button: string },
+      cell_style: string;
+      header: { visible: boolean };
+      component_cells_selectable: boolean;
+    };
+  };
+  zappPipesData: { url: string; data: { title: string } };
+  selected: boolean;
+  assets: { menu_button: string };
 };
 
 function withAnalytics(Component) {

package/Decorators/Navigator/__tests__/__snapshots__/navigator.test.js.snap

@@ -3,8 +3,8 @@
 exports[`withNavigator Decorator renders correctly 1`] = `
 <Component
   navigator={
-    Object {
-      "activeRiver": Object {},
+    {
+      "activeRiver": {},
       "canGoBack": [MockFunction],
       "goBack": [MockFunction],
       "isNavBarVisible": true,