Switch stack
This commit is contained in:
parent
0cc510d818
commit
3867e57641
|
@ -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;
|
71
app/index.js
71
app/index.js
|
@ -1,7 +1,5 @@
|
||||||
import React, { useState } from 'react';
|
import React from 'react';
|
||||||
import { Linking } from 'react-native';
|
import { Linking } from 'react-native';
|
||||||
import { NavigationContainer } from '@react-navigation/native';
|
|
||||||
import { createStackNavigator } from '@react-navigation/stack';
|
|
||||||
import { AppearanceProvider } from 'react-native-appearance';
|
import { AppearanceProvider } from 'react-native-appearance';
|
||||||
import { Provider } from 'react-redux';
|
import { Provider } from 'react-redux';
|
||||||
import RNUserDefaults from 'rn-user-defaults';
|
import RNUserDefaults from 'rn-user-defaults';
|
||||||
|
@ -31,16 +29,7 @@ import {
|
||||||
import { KEY_COMMAND } from './commands';
|
import { KEY_COMMAND } from './commands';
|
||||||
import Tablet, { initTabletNav } from './tablet';
|
import Tablet, { initTabletNav } from './tablet';
|
||||||
import { SplitContext } from './split';
|
import { SplitContext } from './split';
|
||||||
import { defaultHeader, onNavigationStateChange } from './utils/navigation';
|
import AppContainer from './AppContainer';
|
||||||
|
|
||||||
// App Stack
|
|
||||||
import AuthLoadingView from './views/AuthLoadingView';
|
|
||||||
|
|
||||||
// SetUsername Stack
|
|
||||||
import SetUsernameView from './views/SetUsernameView';
|
|
||||||
|
|
||||||
import OutsideStack from './stacks/OutsideStack';
|
|
||||||
import InsideStack from './stacks/InsideStack';
|
|
||||||
|
|
||||||
RNScreens.enableScreens();
|
RNScreens.enableScreens();
|
||||||
|
|
||||||
|
@ -58,60 +47,6 @@ const parseDeepLinking = (url) => {
|
||||||
return null;
|
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 {
|
export default class Root extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
|
@ -223,7 +158,7 @@ export default class Root extends React.Component {
|
||||||
render() {
|
render() {
|
||||||
const { split, themePreferences, theme } = this.state;
|
const { split, themePreferences, theme } = this.state;
|
||||||
|
|
||||||
let content = <App />;
|
let content = <AppContainer />;
|
||||||
|
|
||||||
if (isTablet) {
|
if (isTablet) {
|
||||||
const { inside, showModal } = this.state;
|
const { inside, showModal } = this.state;
|
||||||
|
|
|
@ -113,16 +113,7 @@ const restore = function* restore() {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const start = function* start({ root, text }) {
|
const start = function start() {
|
||||||
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 });
|
|
||||||
}
|
|
||||||
RNBootSplash.hide();
|
RNBootSplash.hide();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue