@applicaster/zapp-react-native-ui-components 12.0.0-rc.142 → 12.0.0-rc.143
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.
|
@@ -128,7 +128,7 @@ export function Screen(_props: Props) {
|
|
|
128
128
|
<View style={style}>
|
|
129
129
|
{navBarProps && <NavBar {...navBarProps} hasMenu={hasMenu} />}
|
|
130
130
|
|
|
131
|
-
<OfflineFallbackScreen
|
|
131
|
+
<OfflineFallbackScreen>
|
|
132
132
|
{/* @TODO RouteManager doesn't use props, can they be removed ? */}
|
|
133
133
|
<RouteManager pathname={pathname} screenData={screenData} />
|
|
134
134
|
</OfflineFallbackScreen>
|
|
@@ -11,9 +11,6 @@ import { isTV } from "@applicaster/zapp-react-native-utils/reactUtils";
|
|
|
11
11
|
import { useIsTablet } from "@applicaster/zapp-react-native-utils/reactHooks";
|
|
12
12
|
import { PlayerDetails } from "./PlayerDetails";
|
|
13
13
|
import { playerDimesionsHack } from "./utils";
|
|
14
|
-
import { PathnameContext } from "../../Contexts/PathnameContext";
|
|
15
|
-
import { ScreenContextProvider } from "../../Contexts/ScreenContext";
|
|
16
|
-
import { ROUTE_TYPES } from "@applicaster/zapp-react-native-utils/navigationUtils/routeTypes";
|
|
17
14
|
|
|
18
15
|
import {
|
|
19
16
|
AnimatedScrollModal,
|
|
@@ -136,7 +133,15 @@ const getStyles = (baseStyle, isMobile, isPortrait) => {
|
|
|
136
133
|
return baseStyle;
|
|
137
134
|
};
|
|
138
135
|
|
|
139
|
-
const showDetails = (
|
|
136
|
+
const showDetails = (
|
|
137
|
+
isMobile: boolean,
|
|
138
|
+
docked: boolean,
|
|
139
|
+
isInlineModal
|
|
140
|
+
): boolean => {
|
|
141
|
+
if (!isInlineModal) {
|
|
142
|
+
return false;
|
|
143
|
+
}
|
|
144
|
+
|
|
140
145
|
// for mobile we always show details. Mounting of it very heavy operation.
|
|
141
146
|
if (isMobile) {
|
|
142
147
|
return true;
|
|
@@ -209,72 +214,62 @@ const PlayerWrapperComponent = (props: Props) => {
|
|
|
209
214
|
[containerDimensions, playerDimesionsHack]
|
|
210
215
|
);
|
|
211
216
|
|
|
212
|
-
const pathname = `${ROUTE_TYPES.VIDEO_MODAL}/${entry?.id}`;
|
|
213
|
-
|
|
214
217
|
return (
|
|
215
|
-
<
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
218
|
+
<WrapperView
|
|
219
|
+
edges={getEdges(isTablet, isInlineModal) as readonly Edge[]}
|
|
220
|
+
style={[
|
|
221
|
+
safeAreaStyles(configuration, isTablet),
|
|
222
|
+
style,
|
|
223
|
+
playerDimesionsHack,
|
|
224
|
+
]}
|
|
225
|
+
>
|
|
226
|
+
<AnimationComponent
|
|
227
|
+
animationType={ComponentAnimationType.moveUpComponent}
|
|
228
|
+
additionalData={{ saveArea: true }}
|
|
229
|
+
style={[directionStyles(isTabletLandscape), defaultStyles.flex]}
|
|
230
|
+
>
|
|
231
|
+
<View
|
|
232
|
+
testID={`${entry?.id}-player-container`}
|
|
219
233
|
style={[
|
|
220
|
-
|
|
221
|
-
|
|
234
|
+
defaultStyles.playerContainer,
|
|
235
|
+
containerDimensions,
|
|
236
|
+
containerStyle,
|
|
222
237
|
playerDimesionsHack,
|
|
223
238
|
]}
|
|
224
239
|
>
|
|
225
240
|
<AnimationComponent
|
|
226
241
|
animationType={ComponentAnimationType.moveUpComponent}
|
|
227
|
-
|
|
228
|
-
|
|
242
|
+
style={isTabletLandscape ? defaultStyles.flex : undefined}
|
|
243
|
+
additionalData={{
|
|
244
|
+
useLayoutMeasure: isTabletLandscape,
|
|
245
|
+
disableAnimatedComponent: !isTabletLandscape,
|
|
246
|
+
resetAnimationValue: isTabletLandscape && docked,
|
|
247
|
+
}}
|
|
229
248
|
>
|
|
230
|
-
<
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
testID={`${entry?.id}-player-container`}
|
|
234
|
-
style={[
|
|
235
|
-
defaultStyles.playerContainer,
|
|
236
|
-
containerDimensions,
|
|
237
|
-
containerStyle,
|
|
238
|
-
playerDimesionsHack,
|
|
239
|
-
]}
|
|
240
|
-
>
|
|
241
|
-
<AnimationComponent
|
|
242
|
-
animationType={ComponentAnimationType.moveUpComponent}
|
|
243
|
-
style={isTabletLandscape ? defaultStyles.flex : undefined}
|
|
244
|
-
additionalData={{
|
|
245
|
-
useLayoutMeasure: isTabletLandscape,
|
|
246
|
-
disableAnimatedComponent: !isTabletLandscape,
|
|
247
|
-
resetAnimationValue: isTabletLandscape && docked,
|
|
248
|
-
}}
|
|
249
|
-
>
|
|
250
|
-
<AnimatedVideoPlayerComponent>
|
|
251
|
-
{children(childrenStyles)}
|
|
252
|
-
</AnimatedVideoPlayerComponent>
|
|
253
|
-
</AnimationComponent>
|
|
254
|
-
</View>
|
|
255
|
-
|
|
256
|
-
<AnimatedScrollModal>
|
|
257
|
-
{showDetails(!isTablet, docked) && (
|
|
258
|
-
<AnimationComponent
|
|
259
|
-
animationType={ComponentAnimationType.componentFade}
|
|
260
|
-
style={defaultStyles.flex}
|
|
261
|
-
>
|
|
262
|
-
<PlayerDetails
|
|
263
|
-
configuration={configuration}
|
|
264
|
-
style={defaultStyles.playerDetails}
|
|
265
|
-
entry={entry}
|
|
266
|
-
isTabletLandscape={isTabletLandscape}
|
|
267
|
-
isTablet={isTablet}
|
|
268
|
-
/>
|
|
269
|
-
</AnimationComponent>
|
|
270
|
-
)}
|
|
271
|
-
</AnimatedScrollModal>
|
|
272
|
-
</ScreenContextProvider>
|
|
273
|
-
</PathnameContext.Provider>
|
|
249
|
+
<AnimatedVideoPlayerComponent>
|
|
250
|
+
{children(childrenStyles)}
|
|
251
|
+
</AnimatedVideoPlayerComponent>
|
|
274
252
|
</AnimationComponent>
|
|
275
|
-
</
|
|
276
|
-
|
|
277
|
-
|
|
253
|
+
</View>
|
|
254
|
+
|
|
255
|
+
<AnimatedScrollModal>
|
|
256
|
+
{showDetails(!isTablet, docked, isInlineModal) && (
|
|
257
|
+
<AnimationComponent
|
|
258
|
+
animationType={ComponentAnimationType.componentFade}
|
|
259
|
+
style={defaultStyles.flex}
|
|
260
|
+
>
|
|
261
|
+
<PlayerDetails
|
|
262
|
+
configuration={configuration}
|
|
263
|
+
style={defaultStyles.playerDetails}
|
|
264
|
+
entry={entry}
|
|
265
|
+
isTabletLandscape={isTabletLandscape}
|
|
266
|
+
isTablet={isTablet}
|
|
267
|
+
/>
|
|
268
|
+
</AnimationComponent>
|
|
269
|
+
)}
|
|
270
|
+
</AnimatedScrollModal>
|
|
271
|
+
</AnimationComponent>
|
|
272
|
+
</WrapperView>
|
|
278
273
|
);
|
|
279
274
|
};
|
|
280
275
|
|
|
@@ -405,36 +405,6 @@ exports[`PlayerWrapper renders properly 1`] = `
|
|
|
405
405
|
}
|
|
406
406
|
testID="test-player-container"
|
|
407
407
|
/>
|
|
408
|
-
<View
|
|
409
|
-
animationType="componentFade"
|
|
410
|
-
style={
|
|
411
|
-
Object {
|
|
412
|
-
"flex": 1,
|
|
413
|
-
}
|
|
414
|
-
}
|
|
415
|
-
>
|
|
416
|
-
<View
|
|
417
|
-
configuration={
|
|
418
|
-
Object {
|
|
419
|
-
"tablet_landscape_player_container_background_color": "red",
|
|
420
|
-
"tablet_landscape_sidebar_width": "35%",
|
|
421
|
-
}
|
|
422
|
-
}
|
|
423
|
-
entry={
|
|
424
|
-
Object {
|
|
425
|
-
"id": "test",
|
|
426
|
-
}
|
|
427
|
-
}
|
|
428
|
-
isTablet={false}
|
|
429
|
-
isTabletLandscape={false}
|
|
430
|
-
style={
|
|
431
|
-
Object {
|
|
432
|
-
"flex": 1,
|
|
433
|
-
"paddingTop": 20,
|
|
434
|
-
}
|
|
435
|
-
}
|
|
436
|
-
/>
|
|
437
|
-
</View>
|
|
438
408
|
</View>
|
|
439
409
|
</RNCSafeAreaView>
|
|
440
410
|
</RNCSafeAreaProvider>
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@applicaster/zapp-react-native-ui-components",
|
|
3
|
-
"version": "12.0.0-rc.
|
|
3
|
+
"version": "12.0.0-rc.143",
|
|
4
4
|
"description": "Applicaster Zapp React Native ui components for the Quick Brick App",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"types": "index.d.ts",
|
|
@@ -34,10 +34,10 @@
|
|
|
34
34
|
"redux-mock-store": "^1.5.3"
|
|
35
35
|
},
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@applicaster/applicaster-types": "12.0.0-rc.
|
|
38
|
-
"@applicaster/zapp-react-native-bridge": "12.0.0-rc.
|
|
39
|
-
"@applicaster/zapp-react-native-redux": "12.0.0-rc.
|
|
40
|
-
"@applicaster/zapp-react-native-utils": "12.0.0-rc.
|
|
37
|
+
"@applicaster/applicaster-types": "12.0.0-rc.143",
|
|
38
|
+
"@applicaster/zapp-react-native-bridge": "12.0.0-rc.143",
|
|
39
|
+
"@applicaster/zapp-react-native-redux": "12.0.0-rc.143",
|
|
40
|
+
"@applicaster/zapp-react-native-utils": "12.0.0-rc.143",
|
|
41
41
|
"promise": "^8.3.0",
|
|
42
42
|
"react-router-native": "^5.1.2",
|
|
43
43
|
"url": "^0.11.0",
|