@applicaster/zapp-react-native-ui-components 14.0.0-alpha.8387612031 → 14.0.0-alpha.8557119261

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (124) hide show
  1. package/Components/AnimatedInOut/index.tsx +5 -3
  2. package/Components/AudioPlayer/mobile/Layout.tsx +7 -4
  3. package/Components/AudioPlayer/mobile/__tests__/__snapshots__/audioPlayerMobileLayout.test.js.snap +1 -1
  4. package/Components/AudioPlayer/mobile/__tests__/audioPlayerMobileLayout.test.js +1 -1
  5. package/Components/AudioPlayer/mobile/index.tsx +7 -12
  6. package/Components/AudioPlayer/tv/Artwork.tsx +3 -2
  7. package/Components/AudioPlayer/tv/Channel.tsx +7 -7
  8. package/Components/AudioPlayer/tv/Layout.tsx +100 -93
  9. package/Components/AudioPlayer/tv/Runtime.tsx +7 -1
  10. package/Components/AudioPlayer/tv/Summary.tsx +6 -2
  11. package/Components/AudioPlayer/tv/Title.tsx +6 -2
  12. package/Components/AudioPlayer/tv/__tests__/__snapshots__/Runtime.test.js.snap +2 -2
  13. package/Components/AudioPlayer/tv/__tests__/__snapshots__/audioPlayer.test.js.snap +21 -27
  14. package/Components/AudioPlayer/tv/__tests__/__snapshots__/channel.test.js.snap +8 -17
  15. package/Components/AudioPlayer/tv/__tests__/__snapshots__/summary.test.js.snap +1 -2
  16. package/Components/AudioPlayer/tv/__tests__/__snapshots__/title.test.js.snap +1 -2
  17. package/Components/AudioPlayer/tv/__tests__/audioPlayer.test.js +4 -0
  18. package/Components/AudioPlayer/tv/helpers.tsx +10 -3
  19. package/Components/AudioPlayer/tv/index.tsx +9 -11
  20. package/Components/BaseFocusable/index.tsx +23 -12
  21. package/Components/Cell/__tests__/CellWIthFocusable.test.js +3 -2
  22. package/Components/Cell/index.js +7 -3
  23. package/Components/ComponentResolver/index.ts +1 -1
  24. package/Components/FeedLoader/FeedLoader.tsx +6 -15
  25. package/Components/FeedLoader/FeedLoaderHOC.tsx +21 -0
  26. package/Components/FeedLoader/index.js +2 -8
  27. package/Components/Focusable/Focusable.tsx +5 -3
  28. package/Components/Focusable/FocusableTvOS.tsx +3 -3
  29. package/Components/Focusable/FocusableiOS.tsx +2 -2
  30. package/Components/Focusable/__tests__/index.android.test.tsx +3 -0
  31. package/Components/Focusable/index.android.tsx +12 -8
  32. package/Components/Focusable/index.tsx +1 -1
  33. package/Components/FocusableList/index.tsx +4 -0
  34. package/Components/FreezeWithCallback/__tests__/index.test.tsx +67 -43
  35. package/Components/GeneralContentScreen/utils/__tests__/useCurationAPI.test.js +42 -59
  36. package/Components/GeneralContentScreen/utils/useCurationAPI.ts +13 -10
  37. package/Components/HandlePlayable/HandlePlayable.tsx +25 -9
  38. package/Components/Layout/TV/LayoutBackground.tsx +1 -1
  39. package/Components/Layout/TV/__tests__/index.test.tsx +0 -1
  40. package/Components/MasterCell/DefaultComponents/ActionButton.tsx +2 -0
  41. package/Components/MasterCell/DefaultComponents/Button.tsx +1 -1
  42. package/Components/MasterCell/DefaultComponents/FocusableView/index.tsx +4 -27
  43. package/Components/MasterCell/DefaultComponents/Image/hoc/withDimensions.tsx +1 -1
  44. package/Components/MasterCell/DefaultComponents/ImageContainer/index.tsx +1 -1
  45. package/Components/MasterCell/DefaultComponents/__tests__/image.test.js +10 -10
  46. package/Components/MasterCell/DefaultComponents/__tests__/text.test.tsx +18 -18
  47. package/Components/MasterCell/SharedUI/CollapsibleTextContainer/__tests__/index.test.tsx +10 -10
  48. package/Components/MasterCell/elementMapper.tsx +1 -2
  49. package/Components/MasterCell/index.tsx +1 -1
  50. package/Components/MasterCell/utils/behaviorProvider.ts +82 -14
  51. package/Components/MasterCell/utils/index.ts +11 -5
  52. package/Components/OfflineHandler/NotificationView/__tests__/index.test.tsx +13 -18
  53. package/Components/OfflineHandler/__tests__/__snapshots__/index.test.tsx.snap +9 -0
  54. package/Components/OfflineHandler/__tests__/index.test.tsx +26 -35
  55. package/Components/PlayerContainer/ErrorDisplay/index.ts +1 -1
  56. package/Components/PlayerContainer/PlayerContainer.tsx +41 -28
  57. package/Components/PlayerContainer/ProgramInfo/index.tsx +1 -1
  58. package/Components/PlayerContainer/index.ts +1 -1
  59. package/Components/River/ComponentsMap/ComponentsMap.tsx +0 -1
  60. package/Components/River/ComponentsMap/hooks/__tests__/useLoadingState.test.ts +378 -0
  61. package/Components/River/ComponentsMap/hooks/useLoadingState.ts +2 -2
  62. package/Components/River/RefreshControl.tsx +11 -17
  63. package/Components/River/TV/River.tsx +2 -17
  64. package/Components/River/TV/index.tsx +3 -1
  65. package/Components/River/TV/withPipesV1DataLoader.tsx +43 -0
  66. package/Components/River/TV/withRiverDataLoader.tsx +17 -0
  67. package/Components/River/TV/withTVEventHandler.tsx +1 -1
  68. package/Components/River/__tests__/__snapshots__/componentsMap.test.js.snap +2 -0
  69. package/Components/River/__tests__/river.test.js +12 -26
  70. package/Components/River/index.tsx +1 -1
  71. package/Components/Screen/__tests__/Screen.test.tsx +28 -29
  72. package/Components/ScreenRevealManager/ScreenRevealManager.ts +76 -0
  73. package/Components/ScreenRevealManager/__tests__/ScreenRevealManager.test.ts +107 -0
  74. package/Components/ScreenRevealManager/__tests__/withScreenRevealManager.test.tsx +96 -0
  75. package/Components/ScreenRevealManager/index.ts +1 -0
  76. package/Components/ScreenRevealManager/withScreenRevealManager.tsx +79 -0
  77. package/Components/Tabs/TV/Tabs.android.tsx +0 -2
  78. package/Components/Tabs/Tabs.tsx +2 -3
  79. package/Components/Touchable/__tests__/__snapshots__/touchable.test.tsx.snap +34 -0
  80. package/Components/Touchable/__tests__/touchable.test.tsx +12 -17
  81. package/Components/Transitioner/__tests__/__snapshots__/Scene.test.js.snap +15 -9
  82. package/Components/VideoLive/animationUtils.ts +3 -3
  83. package/Components/VideoModal/ModalAnimation/AnimatedScrollModal.tsx +3 -9
  84. package/Components/VideoModal/ModalAnimation/ModalAnimationContext.tsx +32 -8
  85. package/Components/VideoModal/PlayerDetails.tsx +24 -2
  86. package/Components/VideoModal/PlayerWrapper.tsx +26 -142
  87. package/Components/VideoModal/VideoModal.tsx +3 -17
  88. package/Components/VideoModal/__tests__/PlayerDetails.test.tsx +5 -5
  89. package/Components/VideoModal/__tests__/PlayerWrapper.test.tsx +1 -7
  90. package/Components/VideoModal/__tests__/__snapshots__/PlayerWrapper.test.tsx.snap +44 -240
  91. package/Components/VideoModal/hooks/index.ts +0 -2
  92. package/Components/VideoModal/hooks/useModalSize.ts +18 -2
  93. package/Components/VideoModal/utils.ts +6 -0
  94. package/Components/Viewport/ViewportAware/__tests__/viewportAware.test.js +12 -16
  95. package/Components/Viewport/ViewportTracker/__tests__/viewportTracker.test.js +84 -24
  96. package/Components/Viewport/VisibilitySensor/VisibilitySensor.tsx +3 -3
  97. package/Components/default-cell-renderer/viewTrees/tv/DefaultCell/index.ts +3 -3
  98. package/Contexts/ConfigutaionContext/__tests__/ConfigurationProvider.test.tsx +3 -3
  99. package/Contexts/ScreenContext/index.tsx +46 -6
  100. package/Decorators/ConfigurationWrapper/__tests__/withConfigurationProvider.test.tsx +3 -3
  101. package/Decorators/ConfigurationWrapper/withConfigurationProvider.tsx +2 -2
  102. package/Decorators/RiverFeedLoader/__tests__/__snapshots__/riverFeedLoader.test.tsx.snap +221 -209
  103. package/Decorators/RiverFeedLoader/__tests__/riverFeedLoader.test.tsx +14 -16
  104. package/Decorators/RiverFeedLoader/__tests__/utils.test.ts +0 -20
  105. package/Decorators/RiverFeedLoader/index.tsx +22 -4
  106. package/Decorators/RiverFeedLoader/utils/index.ts +0 -18
  107. package/Decorators/RiverResolver/__tests__/riverResolver.test.tsx +3 -6
  108. package/Decorators/ZappPipesDataConnector/ResolverSelector.tsx +25 -0
  109. package/Decorators/ZappPipesDataConnector/__tests__/NullFeedResolver.test.tsx +78 -0
  110. package/Decorators/ZappPipesDataConnector/__tests__/ResolverSelector.test.tsx +205 -0
  111. package/Decorators/ZappPipesDataConnector/__tests__/StaticFeedResolver.test.tsx +251 -0
  112. package/Decorators/ZappPipesDataConnector/__tests__/UrlFeedResolver.test.tsx +368 -0
  113. package/Decorators/ZappPipesDataConnector/__tests__/utils.test.ts +39 -0
  114. package/Decorators/ZappPipesDataConnector/index.tsx +26 -293
  115. package/Decorators/ZappPipesDataConnector/resolvers/NullFeedResolver.tsx +25 -0
  116. package/Decorators/ZappPipesDataConnector/resolvers/StaticFeedResolver.tsx +87 -0
  117. package/Decorators/ZappPipesDataConnector/resolvers/UrlFeedResolver.tsx +266 -0
  118. package/Decorators/ZappPipesDataConnector/types.ts +29 -0
  119. package/Decorators/ZappPipesDataConnector/utils/mongoFilter.ts +738 -0
  120. package/Decorators/ZappPipesDataConnector/utils/useFilter.tsx +157 -0
  121. package/events/index.ts +1 -0
  122. package/package.json +5 -10
  123. package/Components/River/__tests__/__snapshots__/river.test.js.snap +0 -27
  124. package/Components/VideoModal/hooks/useBackgroundColor.ts +0 -10
