@applicaster/quick-brick-player 13.0.0-rc.11 → 13.0.0-rc.111

package/package.json

@@ -1,11 +1,10 @@
 {
   "name": "@applicaster/quick-brick-player",
-  "version": "13.0.0-rc.11",
+  "version": "13.0.0-rc.111",
   "description": "Quick Brick Player",
   "main": "./src/index.ts",
   "types": "index.d.ts",
   "scripts": {
-    "test": "jest -w=2",
     "build": "echo 'skipping ts build for core packages'"
   },
   "files": [
@@ -36,12 +35,11 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/quick-brick-mobile-transport-controls": "13.0.0-rc.6",
-    "@applicaster/quick-brick-tv-transport-controls": "12.0.0-rc.112",
-    "@applicaster/zapp-react-native-tvos-app": "13.0.0-rc.11",
-    "@applicaster/zapp-react-native-ui-components": "13.0.0-rc.11",
-    "@applicaster/zapp-react-native-utils": "13.0.0-rc.11",
-    "keymirror": "^0.1.1",
+    "@applicaster/quick-brick-mobile-transport-controls": "13.0.0-rc.111",
+    "@applicaster/quick-brick-tv-transport-controls": "13.0.0-rc.56",
+    "@applicaster/zapp-react-native-tvos-app": "13.0.0-rc.111",
+    "@applicaster/zapp-react-native-ui-components": "13.0.0-rc.111",
+    "@applicaster/zapp-react-native-utils": "13.0.0-rc.111",
     "query-string": "7.1.3",
     "react-native-web-linear-gradient": "1.1.2",
     "shaka-player": "4.3.5",
@@ -51,12 +49,27 @@
     "videojs-contrib-quality-levels": "3.0.0"
   },
   "peerDependencies": {
+    "@applicaster/applicaster-types": "*",
+    "@applicaster/blur": "*",
     "@applicaster/quick-brick-xray": "*",
-    "@applicaster/react-native-color-thief": "*",
-    "@types/node": "*",
-    "@types/react-native": "0.69.6",
-    "react": "17.0.2",
-    "react-native": "0.68.6",
-    "react-native-linear-gradient": "*"
+    "@applicaster/zapp-pipes-v2-client": "*",
+    "@applicaster/zapp-react-dom-ui-components": "*",
+    "@applicaster/zapp-react-native-redux": "*",
+    "@applicaster/zapp-react-native-tvos-ui-components": "*",
+    "@babel/runtime": "*",
+    "@react-native-community/netinfo": "*",
+    "immer": "*",
+    "react": "*",
+    "react-native": "*",
+    "react-native-fs": "*",
+    "react-native-gesture-handler": "*",
+    "react-native-linear-gradient": "*",
+    "react-native-safe-area-context": "*",
+    "react-native-svg": "*",
+    "react-native-web": "*",
+    "react-native-webview": "*",
+    "uglify-js": "*",
+    "validate-color": "*",
+    "zustand": "*"
   }
 }

package/src/CellPlayer/Assets/AssetsComponent.tsx

@@ -55,6 +55,11 @@ const useMuteUnmuteListeners = (playerId, player, asset, setImageUri) =>
       return;
     }
 
+    // initial state setup - show correct mute/unmute icon based on current state
+    if (player?.playerState?.isReadyToPlay) {
+      setImageUri(player.getIsMuted() ? asset.active : asset.inactive);
+    }
+
     // active action = muted, inactive = unmuted
     return player.addListener({
       id: liveImageButtonsListenerKey,
@@ -73,10 +78,17 @@ const useMuteUnmuteListeners = (playerId, player, asset, setImageUri) =>
           setImageUri(player?.getIsMuted() ? asset.active : asset.inactive);
         },
         onPlayerClose: () => {
-          setImageUri(null);
+          if (isCurrentPlayer(playerId)) {
+            setImageUri(null);
+          }
         },
         onVideoEnd: () => {
-          setImageUri(null);
+          if (isCurrentPlayer(playerId)) {
+            setImageUri(null);
+          }
+        },
+        onPlayerResume: () => {
+          setImageUri(player?.getIsMuted() ? asset.active : asset.inactive);
         },
       },
     });
@@ -93,7 +105,7 @@ const styles = StyleSheet.create({
   },
 });
 
-export function AssetComponent(props: CellActionAssetComponentProps) {
+function AssetImage(props: CellActionAssetComponentProps) {
   const { cellUUID: playerId, asset } = props;
   const [imageUri, setImageUri] = useState<Asset>(null);
 
@@ -108,3 +120,5 @@ export function AssetComponent(props: CellActionAssetComponentProps) {
 
   return <View />;
 }
+
+export const AssetComponent = React.memo(AssetImage);

package/src/Player/AudioLayer/AudioDescription.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { Text, TextStyle, View } from "react-native";
+import { Text, TextStyle } from "react-native";
 import { platformSelect } from "@applicaster/zapp-react-native-utils/reactUtils";
 
 type AudioDescriptionProps = {
@@ -13,8 +13,6 @@ type AudioDescriptionProps = {
   value: GetValue;
 };
 
-const containerStyles = { paddingTop: 32, paddingBottom: 12 };
-
 const titleStyles = (value: GetValue, prefix: string): TextStyle => ({
   textAlign: "left",
   color: value(`${prefix}title_color`),
@@ -83,13 +81,13 @@ export const AudioDescription = (props: AudioDescriptionProps) => {
   const prefix = layoutState.docked ? "docked_player_" : "";
 
   return (
-    <View style={containerStyles}>
-      <Text style={titleStyles(value, prefix)} numberOfLines={1}>
+    <>
+      <Text style={titleStyles(value, prefix)} numberOfLines={2}>
         {title}
       </Text>
-      <Text style={summaryStyles(value, prefix)} numberOfLines={2}>
+      <Text style={summaryStyles(value, prefix)} numberOfLines={1}>
         {summary}
       </Text>
-    </View>
+    </>
   );
 };