@applicaster/zapp-react-native-ui-components 13.0.0-alpha.3454305619 → 13.0.0-alpha.3582972440

package/Components/AnimatedInOut/index.tsx

@@ -4,11 +4,9 @@ import { usePrevious } from "@applicaster/zapp-react-native-utils/reactHooks/uti
 import { toBooleanWithDefaultFalse } from "@applicaster/zapp-react-native-utils/booleanUtils";
 import { noop } from "@applicaster/zapp-react-native-utils/functionUtils";
 
-type AnimatedInterpolatedStyle = any;
-
-// type AnimatedInterpolatedStyle =
-//   | Animated.AnimatedInterpolation
-//   | [{ [Key: string]: Animated.AnimatedInterpolation }];
+type AnimatedInterpolatedStyle =
+  | Animated.AnimatedInterpolation
+  | [{ [Key: string]: Animated.AnimatedInterpolation }];
 
 type AnimationConfig = {
   duration: number;

package/Components/MasterCell/elementMapper.tsx

@@ -73,6 +73,7 @@ export function elementMapper(
       : {};
 
     const componentProps = {
+      key,
       style,
       skipButtons: otherProps?.skipButtons,
       emitAsyncElementRegistrate: otherProps?.emitAsyncElementRegistrate,
@@ -90,7 +91,7 @@ export function elementMapper(
     const fn = mapElementWithKey(elementMapper(components, otherProps));
 
     return (
-      <Component key={key} {...componentProps}>
+      <Component {...componentProps}>
         {focusableTypes.has(type) && elements.length > 0
           ? elements.map(fn)
           : null}

package/Components/PlayerContainer/PlayerContainer.tsx

@@ -335,9 +335,9 @@ const PlayerContainerComponent = (props: Props) => {
 
     const resumeTime = Number(item?.extensions?.resumeTime);
 
-    // TODO: This is temp hack, will be removed on next pr with player refactoring
+    // Сhecking that the player itself knows where to start playing, and there is no need to call seekTo after returning from the Сhromecast
     if (
-      !!playerManager.getActivePlayer()?.getContinueWatchingOffset === false &&
+      !playerManager.getActivePlayer()?.hasResumePosition() &&
       !isNaN(resumeTime)
     ) {
       player?.seekTo(resumeTime);

package/Components/PlayerImageBackground/index.tsx

@@ -1,4 +1,4 @@
-import React, { PropsWithChildren, useEffect, useState } from "react";
+import React, { PropsWithChildren } from "react";
 import { ImageBackground, View } from "react-native";
 
 import { imageSrcFromMediaItem } from "@applicaster/zapp-react-native-utils/configurationUtils";
@@ -12,7 +12,6 @@ import {
 type Props = PropsWithChildren<{
   entry: ZappEntry;
   style?: { [K: string]: any };
-  docked?: boolean;
   imageStyle?: { [K: string]: any };
   imageKey?: string;
   defaultImageDimensions?: { [K: string]: any };
@@ -24,7 +23,6 @@ const PlayerImageBackgroundComponent = ({
   entry,
   children,
   style,
-  docked,
   imageStyle,
   imageKey,
   defaultImageDimensions,
@@ -36,22 +34,8 @@ const PlayerImageBackgroundComponent = ({
 
   const { playerAnimationState } = useModalAnimationContext();
 
-  const [lastNonNullAnimationState, setLastNonNullAnimationState] =
-    useState(playerAnimationState);
-
-  useEffect(() => {
-    if (playerAnimationState !== null) {
-      setLastNonNullAnimationState(playerAnimationState);
-    }
-  }, [playerAnimationState]);
-
   if (!source) return <>{children}</>;
 
-  const imageBackgroundStyle =
-    lastNonNullAnimationState !== PlayerAnimationStateEnum.minimize && !docked
-      ? defaultImageDimensions
-      : imageSize;
-
   return (
     <View
       style={
@@ -61,17 +45,13 @@ const PlayerImageBackgroundComponent = ({
       }
     >
       <AnimationComponent
-        style={
-          playerAnimationState === PlayerAnimationStateEnum.maximaze
-            ? defaultImageDimensions
-            : style
-        }
+        style={style}
         animationType={ComponentAnimationType.player}
         additionalData={defaultImageDimensions}
       >
         <ImageBackground
           resizeMode="cover"
-          style={imageBackgroundStyle}
+          style={imageSize}
           imageStyle={imageStyle}
           source={source}
         >

package/Components/River/ComponentsMap/ComponentsMap.tsx

@@ -279,6 +279,7 @@ function ComponentsMapComponent(props: Props) {
             initialNumToRender={3}
             maxToRenderPerBatch={10}
             windowSize={12}
+            listKey={riverId}
             keyExtractor={keyExtractor}
             renderItem={renderRiverItem}
             data={riverComponents}

package/Components/VideoLive/animationUtils.ts

@@ -1,8 +1,8 @@
 import { Animated, Easing, EasingFunction, StyleProp } from "react-native";
 
 type AnimatedInterpolatedStyle =
-  | Animated.AnimatedInterpolation<number>
-  | [{ [Key: string]: Animated.AnimatedInterpolation<number> }];
+  | Animated.AnimatedInterpolation
+  | [{ [Key: string]: Animated.AnimatedInterpolation }];
 
 type AnimationConfig = {
   duration: number;
@@ -31,7 +31,7 @@ const interpolate = (
   animatedValue: Animated.Value,
   from: number = 0,
   to: number = 1
-): Animated.AnimatedInterpolation<number> =>
+): Animated.AnimatedInterpolation =>
   animatedValue.interpolate({
     inputRange: [0, 1],
     outputRange: [from, to],

package/Decorators/ConfigurationWrapper/withConfigurationProvider.tsx

@@ -21,13 +21,13 @@ const prepareConfiguration = (
   keys: [string]
 ) => R.compose(R.evolve(keysMap), R.pickAll(keys))(configuration);
 
-const configurationKeys = R.keys(keysMap);
-
 export function withConfigurationProvider(Component: React.ComponentType<any>) {
   return function WithConfigurationProvider(props: Props) {
     const styles = props?.screenData?.styles;
     const general = props?.screenData?.general;
 
+    const configurationKeys = React.useMemo(() => R.keys(keysMap), []);
+
     const configuration = React.useMemo(
       () => prepareConfiguration({ ...general, ...styles }, configurationKeys),
       []

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-ui-components",
-  "version": "13.0.0-alpha.3454305619",
+  "version": "13.0.0-alpha.3582972440",
   "description": "Applicaster Zapp React Native ui components for the Quick Brick App",
   "main": "index.js",
   "types": "index.d.ts",
@@ -32,10 +32,10 @@
     "redux-mock-store": "^1.5.3"
   },
   "dependencies": {
-    "@applicaster/applicaster-types": "13.0.0-alpha.3454305619",
-    "@applicaster/zapp-react-native-bridge": "13.0.0-alpha.3454305619",
-    "@applicaster/zapp-react-native-redux": "13.0.0-alpha.3454305619",
-    "@applicaster/zapp-react-native-utils": "13.0.0-alpha.3454305619",
+    "@applicaster/applicaster-types": "13.0.0-alpha.3582972440",
+    "@applicaster/zapp-react-native-bridge": "13.0.0-alpha.3582972440",
+    "@applicaster/zapp-react-native-redux": "13.0.0-alpha.3582972440",
+    "@applicaster/zapp-react-native-utils": "13.0.0-alpha.3582972440",
     "promise": "^8.3.0",
     "react-router-native": "^5.1.2",
     "url": "^0.11.0",
@@ -47,6 +47,7 @@
     "immer": "*",
     "react": "*",
     "react-native": "*",
+    "react-native-safe-area-context": "*",
     "react-native-svg": "*",
     "uglify-js": "*",
     "validate-color": "*",