control-tower/App.js at main · Esspfa/control-tower · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
import React, {useState, useEffect} from 'react';
import {View, Text, StyleSheet, Image, TouchableOpacity} from 'react-native';
import {NavigationContainer} from '@react-navigation/native';
import {createNativeStackNavigator} from '@react-navigation/native-stack';
import MaterialTop from './src/TopBar/MaterialTop';
import Splash from './src/Startup/Splash';
import Welcome from './src/Startup/Welcome';
import Accepted_Job_Details from './src/Job_details/AcceptedJobDetails';
import Job_Details from './src/Job_details/JobDetails';
import account from './assets/image/account.png';
import Account from './src/Profie/Account';
import Togglebutton from './src/component/common/togglebutton';

const Stack = createNativeStackNavigator();

function App() {
  const [showSplashScreen, setshowSplashScreen] = useState(true);

  useEffect(() => {
    setTimeout(() => {
      setshowSplashScreen(false);
    }, 4000);
  }, []);

  return (
    <NavigationContainer>
      <Stack.Navigator screenOptions={{headerTitleAlign: 'center'}}>
        {showSplashScreen ? (
          <Stack.Screen
            name="Splash"
            component={Splash}
            options={{headerShown: false}}
          />
        ) : null}
        <Stack.Screen
          name="Welcome"
          options={{headerShown: false}}
          component={Welcome}
        />
        <Stack.Screen
          name="Control Tower"
          options={({navigation}) => ({
            headerLeft: () => (
              <TouchableOpacity
                onPress={() => {
                  navigation.navigate('My Account');
                }}>
                <Image style={{width: 32, height: 32}} source={account} />
              </TouchableOpacity>
            ),
            headerStyle: {
              backgroundColor: '#095D82',
            },
            headerTintColor: '#fff',
            headerTitleStyle: {
              fontWeight: 'bold',
            },
            headerRight: () => <Togglebutton />,
          })}
          component={MaterialTop}
        />

        <Stack.Screen
          name="Job_Details"
          options={() => ({
            headerStyle: {
              backgroundColor: '#095D82',
            },
            headerTintColor: '#fff',
            headerTitleStyle: {
              fontWeight: 'bold',
            },
            headerRight: () => <Togglebutton />,
          })}
          component={Job_Details}
        />
        <Stack.Screen
          name="Accepted_Job_Details"
          component={Accepted_Job_Details}
        />

        <Stack.Screen
          name="My Account"
          options={() => ({
            headerStyle: {
              backgroundColor: '#095D82',
            },
            headerTintColor: '#fff',
            headerTitleStyle: {
              fontWeight: 'bold',
            },
            headerRight: () => <Togglebutton />,
          })}
          component={Account}
        />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

export default App;