application-amicale/App.js

139 lines
4.5 KiB
JavaScript
Raw Normal View History

// @flow
import * as React from 'react';
import {Platform, StatusBar} from 'react-native';
import {Root, StyleProvider} from 'native-base';
2019-06-25 22:20:24 +02:00
import LocaleManager from './utils/LocaleManager';
import * as Font from 'expo-font';
import {clearThemeCache} from 'native-base-shoutem-theme';
import AsyncStorageManager from "./utils/AsyncStorageManager";
import CustomIntroSlider from "./components/CustomIntroSlider";
2020-03-05 10:29:15 +01:00
import {SplashScreen} from 'expo';
import NotificationsManager from "./utils/NotificationsManager";
import ThemeManager from './utils/ThemeManager';
2020-03-05 10:29:15 +01:00
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
import DrawerNavigator from './navigation/DrawerNavigator';
import { enableScreens } from 'react-native-screens';
type Props = {};
type State = {
isLoading: boolean,
showIntro: boolean,
showUpdate: boolean,
currentTheme: ?Object,
};
2020-03-05 10:29:15 +01:00
const Stack = createStackNavigator();
export default class App extends React.Component<Props, State> {
2019-06-25 22:16:14 +02:00
state = {
isLoading: true,
showIntro: true,
showUpdate: true,
currentTheme: null,
};
2019-06-25 22:20:24 +02:00
constructor(props: Object) {
2019-06-25 22:20:24 +02:00
super(props);
LocaleManager.initTranslations();
enableScreens();
2019-06-25 22:20:24 +02:00
}
/**
* Updates the theme and clears the cache to force reloading the app colors. Need to edit shoutem theme for ti to work
*/
updateTheme() {
this.setState({
currentTheme: ThemeManager.getCurrentTheme()
});
this.setupStatusBar();
clearThemeCache();
}
setupStatusBar() {
if (Platform.OS === 'ios') {
if (ThemeManager.getNightMode()) {
StatusBar.setBarStyle('light-content', true);
} else {
StatusBar.setBarStyle('dark-content', true);
}
}
}
/**
* Callback when user ends the intro. Save in preferences to avaoid showing back the introSlides
*/
onIntroDone() {
this.setState({
showIntro: false,
showUpdate: false,
});
AsyncStorageManager.getInstance().savePref(AsyncStorageManager.getInstance().preferences.showIntro.key, '0');
2020-02-01 20:58:13 +01:00
AsyncStorageManager.getInstance().savePref(AsyncStorageManager.getInstance().preferences.showUpdate5.key, '0');
}
2020-03-05 10:29:15 +01:00
async componentDidMount() {
await this.loadAssetsAsync();
}
async loadAssetsAsync() {
// Wait for custom fonts to be loaded before showing the app
2020-03-05 10:29:15 +01:00
console.log("loading Fonts");
SplashScreen.preventAutoHide();
2019-06-25 22:20:24 +02:00
await Font.loadAsync({
'Roboto_medium': require('native-base/Fonts/Roboto_medium.ttf'),
});
2020-03-05 10:29:15 +01:00
console.log("loading preferences");
await AsyncStorageManager.getInstance().loadPreferences();
ThemeManager.getInstance().setUpdateThemeCallback(() => this.updateTheme());
2020-03-05 10:29:15 +01:00
console.log("loading Expo token");
await NotificationsManager.initExpoToken();
2020-03-05 10:29:15 +01:00
console.log("loaded");
this.onLoadFinished();
}
onLoadFinished() {
2020-03-05 10:29:15 +01:00
console.log("finished");
// Only show intro if this is the first time starting the app
2019-06-25 22:20:24 +02:00
this.setState({
isLoading: false,
currentTheme: ThemeManager.getCurrentTheme(),
showIntro: AsyncStorageManager.getInstance().preferences.showIntro.current === '1',
2020-02-01 20:58:13 +01:00
showUpdate: AsyncStorageManager.getInstance().preferences.showUpdate5.current === '1'
2019-06-25 22:20:24 +02:00
});
// Status bar goes dark if set too fast
2020-03-05 10:29:15 +01:00
setTimeout(this.setupStatusBar, 1000);
SplashScreen.hide();
2019-06-25 22:20:24 +02:00
}
/**
* Renders the app based on loading state
*/
2019-06-25 22:20:24 +02:00
render() {
2020-03-05 10:29:15 +01:00
console.log("render");
2019-06-25 22:20:24 +02:00
if (this.state.isLoading) {
2020-03-05 10:29:15 +01:00
return null;
} else if (this.state.showIntro || this.state.showUpdate) {
2020-02-11 01:05:24 +01:00
return <CustomIntroSlider onDone={this.onIntroDone}
isUpdate={this.state.showUpdate && !this.state.showIntro}/>;
} else {
2020-03-05 10:29:15 +01:00
return (
<Root>
<StyleProvider style={this.state.currentTheme}>
2020-03-05 10:29:15 +01:00
<NavigationContainer>
<Stack.Navigator headerMode="none">
<Stack.Screen name="Root" component={DrawerNavigator} />
</Stack.Navigator>
</NavigationContainer>
</StyleProvider>
</Root>
);
}
2019-06-25 22:20:24 +02:00
}
}