wip

artsy · Jan 26, 2021 · 6925abb · 6925abb
1 parent fd1d6e7
commit 6925abb
Show file tree

Hide file tree

Showing 8 changed files with 56 additions and 116 deletions.
diff --git a/package.json b/package.json
@@ -85,6 +85,7 @@
     "@react-native-community/netinfo": "4.6.1",
     "@react-native-community/picker": "1.3.0",
     "@react-native-mapbox-gl/maps": "8.1.0-rc.9",
+    "@react-navigation/bottom-tabs": "^5.11.7",
     "@react-navigation/native": "^5.8.6",
     "@react-navigation/stack": "^5.12.3",
     "@sentry/react-native": "1.3.2",
@@ -108,7 +109,7 @@
     "react-native-localize": "^2.0.1",
     "react-native-reanimated": "^1.13.1",
     "react-native-safe-area-context": "^3.1.8",
-    "react-native-screens": "^2.13.0",
+    "react-native-screens": "^2.17.1",
     "react-native-scrollable-tab-view": "1.0.0",
     "react-native-share": "5.1.0",
     "react-native-svg": "9.13.3",

diff --git a/src/__generated__/AndroidAppQuery.graphql.ts b/src/__generated__/AndroidAppQuery.graphql.ts
diff --git a/src/lib/AndroidApp.tsx b/src/lib/AndroidApp.tsx
@@ -6,6 +6,7 @@ import { View } from "react-native"
 import { TouchableOpacity } from "react-native-gesture-handler"
 import track from "react-tracking"
 import { LogIn } from "./LogIn/LogIn"
+import { HolisticNav } from "./navigation/HolisticNav"
 import { BottomTabsNavigator } from "./Scenes/BottomTabs/BottomTabsNavigator"
 import { ProvideScreenDimensions } from "./utils/useScreenDimensions"
 

diff --git a/src/lib/NativeModules/ARScreenPresenterModule.tsx b/src/lib/NativeModules/ARScreenPresenterModule.tsx
@@ -12,8 +12,12 @@ export const __unsafe_tabStackNavRefs: Record<BottomTabType, NavigationContainer
   profile: null,
 }
 
