aswi2023one-team-to-rule-them-all-gitlab/src/pages/Navigation.tsx @ 7410d6c1

import {createNativeStackNavigator} from "@react-navigation/native-stack"
import {NavigationContainer} from "@react-navigation/native"
import {IconButton, Stack} from "native-base"
import {AntDesign} from "@expo/vector-icons"
import {createDrawerNavigator} from "@react-navigation/drawer"
import {useSelector} from "react-redux"
import {RootState} from "../stores/store"
import {nativeBaseTheme} from "../theme/nativeBaseTheme"
import HomePage from "./HomePage"
import LoginPage from "./LoginPage"
import SearchPage from "./SearchPage"
import Logout from "./Logout"
import ItemViewPage from "./ItemViewPage"
import NotesViewPage from "./NotesViewPage"

export type RootStackParamList = {
    Home: undefined,
    Search: { inventoryId: string | null },
    Logout: undefined,
    Item: { itemId: string },
    Login: undefined,
    Notes: undefined,
}

const Navigation = () => {
    const Stack = createNativeStackNavigator<RootStackParamList>()
    const loggedIn = useSelector((state: RootState) => state.user.loggedIn)

    return (
        <NavigationContainer>
            <Stack.Navigator initialRouteName="Home"
                              screenOptions={({navigation}) => ({
                                  headerStyle: {
                                      backgroundColor: nativeBaseTheme.colors.primary[800],
                                  },
                                  headerTintColor: '#fff',
                                  headerTitleStyle: {
                                      fontWeight: 'bold',
                                  },
                                  headerRight: () => (
                                      <IconButton
                                          onPress={() => navigation.navigate("Search", {inventoryId: null})}
                                          title="Info"
                                          color="#fff"
                                          _icon={{
                                              as: AntDesign,
                                              name: "search1",
                                              color: "white"
                                          }}
                                      />
                                  ),
                              })}
            >
                {loggedIn ? (
                    <>
                        <Stack.Screen
                            name="Home"
                            component={HomePage}
                            options={{
                                title: 'My home'
                            }}
                        />
                        <Stack.Screen
                            name="Search"
                            component={SearchPage}
                            initialParams={{inventoryId: null}}
                        />
                        <Stack.Screen
                            name={"Notes"}
                            component={NotesViewPage}
                        />
                        <Stack.Screen
                            name="Logout"
                            component={Logout}
                        />
                        <Stack.Screen
                            name={"Item"}
                            component={ItemViewPage}
                        />
                    </>
                ) : (
                    <Stack.Screen
                        name="Login"
                        component={LoginPage}
                        options={({navigation}) => ({
                            headerRight: () => (
                                <></>
                            )
                        })}
                    />
                )}
            </Stack.Navigator>
        </NavigationContainer>
    )

}

export default Navigation