feat(client): use new navigator

Signed-off-by: Sacha Froment <sfroment42@gmail.com>

client/react-native/common/components/App.js

@@ -1,27 +1,36 @@
 import { I18nextProvider } from 'react-i18next'
 import { Linking, Platform, View } from 'react-native'
-import { SafeAreaView } from 'react-navigation'
-import Config from 'react-native-config'
+import { SafeAreaView, createAppContainer } from 'react-navigation'
 import FlashMessage from 'react-native-flash-message'
 import KeyboardSpacer from 'react-native-keyboard-spacer'
-import React, { PureComponent } from 'react'
 import ReactNativeLanguages from 'react-native-languages'
+import React, { PureComponent } from 'react'
+import Config from 'react-native-config'
 
-import { BASE_WEBSITE_URL, colors } from './../constants'
 import { contact, conversation } from '../utils'
 import { parse as parseUrl } from '../helpers/url'
 import { Flex, Animation, MovableView, DebugStateBar } from './Library'
-import Accounts from './Screens/Accounts'
 import Instabug from '../helpers/Instabug'
+import { BASE_WEBSITE_URL, colors } from './../constants'
 import i18n from '../i18n'
 import NavigationService from './../helpers/NavigationService'
+import { AppNavigator } from './Navigator/AppNavigator'
+import { RelayContext } from '../relay'
+
+let AppContainer = {}
+if (Platform.OS !== 'web') {
+  AppContainer = createAppContainer(AppNavigator)
+} else {
+  AppContainer = AppNavigator
+}
 
 export default class App extends PureComponent {
   state = {
     loading: true,
     showAnim:
       process.env['ENVIRONMENT'] !== 'integration_test' &&
       Platform.OS !== 'web',
+    relayContext: null,
     deepLink: {
       routeName: 'main',
       params: {},
@@ -121,8 +130,14 @@ export default class App extends PureComponent {
     this.setState({ deepLink })
   }
 
+  setStateBis = (i, f) => {
+    console.log('asdasdasd', i, f)
+    this.setState(i, f)
+  }
+
   render () {
-    const { loading, deepLink, showAnim } = this.state
+    const { loading, deepLink, showAnim, relayContext } = this.state
+    console.log('rerendering all')
     return (
       <I18nextProvider i18n={i18n}>
         <SafeAreaView style={{ flex: 1 }} forceInset={{ bottom: 'never' }}>
@@ -140,23 +155,25 @@ export default class App extends PureComponent {
             >
               <Animation onFinish={() => this.setState({ showAnim: false })} />
             </Flex.Rows>
-          ) : null}
-          {!loading ? (
-            <Accounts
-              ref={nav => {
-                this.navigation = nav
-                NavigationService.setTopLevelNavigator(nav)
-              }}
-              screenProps={{
-                deepLink,
-                setDeepLink: deepLink => this.setDeepLink(deepLink),
-                clearDeepLink: () => this.clearDeepLink(),
-                onRelayContextCreated: context => this.setState({
-                  debugBar: <DebugStateBar context={context} />,
-                }),
-              }}
-            />
-          ) : null}
+          ) : null }
+          { !loading
+            ? <RelayContext.Provider value={{ ...relayContext, setStateBis: this.setStateBis }}>
+              <AppContainer
+                ref={nav => {
+                  this.navigation = nav
+                  NavigationService.setTopLevelNavigator(nav)
+                }}
+                screenProps={{
+                  deepLink,
+                  setDeepLink: (deepLink) => this.setDeepLink(deepLink),
+                  clearDeepLink: () => this.clearDeepLink(),
+                  onRelayContextCreated: context => this.setState({
+                    debugBar: <DebugStateBar context={context} />,
+                  }),
+                }}
+              />
+            </RelayContext.Provider>
+            : null }
           <FlashMessage position='top' />
           <View style={{ zIndex: 1, position: 'absolute', top: 30, right: 48, padding: 5 }}>
             <MovableView>

client/react-native/common/components/Library/ContactIdentity.js

@@ -1,7 +1,7 @@
+import React from 'react'
 import { View, Platform, Text as RNText } from 'react-native'
 import { createMaterialTopTabNavigator, withNavigation } from 'react-navigation'
 import I18n from 'i18next'
-import React from 'react'
 
 import Text from './Text'
 import Avatar from './Avatar'

client/react-native/common/components/Navigator/ModalMaterialNavigator.js

@@ -1,4 +1,5 @@
 import { createMaterialTopTabNavigator } from 'react-navigation'
+import { Keyboard } from 'react-native'
 import ByQRCode from '../Screens/Contacts/Add/ByQRCode'
 import ByPublicKey from '../Screens/Contacts/Add/ByPublicKey'
 import Invite from '../Screens/Contacts/Add/Invite'
@@ -40,9 +41,11 @@ export default createMaterialTopTabNavigator(
   {
     ...tabNavigatorOptions,
     animationEnabled: false,
+    defaultNavigationOptions: {
+      tabBarOnPress: ({ navigation, defaultHandler }) => {
+        defaultHandler()
+        Keyboard.dismiss()
+      },
+    },
   },
 )
-
-// const AddScreen = () => <View style={{ flex: 1 }}>
-//   <AddContactTabbedContent />
-// </View>

client/react-native/common/components/Screens/Accounts/Auth.js

@@ -4,14 +4,25 @@ import {
   View,
   Text,
   TouchableOpacity,
+  Platform,
 } from 'react-native'
 import React, { PureComponent } from 'react'
 
 import { Flex, Loader, Screen } from '../../Library'
 import { colors } from '../../../constants'
 import { defaultUsername } from '../../../helpers/contacts'
+import withRelayContext from '../../../helpers/withRelayContext'
+import sleep from '../../../helpers/sleep'
+import { environment, contextValue } from '../../../relay'
+import { getAvailableUpdate } from '../../../helpers/update'
 import { withNamespaces } from 'react-i18next'
-
+import {
+  queries,
+  mutations,
+  subscriptions,
+  fragments,
+  updaters,
+} from '../../../graphql'
 import { hook } from 'cavy'
 
 const { CoreModule } = NativeModules
@@ -22,7 +33,64 @@ class Auth extends PureComponent {
     current: null,
     loading: true,
     message: null,
-    nickname: null,
+    nickname: '',
+  }
+
+  getIp = async () => {
+    if (Platform.OS === 'web') {
+      return window.location.hostname
+    }
+    return '127.0.0.1'
+  }
+
+  getPort = async () => {
+    try {
+      const port = await CoreModule.getPort()
+      console.log('get port', port)
+      return port
+    } catch (error) {
+      console.warn(error, 'retrying to get port')
+      await sleep(1000)
+      return this.getPort()
+    }
+  }
+
+  openDeepLink = () => {
+    if (this.props.screenProps === 'undefined') {
+      // return
+    }
+
+    // const {
+    //   screenProps: {
+    //     deepLink,
+    //     clearDeepLink,
+    //   },
+    //   navigation,
+    // } = this.props
+
+    // if (!deepLink || deepLink === 'undefined' || Platform.OS === 'web') {
+    //   return
+    // }
+
+    // navigation.dispatch(NavigationActions.navigate(deepLink))
+    // clearDeepLink()
+  }
+
+  getRelayContext = async () => {
+    console.log('11235')
+    const test = await contextValue({
+      environment: await environment.setup({
+        getIp: this.getIp,
+        getPort: this.getPort,
+      }),
+      mutations,
+      subscriptions,
+      queries,
+      fragments,
+      updaters,
+    })
+
+    return test
   }
 
   init = async () => {
@@ -82,10 +150,20 @@ class Auth extends PureComponent {
       nickname = list[0]
     }
     await this.start(nickname)
+    const context = await this.getRelayContext()
+    const availableUpdate = await getAvailableUpdate(context)
+    this.props.context.setStateBis(
+      {
+        relayContext: context,
+        availableUpdate: availableUpdate,
+        loading: false,
+      },
+      () => {
+        this.openDeepLink()
+      }
+    )
 
-    this.props.navigation.navigate('accounts/current', {
-      firstLaunch,
-    })
+    this.props.navigation.navigate('switch/picker', { firstLaunch })
   }
 
   async componentDidMount () {
@@ -96,6 +174,9 @@ class Auth extends PureComponent {
     if (nextProps.screenProps.deepLink !== this.props.screenProps.deepLink) {
       this.open(this.state.list[0])
     }
+    // if ((nextProps.screenProps !== 'undefined' && this.props.screenProps === 'undefined') || (nextProps.screenProps !== 'undefined' && this.props.screenProps !== 'undefined' && nextProps.screenProps.deepLink !== this.props.screenProps.deepLink)) {
+    //   this.openDeepLink()
+    // }
   }
 
   render () {
@@ -181,4 +262,4 @@ class Auth extends PureComponent {
   }
 }
 
-export default withNamespaces()(hook(Auth))
+export default withRelayContext(withNamespaces()(hook(Auth)))