+// tslint:disable-next-line:variable-name
+export const __unsafe_modalStackRef = { current: null as NavigationContainerRef | null }
+
 export const ARScreenPresenterModule: typeof NativeModules["ARScreenPresenterModule"] = {
-  presentModal(_viewDescriptor: ViewDescriptor) {
+  presentModal(viewDescriptor: ViewDescriptor) {
+    __unsafe_modalStackRef.current?.dispatch(StackActions.push(viewDescriptor.moduleName, viewDescriptor.props))
     // _presentModal(viewDescriptor)
   },
   async popToRootAndScrollToTop(selectedTab: BottomTabType) {

diff --git a/src/lib/Scenes/BottomTabs/BottomTabsNavigator.tsx b/src/lib/Scenes/BottomTabs/BottomTabsNavigator.tsx
@@ -1,6 +1,9 @@
+import { NavigationContainer } from "@react-navigation/native"
 import { AppModule, modules } from "lib/AppRegistry"
 import { NativeViewController } from "lib/Components/NativeViewController"
-import { __unsafe_tabStackNavRefs } from "lib/NativeModules/ARScreenPresenterModule"
+import { __unsafe_navRef, __unsafe_tabStackNavRefs } from "lib/NativeModules/ARScreenPresenterModule"
+import { ModalStack } from "lib/navigation/ModalStack"
+// import { ModalStack } from "lib/navigation/ModalStack"
 import { NavStack } from "lib/navigation/NavStack"
 import { useSelectedTab } from "lib/store/GlobalStore"
 import { useScreenDimensions } from "lib/utils/useScreenDimensions"
@@ -42,17 +45,19 @@ export const BottomTabsNavigator = () => {
   const { bottom } = useScreenDimensions().safeAreaInsets
   return (
     <View style={{ flex: 1, paddingBottom: bottom }}>
-      <FadeBetween
-        views={[
-          <TabContent tabName="home" rootModuleName="Home" />,
-          <TabContent tabName="search" rootModuleName="Search" />,
-          <TabContent tabName="inbox" rootModuleName="Inbox" />,
-          <TabContent tabName="sell" rootModuleName="Sales" />,
-          <TabContent tabName="profile" rootModuleName="MyProfile" />,
-        ]}
-        activeIndex={["home", "search", "inbox", "sell", "profile"].indexOf(selectedTab)}
-      />
-      <BottomTabs />
+      <ModalStack>
+        <FadeBetween
+          views={[
+            <TabContent tabName="home" rootModuleName="Home" />,
+            <TabContent tabName="search" rootModuleName="Search" />,
+            <TabContent tabName="inbox" rootModuleName="Inbox" />,
+            <TabContent tabName="sell" rootModuleName="Sales" />,
+            <TabContent tabName="profile" rootModuleName="MyProfile" />,
+          ]}
+          activeIndex={["home", "search", "inbox", "sell", "profile"].indexOf(selectedTab)}
+        />
+        <BottomTabs />
+      </ModalStack>
     </View>
   )
 }

diff --git a/src/lib/navigation/ModalStack.tsx b/src/lib/navigation/ModalStack.tsx
@@ -0,0 +1,18 @@
+import { NavigationContainer } from "@react-navigation/native"
+import { __unsafe_modalStackRef } from "lib/NativeModules/ARScreenPresenterModule"
+import { HomeQueryRenderer } from "lib/Scenes/Home/Home"
+import React from "react"
+import { createNativeStackNavigator } from "react-native-screens/native-stack"
+
+const Stack = createNativeStackNavigator()
+
+export const ModalStack: React.FC = ({ children }) => {
+  return (
+    <NavigationContainer independent={true} ref={__unsafe_modalStackRef}>
+      <Stack.Navigator mode="modal" screenOptions={{ headerShown: false, contentStyle: { backgroundColor: "white" } }}>
+        <Stack.Screen name="root">{() => children}</Stack.Screen>
+        <Stack.Screen name="Home" component={HomeQueryRenderer}></Stack.Screen>
+      </Stack.Navigator>
+    </NavigationContainer>
+  )
+}
diff --git a/src/lib/navigation/NavStack.tsx b/src/lib/navigation/NavStack.tsx
@@ -10,7 +10,7 @@ const StackNavigator = createStackNavigator()
 export const NavStack = React.forwardRef<NavigationContainerRef, { rootModuleName: AppModule }>(
   ({ rootModuleName }, ref) => {
     return (
-      <NavigationContainer ref={ref}>
+      <NavigationContainer ref={ref} independent>
         <StackNavigator.Navigator
           screenOptions={{ headerShown: false, cardStyle: { backgroundColor: "white" } }}
           initialRouteName={rootModuleName}

diff --git a/yarn.lock b/yarn.lock
@@ -2306,6 +2306,14 @@
     "@types/geojson" "^7946.0.7"
     debounce "^1.2.0"
 
+"@react-navigation/bottom-tabs@^5.11.7":
+  version "5.11.7"
+  resolved "https://registry.yarnpkg.com/@react-navigation/bottom-tabs/-/bottom-tabs-5.11.7.tgz#a1d220afe02b6897c0705ddc40265e65c01fa0ba"
+  integrity sha512-O8B/5GiME589fc6ltqV3iJxCdWXhplx+9i7tPbwx4SxKm1e1N9jdL9H8bsx+SWcMBelGfGeZ2WqRwMJzjQDT3Q==
+  dependencies:
+    color "^3.1.3"
+    react-native-iphone-x-helper "^1.3.0"
+
 "@react-navigation/core@^5.14.0":
   version "5.14.0"
   resolved "https://registry.yarnpkg.com/@react-navigation/core/-/core-5.14.0.tgz#7cfba86ca3042ddc4542bd3422b73b3cf3553f61"
@@ -11206,10 +11214,10 @@ react-native-safe-area-context@^3.1.8:
   resolved "https://registry.yarnpkg.com/react-native-safe-area-context/-/react-native-safe-area-context-3.1.8.tgz#7a9883aa0f38f9c77d4bef2b89e4e285bc1024a3"
   integrity sha512-9gUlsDZ96QwT9AKzA6aVWM/NX5rlJgauZ9HgCDVzKbe29UQYT1740QJnnaI2GExmkFGp6o7ZLNhCXZW95eYVFA==
 
-react-native-screens@^2.13.0:
-  version "2.13.0"
-  resolved "https://registry.yarnpkg.com/react-native-screens/-/react-native-screens-2.13.0.tgz#6360dfd65d51f73479bea14373a8e289cd58a327"
-  integrity sha512-B0kPYq5ZK/2G7pPhcAFLflDfm+HXktdVEeLFHnP/+oPnao+b28hXsOBCi0IgK72gxbdPtnpZME8KONRIKOBDug==
+react-native-screens@^2.17.1:
+  version "2.17.1"
+  resolved "https://registry.yarnpkg.com/react-native-screens/-/react-native-screens-2.17.1.tgz#c3c0ac750af48741c5b1635511e6af2a27b74309"
+  integrity sha512-B4gD5e4csvlVwlhf+RNqjQZ9mHTwe/iL3rXondgZxnKz4oW0QAmtLnLRKOrYVxoaJaF9Fy7jhjo//24/472APQ==
 
 react-native-scrollable-tab-view@1.0.0:
   version "1.0.0"