@@ -4,9 +4,11 @@ import { usePrevious } from "@applicaster/zapp-react-native-utils/reactHooks/uti
4
4
  import { toBooleanWithDefaultFalse } from "@applicaster/zapp-react-native-utils/booleanUtils";
5
5
  import { noop } from "@applicaster/zapp-react-native-utils/functionUtils";
6
6
 
7
- type AnimatedInterpolatedStyle =
8
- | Animated.AnimatedInterpolation
9
- | [{ [Key: string]: Animated.AnimatedInterpolation }];
7
+ type AnimatedInterpolatedStyle = any;
8
+
9
+ // type AnimatedInterpolatedStyle =
10
+ // | Animated.AnimatedInterpolation
11
+ // | [{ [Key: string]: Animated.AnimatedInterpolation }];
10
12
 
11
13
  type AnimationConfig = {
12
14
  duration: number;
@@ -17,14 +17,17 @@ const styles = StyleSheet.create({
17
17
  });
18
18
 
19
19
  type Props = {
20
- backgroundImage: string;
20
+ backgroundImageSource: { uri: string };
21
21
  style: ViewStyle;
22
22
  };
23
23
 
24
- export function AudioPlayerMobileLayout({ backgroundImage, style }: Props) {
24
+ export function AudioPlayerMobileLayout({
25
+ backgroundImageSource,
26
+ style,
27
+ }: Props) {
25
28
  const fadeAnimation = useRef(new Animated.Value(0)).current;
26
29
 
27
- const mainContainerStyles = platformSelect({
30
+ const mainContainerStyles: ViewStyle = platformSelect({
28
31
  native: {
29
32
  backgroundColor: "transparent",
30
33
  overflow: "hidden",
@@ -51,7 +54,7 @@ export function AudioPlayerMobileLayout({ backgroundImage, style }: Props) {
51
54
  ]}
52
55
  >
53
56
  <ImageBackground
54
- source={{ uri: backgroundImage }}
57
+ source={backgroundImageSource}
55
58
  style={styles.flex}
56
59
  resizeMode="cover"
57
60
  >
@@ -32,7 +32,7 @@ exports[`<AudioPlayerMobileLayout /> renders correctly 1`] = `
32
32
  resizeMode="cover"
33
33
  source={
34
34
  {
35
- "uri": undefined,
35
+ "uri": "background_image_url",
36
36
  }
37
37
  }
38
38
  style={
@@ -4,7 +4,7 @@ import { render } from "@testing-library/react-native";
4
4
  import { AudioPlayerMobileLayout } from "../Layout";
5
5
 
6
6
  const audioPlayerLayoutProps = {
7
- backgroundColor: "black",
7
+ backgroundImageSource: { uri: "background_image_url" },
8
8
  };
9
9
 
10
10
  describe("<AudioPlayerMobileLayout />", () => {
@@ -1,23 +1,18 @@
1
1
  import * as React from "react";
2
- import { getBackgroundImage } from "@applicaster/zapp-react-native-utils/audioPlayerUtils";
2
+ import { useBackgroundImage } from "@applicaster/zapp-react-native-utils/audioPlayerUtils";
3
3
 
4
4
  import { AudioPlayerMobileLayout } from "./Layout";
5
-
6
5
  import { Props } from "../types";
7
6
 
8
7
  export function AudioPlayerMobile(props: Props) {
9
- const { audio_item, plugin_configuration, style = {} } = props;
8
+ const { audio_item, style = {} } = props;
10
9
 
11
- const backgroundImage = React.useMemo(
12
- () =>
13
- getBackgroundImage({
14
- entry: audio_item,
15
- plugin_configuration,
16
- }),
17
- [audio_item, plugin_configuration]
18
- );
10
+ const backgroundImageSource = useBackgroundImage(audio_item);
19
11
 
20
12
  return (
21
- <AudioPlayerMobileLayout backgroundImage={backgroundImage} style={style} />
13
+ <AudioPlayerMobileLayout
14
+ backgroundImageSource={backgroundImageSource}
15
+ style={style}
16
+ />
22
17
  );
23
18
  }
@@ -1,5 +1,6 @@
1
1
  import React from "react";
2
- import { View, Image, StyleSheet } from "react-native";
2
+ import { View, StyleSheet } from "react-native";
3
+ import { QBImage } from "@applicaster/zapp-react-native-ui-components/Components/Image";
3
4
  import { toNumberWithDefaultZero } from "@applicaster/zapp-react-native-utils/numberUtils";
4
5
 
5
6
  const styles = StyleSheet.create({
@@ -29,7 +30,7 @@ export function Artwork({ srcImage, config }: Props) {
29
30
 
30
31
  return (
31
32
  <View style={styles.container}>
32
- <Image
33
+ <QBImage
33
34
  fadeDuration={0}
34
35
  source={{ uri: srcImage }}
35
36
  style={[styles.image, { borderRadius }]}
@@ -1,5 +1,6 @@
1
1
  import React from "react";
2
- import { View, Image } from "react-native";
2
+ import { Image } from "react-native";
3
+ import { isNilOrEmpty } from "@applicaster/zapp-react-native-utils/reactUtils/helpers";
3
4
 
4
5
  type Props = {
5
6
  srcImage: string;
@@ -15,17 +16,16 @@ type Props = {
15
16
  const imageStyles = {
16
17
  width: 128,
17
18
  height: 72,
18
- };
19
19
 
20
- const containerStyles = {
21
- ...imageStyles,
22
20
  marginBottom: 30,
23
21
  };
24
22
 
25
23
  export function Channel({ srcImage }: Props) {
24
+ if (isNilOrEmpty(srcImage)) {
25
+ return null;
26
+ }
27
+
26
28
  return (
27
- <View style={containerStyles}>
28
- <Image fadeDuration={0} source={{ uri: srcImage }} style={imageStyles} />
29
- </View>
29
+ <Image fadeDuration={0} source={{ uri: srcImage }} style={imageStyles} />
30
30
  );
31
31
  }
@@ -1,5 +1,5 @@
1
1
  import * as React from "react";
2
- import { View, ImageBackground, ViewStyle } from "react-native";
2
+ import { ImageBackground, View, ViewStyle } from "react-native";
3
3
 
4
4
  import { platformSelect } from "@applicaster/zapp-react-native-utils/reactUtils";
5
5
 
@@ -11,6 +11,7 @@ type Props = {
11
11
  config: {
12
12
  titleColor: string;
13
13
  summaryColor: string;
14
+ backgroundImageOverlay?: string;
14
15
  backgroundColor: string;
15
16
  backgroundImage: Option<string>;
16
17
  isRTL: boolean;
@@ -20,13 +21,40 @@ type Props = {
20
21
  style: ViewStyle;
21
22
  };
22
23
 
24
+ const backgroundImgStyles = platformSelect({
25
+ tvos: {
26
+ width: "100%",
27
+ height: "100%",
28
+ alignItems: "center",
29
+ justifyContent: "center",
30
+ },
31
+ android_tv: {
32
+ width: "100%",
33
+ height: "100%",
34
+ alignItems: "center",
35
+ justifyContent: "center",
36
+ },
37
+ web: {
38
+ position: "absolute",
39
+ margin: "auto",
40
+ display: "flex",
41
+ flexWrap: "wrap",
42
+ width: "100%",
43
+ height: "100%",
44
+ flex: 1,
45
+ alignItems: "center",
46
+ justifyContent: "center",
47
+ },
48
+ });
49
+
23
50
  export function AudioPlayerTVLayout({
24
51
  artwork,
25
52
  config,
26
53
  children,
27
54
  style,
28
55
  }: Props) {
29
- const { isRTL, backgroundColor, backgroundImage } = config;
56
+ const { backgroundColor, backgroundImage, backgroundImageOverlay, isRTL } =
57
+ config;
30
58
 
31
59
  const backgroundImageSource = { uri: backgroundImage };
32
60
 
@@ -34,108 +62,87 @@ export function AudioPlayerTVLayout({
34
62
  ? "transparent"
35
63
  : backgroundColor;
36
64
 
37
- const mainContainerStyles = platformSelect({
65
+ const textContainerStyles = platformSelect({
38
66
  tvos: {
39
- width: "100%",
40
- height: "100%",
41
- alignItems: "center",
42
67
  justifyContent: "center",
43
- flexDirection: directionStyles(isRTL).flexDirection,
44
- backgroundColor: backgroundColorStyle,
68
+ alignItems: directionStyles(isRTL).justifyContent,
45
69
  },
46
70
  android_tv: {
47
- width: "100%",
48
- height: "100%",
49
- alignItems: "center",
50
71
  justifyContent: "center",
51
- flexDirection: directionStyles(isRTL).flexDirection,
52
- backgroundColor: backgroundColorStyle,
72
+ alignItems: directionStyles(isRTL).justifyContent,
53
73
  },
54
74
  web: {
55
- width: 1920,
56
- height: 1080,
57
- alignItems: "center",
58
- justifyContent: "center",
59
- flexDirection: directionStyles(isRTL).flexDirection,
60
- backgroundColor: backgroundColorStyle,
61
- },
62
- native: {
63
- backgroundColor: backgroundColorStyle,
64
- overflow: "hidden",
65
- ...style,
66
- },
67
- samsung_tv: {
68
- position: "absolute",
69
- margin: "auto",
70
- display: "flex",
71
- flexWrap: "wrap",
72
- width: "100vw",
73
- flex: 1,
74
- alignItems: "center",
75
- justifyContent: "center",
76
- flexDirection: directionStyles(isRTL).flexDirection,
77
- backgroundColor: backgroundColorStyle,
78
- },
79
- lg_tv: {
80
- position: "absolute",
81
- margin: "auto",
82
- display: "flex",
83
- flexWrap: "wrap",
84
- width: "100vw",
85
- flex: 1,
86
- alignItems: "center",
87
75
  justifyContent: "center",
88
- flexDirection: directionStyles(isRTL).flexDirection,
89
- backgroundColor: backgroundColorStyle,
76
+ alignItems: directionStyles(isRTL).justifyContent,
90
77
  },
91
78
  });
92
79
 
93
- const backgroundImgStyles = platformSelect({
94
- tvos: {
95
- width: "100%",
96
- height: "100%",
97
- alignItems: "center",
98
- justifyContent: "center",
99
- },
100
- android_tv: {
101
- width: "100%",
102
- height: "100%",
103
- alignItems: "center",
104
- justifyContent: "center",
105
- },
106
- web: {
107
- position: "absolute",
108
- margin: "auto",
109
- display: "flex",
110
- flexWrap: "wrap",
111
- width: "100%",
112
- height: "100%",
113
- flex: 1,
114
- alignItems: "center",
115
- justifyContent: "center",
116
- },
117
- });
80
+ const mainContainerStyles = React.useMemo(
81
+ () =>
82
+ platformSelect({
83
+ tvos: {
84
+ width: "100%",
85
+ height: "100%",
86
+ alignItems: "center",
87
+ justifyContent: "center",
88
+ flexDirection: directionStyles(isRTL).flexDirection,
89
+ backgroundColor: backgroundColorStyle,
90
+ },
91
+ android_tv: {
92
+ width: "100%",
93
+ height: "100%",
94
+ alignItems: "center",
95
+ justifyContent: "center",
96
+ flexDirection: directionStyles(isRTL).flexDirection,
97
+ backgroundColor: backgroundColorStyle,
98
+ },
99
+ web: {
100
+ width: 1920,
101
+ height: 1080,
102
+ alignItems: "center",
103
+ justifyContent: "center",
104
+ flexDirection: directionStyles(isRTL).flexDirection,
105
+ backgroundColor: backgroundColorStyle,
106
+ },
107
+ native: {
108
+ backgroundColor: backgroundColorStyle,
109
+ overflow: "hidden",
110
+ ...style,
111
+ },
112
+ samsung_tv: {
113
+ position: "absolute",
114
+ margin: "auto",
115
+ display: "flex",
116
+ flexWrap: "wrap",
117
+ height: "100vh",
118
+ width: "100vw",
119
+ alignItems: "center",
120
+ justifyContent: "center",
121
+ flexDirection: directionStyles(isRTL).flexDirection,
122
+ backgroundColor: backgroundColorStyle,
123
+ },
124
+ lg_tv: {
125
+ position: "absolute",
126
+ margin: "auto",
127
+ display: "flex",
128
+ flexWrap: "wrap",
129
+ height: "100vh",
130
+ width: "100vw",
131
+ alignItems: "center",
132
+ justifyContent: "center",
133
+ flexDirection: directionStyles(isRTL).flexDirection,
134
+ backgroundColor: backgroundColorStyle,
135
+ },
136
+ }),
137
+ [backgroundColorStyle, isRTL, style]
138
+ );
118
139
 
119
- const textContainerStyles = platformSelect({
120
- tvos: {
121
- width: 600,
122
- height: 362,
123
- marginHorizontal: 24,
124
- alignItems: directionStyles(isRTL).justifyContent,
125
- },
126
- android_tv: {
127
- width: 600,
128
- height: 362,
129
- marginHorizontal: 24,
130
- alignItems: directionStyles(isRTL).justifyContent,
131
- },
132
- web: {
133
- margin: 10,
134
- height: "100vh",
135
- alignItems: directionStyles(isRTL).justifyContent,
136
- justifyContent: "center",
137
- },
138
- });
140
+ const backgroundOverlayStyles = React.useMemo(
141
+ () => ({
142
+ backgroundColor: backgroundImageOverlay,
143
+ }),
144
+ [backgroundImageOverlay]
145
+ );
139
146
 
140
147
  if (backgroundImage) {
141
148
  return (
@@ -144,7 +151,7 @@ export function AudioPlayerTVLayout({
144
151
  style={backgroundImgStyles}
145
152
  resizeMode="cover"
146
153
  >
147
- <View style={mainContainerStyles}>
154
+ <View style={[mainContainerStyles, backgroundOverlayStyles]}>
148
155
  <Artwork srcImage={artwork} config={config} />
149
156
  <View style={textContainerStyles}>{children}</View>
150
157
  </View>
@@ -1,6 +1,8 @@
1
1
  import React from "react";
2
2
  import { View, Text, ViewStyle, TextStyle } from "react-native";
3
3
  import { toNumberWithDefault } from "@applicaster/zapp-react-native-utils/numberUtils";
4
+ import { isNilOrEmpty } from "@applicaster/zapp-react-native-utils/reactUtils/helpers";
5
+
4
6
  import { directionStyles } from "./helpers";
5
7
 
6
8
  type Props = {
@@ -19,7 +21,6 @@ type Props = {
19
21
 
20
22
  const containerStyles = ({ isRTL }) => ({
21
23
  width: 600,
22
- height: 40,
23
24
  justifyContent: directionStyles(isRTL)
24
25
  .justifyContent as ViewStyle["justifyContent"],
25
26
  });
@@ -38,11 +39,16 @@ const textStyles = ({
38
39
  });
39
40
 
40
41
  export function Runtime({ start_time, end_time, config }: Props) {
42
+ if (isNilOrEmpty(start_time) && isNilOrEmpty(end_time)) {
43
+ return null;
44
+ }
45
+
41
46
  return (
42
47
  <View style={containerStyles({ isRTL: config.isRTL })}>
43
48
  {!!start_time && !!end_time && (
44
49
  <Text
45
50
  style={textStyles(config) as TextStyle}
51
+ numberOfLines={1}
46
52
  >{`${start_time} - ${end_time}`}</Text>
47
53
  )}
48
54
  </View>
@@ -1,6 +1,7 @@
1
1
  import React from "react";
2
2
  import { View, Text, TextStyle, StyleSheet } from "react-native";
3
3
  import { toNumberWithDefault } from "@applicaster/zapp-react-native-utils/numberUtils";
4
+ import { isNilOrEmpty } from "@applicaster/zapp-react-native-utils/reactUtils/helpers";
4
5
 
5
6
  type Props = {
6
7
  config: {
@@ -18,7 +19,6 @@ type Props = {
18
19
  const styles = StyleSheet.create({
19
20
  container: {
20
21
  width: 600,
21
- height: 80,
22
22
  marginBottom: 30,
23
23
  },
24
24
  });
@@ -38,9 +38,13 @@ const textStyles = ({
38
38
  });
39
39
 
40
40
  export function Summary({ summary, config }: Props) {
41
+ if (isNilOrEmpty(summary)) {
42
+ return null;
43
+ }
44
+
41
45
  return (
42
46
  <View style={styles.container}>
43
- <Text style={textStyles(config)} numberOfLines={2}>
47
+ <Text style={textStyles(config)} numberOfLines={3}>
44
48
  {summary}
45
49
  </Text>
46
50
  </View>
@@ -1,6 +1,7 @@
1
1
  import React from "react";
2
2
  import { View, Text, TextStyle, StyleSheet } from "react-native";
3
3
  import { toNumberWithDefault } from "@applicaster/zapp-react-native-utils/numberUtils";
4
+ import { isNilOrEmpty } from "@applicaster/zapp-react-native-utils/reactUtils/helpers";
4
5
 
5
6
  type Props = {
6
7
  config: {
@@ -18,7 +19,6 @@ type Props = {
18
19
  const styles = StyleSheet.create({
19
20
  container: {
20
21
  width: 600,
21
- height: 100,
22
22
  marginBottom: 12,
23
23
  },
24
24
  });
@@ -32,9 +32,13 @@ const textStyles = ({ titleColor, isRTL, titleFontFamily, titleFontSize }) => ({
32
32
  });
33
33
 
34
34
  export function Title({ title, config }: Props) {
35
+ if (isNilOrEmpty(title)) {
36
+ return null;
37
+ }
38
+
35
39
  return (
36
40
  <View style={styles.container}>
37
- <Text style={textStyles(config)} numberOfLines={2}>
41
+ <Text style={textStyles(config)} numberOfLines={3}>
38
42
  {title}
39
43
  </Text>
40
44
  </View>
@@ -4,13 +4,13 @@ exports[`<Runtime /> LTR renders correctly 1`] = `
4
4
  <View
5
5
  style={
6
6
  {
7
- "height": 40,
8
7
  "justifyContent": "flex-start",
9
8
  "width": 600,
10
9
  }
11
10
  }
12
11
  >
13
12
  <Text
13
+ numberOfLines={1}
14
14
  style={
15
15
  {
16
16
  "alignItems": "flex-end",
@@ -33,13 +33,13 @@ exports[`<Runtime /> RTL renders correctly 1`] = `
33
33
  <View
34
34
  style={
35
35
  {
36
- "height": 40,
37
36
  "justifyContent": "flex-end",
38
37
  "width": 600,
39
38
  }
40
39
  }
41
40
  >
42
41
  <Text
42
+ numberOfLines={1}
43
43
  style={
44
44
  {
45
45
  "alignItems": "flex-start",
@@ -30,10 +30,15 @@ exports[`<AudioPlayerTV /> renders correctly 1`] = `
30
30
  />
31
31
  <View
32
32
  style={
33
- {
34
- "backgroundColor": "transparent",
35
- "overflow": "hidden",
36
- }
33
+ [
34
+ {
35
+ "backgroundColor": "transparent",
36
+ "overflow": "hidden",
37
+ },
38
+ {
39
+ "backgroundColor": undefined,
40
+ },
41
+ ]
37
42
  }
38
43
  >
39
44
  <View
@@ -48,7 +53,7 @@ exports[`<AudioPlayerTV /> renders correctly 1`] = `
48
53
  resizeMode="cover"
49
54
  source={
50
55
  {
51
- "uri": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABwgAAAP0CAYAAAC+jGj3AAAxj0lEQVR4AezdIWyd59nH4af9piKXbKAOGXJQpShGJTYacXisSUOxIo1FQZNmBWyaFCXSVBCltHLQpMpGIzYasVFJjUpiVJKgEhuN9Nv9tk7bKI59nnOOfY7/1yW9Ou2aej7PW/bTfT8f3Lp164cGAAAAAAAARPiwAQAAAAAAADEEQgAAAAAAAAgiEAIAAAAAAEAQgRAAAAAAAACCCIQAAAAAAAAQRCAEAAAAAACAIAIhAAAAAAAABBEIAQAAAAAAIIhACAAAAAAAAEEEQgAAAAAAAAgiEAIAAAAAAEAQgRAAAAAAAACCCIQAAAAAAAAQRCAEAAAAAACAIAIhAAAAAAAABBEIAQAAAAAAIIhACAAAAAAAAEEEQgAAAAAAAAgiEAIAAAAAAEAQgRAAAAAAAACCCIQAAAAAAAAQRCAEAAAAAACAIAIhAAAAAAAABBEIAQAAAAAAIIhACAAAAAAAAEEEQgAAAAAAAAgiEAIAAAAAAEAQgRAAAAAAAACCCIQAAAAAAAAQRCAEAAAAAACAIAIhAAAAAAAABBEIAQAAAAAAIIhACAAAAAAAAEEEQgAAAAAAAAgiEAIAAAAAAEAQgRAAAAAAAACCCIQAAAAAAAAQRCAEAAAAAACAIAIhAAAAAAAABBEIAQAAAAAAIIhACAAAAAAAAEEEQgAAAAAAAAgiEAIAAAAAAEAQgRAAAAAAAACCCIQAAAAAAAAQRCAEAAAAAACAIAIhAAAAAAAABBEIAQAAAAAAIIhACAAAAAAAAEEEQgAAAAAAAAgiEAIAAAAAAEAQgRAAAAAAAACCCIQAAAAAAAAQRCAEAAAAAACAIAIhAAAAAAAABBEIAQAAAAAAIIhACAAAAAAAAEEEQgAAAAAAAAgiEAIAAAAAAEAQgRAAAAAAAACCCIQAAAAAAAAQRCAEAAAAAACAIAIhAAAAAAAABBEIAQAAAAAAIIhACAAAAAAAAEEEQgAAAAAAAAgiEAIAAAAAAEAQgRAAAAAAAACCCIQAAAAAAAAQRCAEAAAAAACAIAIhAAAAAAAABBEIAQAAAAAAIIhACAAAAAAAAEEEQgAAAAAAAAgiEAIAAAAAAEAQgRAAAAAAAACCCIQAADQAAAAAcgiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAA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Odi7UrXWiT59+nTkVaqn72ReVrACAADMAoEQAADggmqt6DjTao8ePeoOWbW6c9bV/YA96kxrZWiv07WkAAAAXIxACAAAcAE1/TfOmtBScXB7e7v16I1vl6l3enDc8FoODg66JzQBAADSCIQAAAAX0Bv23lb35vVMEdb6zll38+bNNqoKg+OG11MVGgEAADifQAgAAHCOCno1oTapn1X37Y2qJ75dtp6I+fLlyzYpR0dH7iIEAAC4AIEQAADgHBWervrnLSwstFnXEwgnuRa04uC4q0oBAAASCIQAAADnOD4+bpPUM+U2D4Gwx6Qn/iY5kQgAAHBdCYQAAADnsLYSAACA60QgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAACc48aNG22SFhYWGtMx6XcFAABwHQmEAABAlJOTkzaqpaWlNkmLi4ttVK9fv26zrud3nPTZ9vy8nv8mAAAA5plACAAAROmJWDXxd/v27TYpq6urbVTzEAh7QlvPWZyl4mDPdOY8nC0AAMAkCYQAAECU3hg0qUBYP6dngvD4+LjNupcvX7ZR1VlM6mzX19dbj6OjowYAAJBEIAQAAKIcHh62HhWfesLe2x48eNB69P7el6k3tG1sbLRx1btZW1trPQRCAAAgjUAIAABEqTWYvWtGHz9+3MZRIaz3zr15CIS9v2NNEI4bCXvfTcVBdxACAABpBEIAACDO/v5+61Fxb3Nzs/W4c+dOu3fvXutRQXMeptzGiW11Nnfv3m096p30htdvvvmmAQAApBEIAQCAOAcHB61XrbH88ssvL7xutCYPa63oX//619arN2hehe3t7darzmmUScJ6B/UueleLlr29vQYAAJDmg1u3bv3QAAAAwjx79mxYbTmOiksVxN413VdhsO4trHg17t2Ff/zjH7vWol6F+q5fffVVG0d9162trWFl6bu+d7231dXV4WzrnHvVe7t//34DAABIIxACAACRKjJVJJyEWqtZsaliVgWrWnc5bhQ8tbu7254+fdrmySTi66nTtaV1tnWmdbbjRMFfevLkiQlCAAAgkkAIAADEmmTImpZ5mh48VRGvVn/OsjrTOlsAAIBE7iAEAABi1RrLWVbrS+ctDpaa+hvnLsLL8OjRowYAAJBKIAQAAGLVHXezGrIqDL548aLNq/rdZzVunnVvJAAAQAqBEAAAiDarIasm3OruvXlVv3vd8Tdr5j28AgAATIJACAAARKuQ9fDhw5mKhM+fP78WE241oVnfZVbUO653Pc/hFQAAYBL+75NPPvl7AwAACFbBqGLWH/7wh/bRRx+1q1T3Iv7rX/9q18W33347fC4vL7erVO/4L3/5S/vuu+8aAABAOoEQAADgf77//vv29ddft88++6wtLCy0q1Bx8Dquv6z4Wq4qEtbkYMVB9w4CAAD8SCAEAAD4SUXCg4ODtrq6eqmRsKbbPv/887azs9Ouq4qE9T0//fTTS53SPF0ranIQAADgZx/cunXrhwYAAMAbFQfv3bvX1tfX27TVVNujR49m6g7EaVpcXGzPnj0bPqdte3t7mMh05yAAAMCvCYQAAABnWFpaao8fP55KzKpoVStFr/PU4PvcvXt3CLDTONuaVqyzPV1tCgAAwK8JhAAAAOdYW1sbYlYFw3FVGKzJtgqD6ZNtFQfrbO/cuTORUCgMAgAAXIxACAAAcEEVCCtoLS8vjxQLKwTW3Ya7u7vi1RlWVlaGZ9T7H2s16/7+/nC+zhYAAOBiBEIAAIAOFbEqEtZT028ff/zxr/75q1evhnhV0SrlfsFJOT3T+rxx48av/tnx8fFwnqdn635BAACA0QmEAAAAAAAAEOTDBgAAAAAAAMQQCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAAAAAAAAggiEAAAAAAAAEEQgBAAAAAAAgCACIQAAAAAAAAQRCAEAAAAAACCIQAgAAAAAAABBBEIAAAAAAAAIIhACAAAAAABAEIEQAADg/9uzAwEAAAAAQf7Wg1waAQAAwIggBAAAAAAAgBFBCAAAAAAAACOCEAAAAAAAAEYEIQAAAAAAAIwIQgAAAAAAABgRhAAAAAAAADAiCAEAAAAAAGBEEAIAAAAAAMCIIAQAAAAAAIARQQgAAAAAAAAjghAAAAAAAABGBCEAAAAAAACMCEIAAAAAAAAYEYQAAAAAAAAwIggBAAAAAABgRBACAAAAAADAiCAEAAAAAACAEUEIAAAAAAAAI4IQAAAAAAAARgQhAAAAAAAAjAhCAAAAAAAAGBGEAAAAAAAAMCIIAQAAAAAAYEQQAgAAAAAAwIggBAAAAAAAgBFBCAAAAAAAACOCEAAAAAAAAEYEIQAAAAAAAIwIQgAAAAAAABgRhAAAAAAAADAiCAEAAAAAAGBEEAIAAAAAAMCIIAQAAAAAAIARQQgAAAAAAAAjghAAAAAAAABGBCEAAAAAAACMCEIAAAAAAAAYEYQAAAAAAAAwIggBAAAAAABgRBACAAAAAADAiCAEAAAAAACAEUEIAAAAAAAAI4IQAAAAAAAARgQhAAAAAAAAjAhCAAAAAAAAGBGEAAAAAAAAMCIIAQAAAAAAYEQQAgAAAAAAwIggBAAAAAAAgBFBCAAAAAAAACOCEAAAAAAAAEYEIQAAAAAAAIwIQgAAAAAAABgRhAAAAAAAADAiCAEAAAAAAGBEEAIAAAAAAMCIIAQAAAAAAIARQQgAAAAAAAAjghAAAAAAAABGBCEAAAAAAACMCEIAAAAAAAAYEYQAAAAAAAAwIggBAAAAAABgRBACAAAAAADAiCAEAAAAAACAEUEIAAAAAAAAI4IQAAAAAAAARgQhAAAAAAAAjAhCAAAAAAAAGBGEAAAAAAAAMCIIAQAAAAAAYEQQAgAAAAAAwIggBAAAAAAAgBFBCAAAAAAAACOCEAAAAAAAAEYEIQAAAAAAAIwIQgAAAAAAABgRhAAAAAAAADAiCAEAAAAAAGBEEAIAAAAAAMCIIAQAAAAAAIARQQgAAAAAAAAjghAAAAAAAABGBCEAAAAAAACMCEIAAAAAAAAYEYQAAAAAAAAwIggBAAAAAABgRBACAAAAAADAiCAEAAAAAACAEUEIAAAAAAAAI4IQAAAAAAAARgQhAAAAAAAAjAhCAAAAAAAAGBGEAAAAAAAAMCIIAQAAAAAAYEQQAgAAAAAAwIggBAAAAAAAgBFBCAAAAAAAACOCEAAAAAAAAEYEIQAAAAAAAIwIQgAAAAAAABgRhAAAAAAAADAiCAEAAAAAAGBEEAIAAAAAAMCIIAQAAAAAAIARQQgAAAAAAAAjghAAAAAAAABGBCEAAAAAAACMCEIAAAAAAAAYEYQAAAAAAAAwIggBAAAAAABgRBACAAAAAADAiCAEAAAAAACAEUEIAAAAAAAAI4IQAAAAAAAARgQhAAAAAAAAjAhCAAAAAAAAGBGEAAAAAAAAMCIIAQAAAAAAYEQQAgAAAAAAwIggBAAAAAAAgBFBCAAAAAAAACOCEAAAAAAAAEYEIQAAAAAAAIwIQgAAAAAAABgRhAAAAAAAADAiCAEAAAAAAGBEEAIAAAAAAMCIIAQAAAAAAIARQQgAAAAAAAAjghAAAAAAAABGBCEAAAAAAACMCEIAAAAAAAAYEYQAAAAAAAAwIggBAAAAAABgRBACAAAAAADAiCAEAAAAAACAEUEIAAAAAAAAI4IQAAAAAAAARgQhAAAAAAAAjAhCAAAAAAAAGBGEAAAAAAAAMCIIAQAAAAAAYEQQAgAAAAAAwIggBAAAAAAAgBFBCAAAAAAAACOCEAAAAAAAAEYEIQAAAAAAAIwIQgAAAAAAABgRhAAAAAAAADAiCAEAAAAAAGBEEAIAAAAAAMCIIAQAAAAAAIARQQgAAAAAAAAjghAAAAAAAABGBCEAAAAAAACMCEIAAAAAAAAYEYQAAAAAAAAwIggBAAAAAABgRBACAAAAAADAiCAEAAAAAACAEUEIAAAAAAAAI4IQAAAAAAAARgQhAAAAAAAAjAhCAAAAAAAAGBGEAAAAAAAAMCIIAQAAAAAAYEQQAgAAAAAAwIggBAAAAAAAgBFBCAAAAAAAACOCEAAAAAAAAEYEIQAAAAAAAIwIQgAAAAAAABgRhAAAAAAAADAiCAEAAAAAAGBEEAIAAAAAAMCIIAQAAAAAAIARQQgAAAAAAAAjghAAAAAAAABGBCEAAAAAAACMCEIAAAAAAAAYEYQAAAAAAAAwIggBAAAAAABgRBACAAAAAADAiCAEAAAAAACAEUEIAAAAAAAAI4IQAAAAAAAARgQhAAAAAAAAjAhCAAAAAAAAGBGEAAAAAAAAMCIIAQAAAAAAYEQQAgAAAAAAwIggBAAAAAAAgBFBCAAAAAAAACOCEAAAAAAAAEYEIQAAAAAAAIwIQgAAAAAAABgRhAAAAAAAADAiCAEAAAAAAGBEEAIAAAAAAMCIIAQAAAAAAIARQQgAAAAAAAAjghAAAAAAAABGBCEAAAAAAACMCEIAAAAAAAAYEYQAAAAAAAAwIggBAAAAAABgRBACAAAAAADAiCAEAAAAAACAEUEIAAAAAAAAI4IQAAAAAAAARgQhAAAAAAAAjAhCAAAAAAAAGBGEAAAAAAAAMCIIAQAAAAAAYEQQAgAAAAAAwIggBAAAAAAAgBFBCAAAAAAAACOCEAAAAAAAAEYEIQAAAAAAAIwIQgAAAAAAABgRhAAAAAAAADAiCAEAAAAAAGBEEAIAAAAAAMCIIAQAAAAAAIARQQgAAAAAAAAjghAAAAAAAABGBCEAAAAAAACMCEIAAAAAAAAYEYQAAAAAAAAwIggBAAAAAABgRBACAAAAAADAiCAEAAAAAACAEUEIAAAAAAAAI4IQAAAAAAAARgQhAAAAAAAAjAhCAAAAAAAAGBGEAAAAAAAAMCIIAQAAAAAAYEQQAgAAAAAAwIggBAAAAAAAgBFBCAAAAAAAACOCEAAAAAAAAEYEIQAAAAAAAIwIQgAAAAAAABgRhAAAAAAAADAiCAEAAAAAAGBEEAIAAAAAAMCIIAQAAAAAAIARQQgAAAAAAAAjghAAAAAAAABGBCEAAAAAAACMCEIAAAAAAAAYEYQAAAAAAAAwIggBAAAAAABgRBACAAAAAADAiCAEAAAAAACAEUEIAAAAAAAAI4IQAAAAAAAARgQhAAAAAAAAjAhCAAAAAAAAGBGEAAAAAAAAMCIIAQAAAAAAYEQQAgAAAAAAwIggBAAAAAAAgBFBCAAAAAAAACOCEAAAAAAAAEYEIQAAAAAAAIwIQgAAAAAAABgRhAAAAAAAADAiCAEAAAAAAGBEEAIAAAAAAMCIIAQAAAAAAIARQQgAAAAAAAAjghAAAAAAAABGBCEAAAAAAACMCEIAAAAAAAAYEYQAAAAAAAAwIggBAAAAAABgRBACAAAAAADAiCAEAAAAAACAEUEIAAAAAAAAI4IQAAAAAAAARgQhAAAAAAAAjAhCAAAAAAAAGBGEAAAAAAAAMCIIAQAAAAAAYEQQAgAAAAAAwIggBAAAAAAAgBFBCAAAAAAAACOCEAAAAAAAAEYEIQAAAAAAAIwIQgAAAAAAABgRhAAAAAAAADAiCAEAAAAAAGBEEAIAAAAAAMCIIAQAAAAAAIARQQgAAAAAAAAjghAAAAAAAABGBCEAAAAAAACMCEIAAAAAAAAYEYQAAAAAAAAwIggBAAAAAABgRBACAAAAAADASOotf98aH400AAAAAElFTkSuQmCC",
56
+ "uri": "artwork_url",
52
57
  }
53
58
  }
54
59
  style={
@@ -65,7 +70,13 @@ exports[`<AudioPlayerTV /> renders correctly 1`] = `
65
70
  />
66
71
  </View>
67
72
  <View>
68
- <View
73
+ <Image
74
+ fadeDuration={0}
75
+ source={
76
+ {
77
+ "uri": "https://example.com",
78
+ }
79
+ }
69
80
  style={
70
81
  {
71
82
  "height": 72,
@@ -73,33 +84,17 @@ exports[`<AudioPlayerTV /> renders correctly 1`] = `
73
84
  "width": 128,
74
85
  }
75
86
  }
76
- >
77
- <Image
78
- fadeDuration={0}
79
- source={
80
- {
81
- "uri": "https://example.com",
82
- }
83
- }
84
- style={
85
- {
86
- "height": 72,
87
- "width": 128,
88
- }
89
- }
90
- />
91
- </View>
87
+ />
92
88
  <View
93
89
  style={
94
90
  {
95
- "height": 100,
96
91
  "marginBottom": 12,
97
92
  "width": 600,
98
93
  }
99
94
  }
100
95
  >
101
96
  <Text
102
- numberOfLines={2}
97
+ numberOfLines={3}
103
98
  style={
104
99
  {
105
100
  "color": "white",
@@ -116,14 +111,13 @@ exports[`<AudioPlayerTV /> renders correctly 1`] = `
116
111
  <View
117
112
  style={
118
113
  {
119
- "height": 80,
120
114
  "marginBottom": 30,
121
115
  "width": 600,
122
116
  }
123
117
  }
124
118
  >
125
119
  <Text
126
- numberOfLines={2}
120
+ numberOfLines={3}
127
121
  style={
128
122
  {
129
123
  "color": "white",
@@ -141,13 +135,13 @@ exports[`<AudioPlayerTV /> renders correctly 1`] = `
141
135
  <View
142
136
  style={
143
137
  {
144
- "height": 40,
145
138
  "justifyContent": "flex-end",
146
139
  "width": 600,
147
140
  }
148
141
  }
149
142
  >
150
143
  <Text
144
+ numberOfLines={1}
151
145
  style={
152
146
  {
153
147
  "alignItems": "flex-start",