Listen for route change to update sidebar

This commit is contained in:
Arnaud Vergnet 2020-04-05 20:32:11 +02:00
parent fd3f6393fe
commit f1b5a767ba
2 changed files with 23 additions and 27 deletions

View file

@ -151,7 +151,8 @@ class SideBar extends React.Component<Props, State> {
},
];
this.colors = props.theme.colors;
ConnectionManager.getInstance().addLoginStateListener((value) => this.onLoginStateChange(value));
ConnectionManager.getInstance().addLoginStateListener(this.onLoginStateChange);
this.props.navigation.addListener('state', this.onRouteChange);
this.state = {
isLoggedIn: ConnectionManager.getInstance().isLoggedIn(),
dialogVisible: false,
@ -159,14 +160,27 @@ class SideBar extends React.Component<Props, State> {
};
}
onRouteChange = (event) => {
if (event.data.state.routes !== undefined) {
const route = event.data.state.routes[0]; // get the current route (ROOT)
if (route.state !== undefined) {
const state = route.state; // Get the Drawer's state if it exists
// Get the current route name. This will only show Drawer routes.
// Tab routes will be shown as 'Main'
const routeName = state.routeNames[state.index];
if (this.state.activeRoute !== routeName)
this.setState({activeRoute: routeName});
}
}
};
showDisconnectDialog = () => this.setState({dialogVisible: true});
hideDisconnectDialog = () => this.setState({dialogVisible: false});
onLoginStateChange(isLoggedIn: boolean) {
this.setState({isLoggedIn: isLoggedIn});
}
onLoginStateChange = (isLoggedIn: boolean) => this.setState({isLoggedIn: isLoggedIn});
/**
* Callback when a drawer item is pressed.
@ -179,10 +193,8 @@ class SideBar extends React.Component<Props, State> {
openBrowser(item.link, this.colors.primary);
else if (item.action !== undefined)
item.action();
else {
else
this.props.navigation.navigate(item.route);
this.setState({activeRoute: item.route});
}
}
/**

View file

@ -37,10 +37,6 @@ type Props = {
*/
class HomeScreen extends React.Component<Props> {
onProxiwashClick: Function;
onTutorInsaClick: Function;
onMenuClick: Function;
onProximoClick: Function;
getRenderItem: Function;
createDataset: Function;
@ -50,10 +46,6 @@ class HomeScreen extends React.Component<Props> {
constructor(props) {
super(props);
this.onProxiwashClick = this.onProxiwashClick.bind(this);
this.onTutorInsaClick = this.onTutorInsaClick.bind(this);
this.onMenuClick = this.onMenuClick.bind(this);
this.onProximoClick = this.onProximoClick.bind(this);
this.getRenderItem = this.getRenderItem.bind(this);
this.createDataset = this.createDataset.bind(this);
this.colors = props.theme.colors;
@ -101,21 +93,13 @@ class HomeScreen extends React.Component<Props> {
/>;
};
onProxiwashClick() {
this.props.navigation.navigate('Proxiwash');
}
onProxiwashClick = () => this.props.navigation.navigate('Proxiwash');
onTutorInsaClick() {
openBrowser("https://www.etud.insa-toulouse.fr/~tutorinsa/", this.colors.primary);
}
onTutorInsaClick = () => openBrowser("https://www.etud.insa-toulouse.fr/~tutorinsa/", this.colors.primary);
onProximoClick() {
this.props.navigation.navigate('Proximo');
}
onProximoClick = () => this.props.navigation.navigate('Proximo');
onMenuClick() {
this.props.navigation.navigate('SelfMenuScreen');
}
onMenuClick = () => this.props.navigation.navigate('SelfMenuScreen');
/**
* Creates the dataset to be used in the FlatList