@applicaster/zapp-react-native-app 14.0.0-alpha.5621117258 → 14.0.0-alpha.6335583720

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 (2) hide show
  1. package/App/Layout/index.tsx +36 -30
  2. package/package.json +6 -6
package/App/Layout/index.tsx CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as React from "react";
2
2
  import * as R from "ramda";
3
3
 
4
- import { View } from "react-native";
4
+ import { View, StyleSheet } from "react-native";
5
5
 
6
6
  import {
7
7
  getNavigationProps,
@@ -39,10 +39,13 @@ import {
39
39
  PushTopicManagerConsts,
40
40
  PushTopicManagerEvents,
41
41
  } from "@applicaster/zapp-react-native-bridge/PushNotifications/PushTopicManager";
42
+ import { useSafeAreaInsets } from "react-native-safe-area-context";
42
43
 
43
- const containerStyle = {
44
- height: "100%",
45
- };
44
+ const styles = StyleSheet.create({
45
+ container: {
46
+ height: "100%",
47
+ },
48
+ });
46
49
 
47
50
  const LayoutWithMenu = () => {
48
51
  const {
@@ -63,6 +66,7 @@ const LayoutWithMenu = () => {
63
66
  const isRTL = useIsRTL();
64
67
  const navigator = useNavigation();
65
68
  const bottomTabBarHeight = useGetBottomTabBarHeight();
69
+ const { bottom: safeAreaBottomInset } = useSafeAreaInsets();
66
70
  const { title } = useNavbarState();
67
71
 
68
72
  const { activeRiver, videoModalState, isVideoModalDocked } = navigator;
@@ -94,36 +98,38 @@ const LayoutWithMenu = () => {
94
98
  * otherwise hidden if videoModalState - visible
95
99
  * also check isMenuVisible
96
100
  */
97
- const showMenu = React.useMemo(() => {
98
- if (!videoModalState.visible) {
99
- return isMenuVisible(navigator.currentRoute, navigator.screenData);
100
- } else {
101
- if (videoModalState.mode === "FULLSCREEN") {
102
- return false;
103
- }
104
- }
105
-
106
- return isMenuVisible(navigator.currentRoute, navigator.screenData);
107
- }, [
108
- videoModalState.visible,
109
- videoModalState.mode,
110
- navigator.currentRoute,
111
- isActiveGesture,
112
- ]);
101
+ const showMenu = React.useMemo(
102
+ () =>
103
+ ((videoModalState.visible &&
104
+ (videoModalState.mode === "MINIMIZED" ||
105
+ (videoModalState.mode === "MAXIMIZED" && isActiveGesture))) ||
106
+ !videoModalState.visible) &&
107
+ isMenuVisible(navigator.currentRoute, navigator.screenData),
108
+ [
109
+ videoModalState.visible,
110
+ videoModalState.mode,
111
+ navigator.currentRoute,
112
+ isActiveGesture,
113
+ ]
114
+ );
113
115
 
114
116
  const isBottomTabsPlugin = plugin?.identifier === "quick-brick-bottom-tabs";
115
117
 
116
- const paddingBottom = React.useMemo(() => {
117
- return showMenu && isBottomTabsPlugin ? bottomTabBarHeight : 0; // if activeRiver?.navigations has quick-brick-bottom-tabs - append bottomTabBarHeight as padding
118
- }, [showMenu, isBottomTabsPlugin, bottomTabBarHeight]);
118
+ const paddingBottom =
119
+ showMenu && isBottomTabsPlugin
120
+ ? bottomTabBarHeight + safeAreaBottomInset
121
+ : 0; // if activeRiver?.navigations has quick-brick-bottom-tabs - append bottomTabBarHeight as padding
119
122
 
120
123
  const contentStyle = React.useMemo(
121
- () => ({
122
- ...containerStyle,
123
- paddingBottom,
124
- opacity: videoModalState.visible && !isVideoModalDocked ? 0 : 1,
125
- }),
126
- [videoModalState.visible, isVideoModalDocked, paddingBottom]
124
+ () =>
125
+ StyleSheet.flatten([
126
+ styles.container,
127
+ {
128
+ paddingBottom,
129
+ opacity: videoModalState.visible && !isVideoModalDocked ? 0 : 1,
130
+ },
131
+ ]),
132
+ [videoModalState.visible, isVideoModalDocked]
127
133
  );
128
134
 
129
135
  const menuProps = React.useMemo(() => {
@@ -167,7 +173,7 @@ const LayoutWithMenu = () => {
167
173
  return (
168
174
  <>
169
175
  {appReady ? (
170
- <View style={containerStyle}>
176
+ <View style={styles.container}>
171
177
  <Transitioner
172
178
  transitionConfig={transitionConfig}
173
179
  contentStyle={contentStyle}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@applicaster/zapp-react-native-app",
3
- "version": "14.0.0-alpha.5621117258",
3
+ "version": "14.0.0-alpha.6335583720",
4
4
  "description": "Zapp App Component for Applicaster's Quick Brick React Native App",
5
5
  "main": "index.js",
6
6
  "scripts": {
@@ -27,11 +27,11 @@
27
27
  },
28
28
  "homepage": "https://github.com/applicaster/quickbrick#readme",
29
29
  "dependencies": {
30
- "@applicaster/quick-brick-core": "14.0.0-alpha.5621117258",
31
- "@applicaster/zapp-react-native-bridge": "14.0.0-alpha.5621117258",
32
- "@applicaster/zapp-react-native-redux": "14.0.0-alpha.5621117258",
33
- "@applicaster/zapp-react-native-ui-components": "14.0.0-alpha.5621117258",
34
- "@applicaster/zapp-react-native-utils": "14.0.0-alpha.5621117258",
30
+ "@applicaster/quick-brick-core": "14.0.0-alpha.6335583720",
31
+ "@applicaster/zapp-react-native-bridge": "14.0.0-alpha.6335583720",
32
+ "@applicaster/zapp-react-native-redux": "14.0.0-alpha.6335583720",
33
+ "@applicaster/zapp-react-native-ui-components": "14.0.0-alpha.6335583720",
34
+ "@applicaster/zapp-react-native-utils": "14.0.0-alpha.6335583720",
35
35
  "axios": "^0.28.0",
36
36
  "camelize": "^1.0.0",
37
37
  "query-string": "7.1.3",