Switch stack

This commit is contained in:
Diego Mello 2020-05-21 15:02:39 -03:00
parent 0cc510d818
commit 3867e57641
3 changed files with 87 additions and 78 deletions

83
app/AppContainer.js Normal file
View File

@ -0,0 +1,83 @@
import React from 'react';
import PropTypes from 'prop-types';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
import { connect } from 'react-redux';
import { defaultHeader, onNavigationStateChange } from './utils/navigation';
import Navigation from './lib/Navigation';
// Stacks
import AuthLoadingView from './views/AuthLoadingView';
// SetUsername Stack
import SetUsernameView from './views/SetUsernameView';
import OutsideStack from './stacks/OutsideStack';
import InsideStack from './stacks/InsideStack';
// SetUsernameStack
const SetUsername = createStackNavigator();
const SetUsernameStack = () => (
<SetUsername.Navigator screenOptions={defaultHeader}>
<SetUsername.Screen
name='SetUsernameView'
component={SetUsernameView}
/>
</SetUsername.Navigator>
);
// App
const Stack = createStackNavigator();
const App = ({ root }) => {
if (!root) {
return null;
}
return (
<NavigationContainer
ref={(navigatorRef) => {
Navigation.setTopLevelNavigator(navigatorRef);
}}
onNavigationStateChange={onNavigationStateChange}
>
<Stack.Navigator screenOptions={{ headerShown: false, animationEnabled: false }}>
<>
{root === 'loading' ? (
<Stack.Screen
name='AuthLoading'
component={AuthLoadingView}
/>
) : null}
{root === 'outside' ? (
<Stack.Screen
name='OutsideStack'
component={OutsideStack}
/>
) : null}
{root === 'inside' ? (
<Stack.Screen
name='InsideStack'
component={InsideStack}
/>
) : null}
{root === 'setUsername' ? (
<Stack.Screen
name='SetUsernameStack'
component={SetUsernameStack}
/>
) : null}
</>
</Stack.Navigator>
</NavigationContainer>
);
};
const mapStateToProps = state => ({
root: state.app.root
});
App.propTypes = {
root: PropTypes.string
};
const AppContainer = connect(mapStateToProps)(App);
export default AppContainer;

View File

@ -1,7 +1,5 @@
import React, { useState } from 'react';
import React from 'react';
import { Linking } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
import { AppearanceProvider } from 'react-native-appearance';
import { Provider } from 'react-redux';
import RNUserDefaults from 'rn-user-defaults';
@ -31,16 +29,7 @@ import {
import { KEY_COMMAND } from './commands';
import Tablet, { initTabletNav } from './tablet';
import { SplitContext } from './split';
import { defaultHeader, onNavigationStateChange } from './utils/navigation';
// App Stack
import AuthLoadingView from './views/AuthLoadingView';
// SetUsername Stack
import SetUsernameView from './views/SetUsernameView';
import OutsideStack from './stacks/OutsideStack';
import InsideStack from './stacks/InsideStack';
import AppContainer from './AppContainer';
RNScreens.enableScreens();
@ -58,60 +47,6 @@ const parseDeepLinking = (url) => {
return null;
};
// SetUsernameStack
const SetUsername = createStackNavigator();
const SetUsernameStack = () => (
<SetUsername.Navigator screenOptions={defaultHeader}>
<SetUsername.Screen
name='SetUsernameView'
component={SetUsernameView}
/>
</SetUsername.Navigator>
);
const AuthContext = React.createContext();
// App
const Stack = createStackNavigator();
export const App = () => {
const [loading] = useState(false);
return (
<NavigationContainer
ref={(navigatorRef) => {
Navigation.setTopLevelNavigator(navigatorRef);
}}
onNavigationStateChange={onNavigationStateChange}
>
<AuthContext.Provider value={{}}>
<Stack.Navigator screenOptions={{ headerShown: false }}>
{loading ? (
<Stack.Screen
name='AuthLoading'
component={AuthLoadingView}
/>
) : (
<>
<Stack.Screen
name='OutsideStack'
component={OutsideStack}
/>
<Stack.Screen
name='InsideStack'
component={InsideStack}
/>
<Stack.Screen
name='SetUsernameStack'
component={SetUsernameStack}
/>
</>
)}
</Stack.Navigator>
</AuthContext.Provider>
</NavigationContainer>
);
};
export default class Root extends React.Component {
constructor(props) {
super(props);
@ -223,7 +158,7 @@ export default class Root extends React.Component {
render() {
const { split, themePreferences, theme } = this.state;
let content = <App />;
let content = <AppContainer />;
if (isTablet) {
const { inside, showModal } = this.state;

View File

@ -113,16 +113,7 @@ const restore = function* restore() {
}
};
const start = function* start({ root, text }) {
if (root === 'inside') {
yield Navigation.navigate('InsideStack');
} else if (root === 'setUsername') {
yield Navigation.navigate('SetUsernameStack');
} else if (root === 'outside') {
yield Navigation.navigate('OutsideStack');
} else if (root === 'loading') {
yield Navigation.navigate('AuthLoading', { text });
}
const start = function start() {
RNBootSplash.hide();
};