2019-08-07 10:24:35 +02:00
|
|
|
import * as React from 'react';
|
2020-03-05 10:29:15 +01:00
|
|
|
import {createStackNavigator, TransitionPresets} from '@react-navigation/stack';
|
|
|
|
import {createMaterialBottomTabNavigator} from "@react-navigation/material-bottom-tabs";
|
2019-08-07 10:24:35 +02:00
|
|
|
|
|
|
|
import HomeScreen from '../screens/HomeScreen';
|
2020-03-08 14:22:03 +01:00
|
|
|
import PlanningScreen from '../screens/Planning/PlanningScreen';
|
|
|
|
import PlanningDisplayScreen from '../screens/Planning/PlanningDisplayScreen';
|
2019-09-28 12:01:19 +02:00
|
|
|
import ProxiwashScreen from '../screens/Proxiwash/ProxiwashScreen';
|
2020-02-03 12:17:59 +01:00
|
|
|
import ProxiwashAboutScreen from '../screens/Proxiwash/ProxiwashAboutScreen';
|
2019-08-07 10:24:35 +02:00
|
|
|
import ProximoMainScreen from '../screens/Proximo/ProximoMainScreen';
|
2020-02-03 12:17:59 +01:00
|
|
|
import ProximoListScreen from "../screens/Proximo/ProximoListScreen";
|
|
|
|
import ProximoAboutScreen from "../screens/Proximo/ProximoAboutScreen";
|
2020-01-30 17:42:11 +01:00
|
|
|
import PlanexScreen from '../screens/Websites/PlanexScreen';
|
2020-03-05 21:48:37 +01:00
|
|
|
import {MaterialCommunityIcons} from "@expo/vector-icons";
|
2020-03-30 15:28:08 +02:00
|
|
|
import AsyncStorageManager from "../managers/AsyncStorageManager";
|
2020-04-02 10:07:20 +02:00
|
|
|
import HeaderButton from "../components/Custom/HeaderButton";
|
2020-03-08 00:33:08 +01:00
|
|
|
import {withTheme} from 'react-native-paper';
|
2020-03-08 13:01:12 +01:00
|
|
|
import i18n from "i18n-js";
|
|
|
|
|
2019-08-07 10:24:35 +02:00
|
|
|
|
|
|
|
const TAB_ICONS = {
|
2019-08-20 19:15:24 +02:00
|
|
|
Home: 'triangle',
|
2019-08-07 10:24:35 +02:00
|
|
|
Planning: 'calendar-range',
|
2020-03-08 10:37:01 +01:00
|
|
|
Proxiwash: 'tshirt-crew',
|
|
|
|
Proximo: 'cart',
|
|
|
|
Planex: 'clock',
|
2019-08-07 10:24:35 +02:00
|
|
|
};
|
|
|
|
|
2020-03-06 09:12:56 +01:00
|
|
|
const defaultScreenOptions = {
|
|
|
|
gestureEnabled: true,
|
|
|
|
cardOverlayEnabled: true,
|
|
|
|
...TransitionPresets.SlideFromRightIOS,
|
|
|
|
};
|
|
|
|
|
|
|
|
function getDrawerButton(navigation: Object) {
|
|
|
|
return (
|
2020-03-07 11:49:32 +01:00
|
|
|
<HeaderButton icon={'menu'} onPress={navigation.openDrawer}/>
|
2020-03-06 09:12:56 +01:00
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
const ProximoStack = createStackNavigator();
|
2020-03-05 23:40:50 +01:00
|
|
|
|
2020-03-05 10:29:15 +01:00
|
|
|
function ProximoStackComponent() {
|
|
|
|
return (
|
|
|
|
<ProximoStack.Navigator
|
|
|
|
initialRouteName="ProximoMainScreen"
|
2020-03-05 23:40:50 +01:00
|
|
|
headerMode="float"
|
2020-03-06 09:12:56 +01:00
|
|
|
screenOptions={defaultScreenOptions}
|
2020-03-05 10:29:15 +01:00
|
|
|
>
|
|
|
|
<ProximoStack.Screen
|
|
|
|
name="ProximoMainScreen"
|
2020-03-06 09:12:56 +01:00
|
|
|
options={({navigation}) => {
|
|
|
|
const openDrawer = getDrawerButton.bind(this, navigation);
|
|
|
|
return {
|
|
|
|
title: 'Proximo',
|
|
|
|
headerLeft: openDrawer
|
|
|
|
};
|
2020-03-05 23:40:50 +01:00
|
|
|
}}
|
2020-03-05 10:29:15 +01:00
|
|
|
component={ProximoMainScreen}
|
|
|
|
/>
|
|
|
|
<ProximoStack.Screen
|
|
|
|
name="ProximoListScreen"
|
2020-03-05 23:40:50 +01:00
|
|
|
options={{
|
|
|
|
title: 'Articles'
|
|
|
|
}}
|
2020-03-05 10:29:15 +01:00
|
|
|
component={ProximoListScreen}
|
|
|
|
/>
|
|
|
|
<ProximoStack.Screen
|
|
|
|
name="ProximoAboutScreen"
|
|
|
|
component={ProximoAboutScreen}
|
|
|
|
options={{
|
2020-03-05 23:40:50 +01:00
|
|
|
title: 'Proximo',
|
2020-03-05 10:29:15 +01:00
|
|
|
...TransitionPresets.ModalSlideFromBottomIOS,
|
|
|
|
}}
|
|
|
|
/>
|
|
|
|
</ProximoStack.Navigator>
|
|
|
|
);
|
|
|
|
}
|
2020-02-03 12:17:59 +01:00
|
|
|
|
2020-03-05 10:29:15 +01:00
|
|
|
const ProxiwashStack = createStackNavigator();
|
2020-02-03 12:17:59 +01:00
|
|
|
|
2020-03-05 10:29:15 +01:00
|
|
|
function ProxiwashStackComponent() {
|
|
|
|
return (
|
|
|
|
<ProxiwashStack.Navigator
|
|
|
|
initialRouteName="ProxiwashScreen"
|
2020-03-06 09:12:56 +01:00
|
|
|
headerMode='float'
|
|
|
|
screenOptions={defaultScreenOptions}
|
2020-03-05 10:29:15 +01:00
|
|
|
>
|
|
|
|
<ProxiwashStack.Screen
|
|
|
|
name="ProxiwashScreen"
|
|
|
|
component={ProxiwashScreen}
|
2020-03-06 09:12:56 +01:00
|
|
|
options={({navigation}) => {
|
|
|
|
const openDrawer = getDrawerButton.bind(this, navigation);
|
|
|
|
return {
|
|
|
|
title: 'Proxiwash',
|
|
|
|
headerLeft: openDrawer
|
|
|
|
};
|
|
|
|
}}
|
2020-03-05 10:29:15 +01:00
|
|
|
/>
|
|
|
|
<ProxiwashStack.Screen
|
|
|
|
name="ProxiwashAboutScreen"
|
|
|
|
component={ProxiwashAboutScreen}
|
2020-03-06 09:12:56 +01:00
|
|
|
options={{
|
|
|
|
title: 'Proxiwash',
|
|
|
|
...TransitionPresets.ModalSlideFromBottomIOS,
|
|
|
|
}}
|
2020-03-05 10:29:15 +01:00
|
|
|
/>
|
|
|
|
</ProxiwashStack.Navigator>
|
|
|
|
);
|
|
|
|
}
|
2020-02-04 14:42:19 +01:00
|
|
|
|
2020-03-05 10:29:15 +01:00
|
|
|
const PlanningStack = createStackNavigator();
|
2020-02-04 14:42:19 +01:00
|
|
|
|
2020-03-05 10:29:15 +01:00
|
|
|
function PlanningStackComponent() {
|
|
|
|
return (
|
|
|
|
<PlanningStack.Navigator
|
|
|
|
initialRouteName="PlanningScreen"
|
2020-03-06 09:12:56 +01:00
|
|
|
headerMode='float'
|
|
|
|
screenOptions={defaultScreenOptions}
|
2020-03-05 10:29:15 +01:00
|
|
|
>
|
|
|
|
<PlanningStack.Screen
|
|
|
|
name="PlanningScreen"
|
|
|
|
component={PlanningScreen}
|
2020-03-06 09:12:56 +01:00
|
|
|
options={({navigation}) => {
|
|
|
|
const openDrawer = getDrawerButton.bind(this, navigation);
|
|
|
|
return {
|
|
|
|
title: 'Planning',
|
|
|
|
headerLeft: openDrawer
|
|
|
|
};
|
|
|
|
}}
|
2020-03-05 10:29:15 +01:00
|
|
|
/>
|
|
|
|
<PlanningStack.Screen
|
|
|
|
name="PlanningDisplayScreen"
|
|
|
|
component={PlanningDisplayScreen}
|
2020-03-06 09:12:56 +01:00
|
|
|
options={{
|
|
|
|
title: 'Details',
|
|
|
|
...TransitionPresets.ModalSlideFromBottomIOS,
|
|
|
|
}}
|
2020-03-05 10:29:15 +01:00
|
|
|
/>
|
|
|
|
</PlanningStack.Navigator>
|
|
|
|
);
|
2019-09-12 23:02:28 +02:00
|
|
|
}
|
|
|
|
|
2020-03-05 10:29:15 +01:00
|
|
|
const HomeStack = createStackNavigator();
|
2019-09-12 23:02:28 +02:00
|
|
|
|
2020-03-05 10:29:15 +01:00
|
|
|
function HomeStackComponent() {
|
|
|
|
return (
|
|
|
|
<HomeStack.Navigator
|
|
|
|
initialRouteName="HomeScreen"
|
2020-03-05 23:40:50 +01:00
|
|
|
headerMode="float"
|
2020-03-06 09:12:56 +01:00
|
|
|
screenOptions={defaultScreenOptions}
|
2020-03-05 10:29:15 +01:00
|
|
|
>
|
|
|
|
<HomeStack.Screen
|
|
|
|
name="HomeScreen"
|
|
|
|
component={HomeScreen}
|
2020-03-06 09:12:56 +01:00
|
|
|
options={({navigation}) => {
|
|
|
|
const openDrawer = getDrawerButton.bind(this, navigation);
|
|
|
|
return {
|
2020-03-08 13:01:12 +01:00
|
|
|
title: i18n.t('screens.home'),
|
2020-03-06 09:12:56 +01:00
|
|
|
headerLeft: openDrawer
|
|
|
|
};
|
|
|
|
}}
|
2020-03-05 10:29:15 +01:00
|
|
|
/>
|
|
|
|
<HomeStack.Screen
|
|
|
|
name="PlanningDisplayScreen"
|
|
|
|
component={PlanningDisplayScreen}
|
2020-03-06 09:12:56 +01:00
|
|
|
options={{
|
|
|
|
title: 'Details',
|
|
|
|
...TransitionPresets.ModalSlideFromBottomIOS,
|
|
|
|
}}
|
2020-03-05 10:29:15 +01:00
|
|
|
/>
|
|
|
|
</HomeStack.Navigator>
|
|
|
|
);
|
|
|
|
}
|
2019-08-07 10:24:35 +02:00
|
|
|
|
2020-03-06 09:12:56 +01:00
|
|
|
const PlanexStack = createStackNavigator();
|
|
|
|
|
|
|
|
function PlanexStackComponent() {
|
|
|
|
return (
|
|
|
|
<PlanexStack.Navigator
|
|
|
|
initialRouteName="HomeScreen"
|
|
|
|
headerMode="float"
|
|
|
|
screenOptions={defaultScreenOptions}
|
|
|
|
>
|
|
|
|
<PlanexStack.Screen
|
|
|
|
name="PlanexScreen"
|
|
|
|
component={PlanexScreen}
|
|
|
|
options={({navigation}) => {
|
|
|
|
const openDrawer = getDrawerButton.bind(this, navigation);
|
|
|
|
return {
|
|
|
|
title: 'Planex',
|
|
|
|
headerLeft: openDrawer
|
|
|
|
};
|
|
|
|
}}
|
|
|
|
/>
|
|
|
|
</PlanexStack.Navigator>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
2020-03-05 10:29:15 +01:00
|
|
|
const Tab = createMaterialBottomTabNavigator();
|
|
|
|
|
2020-03-08 00:33:08 +01:00
|
|
|
function TabNavigator(props) {
|
|
|
|
const {colors} = props.theme;
|
2020-03-05 10:29:15 +01:00
|
|
|
return (
|
|
|
|
<Tab.Navigator
|
2020-03-05 10:40:25 +01:00
|
|
|
initialRouteName={AsyncStorageManager.getInstance().preferences.defaultStartScreen.current}
|
2020-03-08 00:33:08 +01:00
|
|
|
barStyle={{backgroundColor: colors.surface}}
|
2020-03-05 21:48:37 +01:00
|
|
|
screenOptions={({route}) => ({
|
|
|
|
tabBarIcon: ({focused, color, size}) => {
|
2020-03-05 10:29:15 +01:00
|
|
|
let icon = TAB_ICONS[route.name];
|
|
|
|
// tintColor is ignoring activeColor and inactiveColor for some reason
|
2020-03-08 10:37:01 +01:00
|
|
|
icon = focused ? icon : icon + ('-outline');
|
2020-03-08 11:35:11 +01:00
|
|
|
return <MaterialCommunityIcons name={icon} color={color} size={26}/>;
|
2020-03-05 10:29:15 +01:00
|
|
|
},
|
|
|
|
})}
|
2020-03-08 11:35:11 +01:00
|
|
|
activeColor={colors.primary}
|
|
|
|
inactiveColor={colors.tabIcon}
|
2020-03-05 10:29:15 +01:00
|
|
|
>
|
|
|
|
<Tab.Screen
|
|
|
|
name="Proximo"
|
|
|
|
component={ProximoStackComponent}
|
|
|
|
/>
|
|
|
|
<Tab.Screen
|
|
|
|
name="Planning"
|
|
|
|
component={PlanningStackComponent}
|
|
|
|
/>
|
|
|
|
<Tab.Screen
|
|
|
|
name="Home"
|
|
|
|
component={HomeStackComponent}
|
2020-03-08 13:01:12 +01:00
|
|
|
options={{title: i18n.t('screens.home')}}
|
2020-03-05 10:29:15 +01:00
|
|
|
/>
|
|
|
|
<Tab.Screen
|
|
|
|
name="Proxiwash"
|
|
|
|
component={ProxiwashStackComponent}
|
|
|
|
/>
|
|
|
|
<Tab.Screen
|
|
|
|
name="Planex"
|
2020-03-06 09:12:56 +01:00
|
|
|
component={PlanexStackComponent}
|
2020-03-05 10:29:15 +01:00
|
|
|
/>
|
|
|
|
</Tab.Navigator>
|
|
|
|
);
|
|
|
|
}
|
2020-03-08 00:33:08 +01:00
|
|
|
|
|
|
|
export default withTheme(TabNavigator);
|