React-Nav-Melon/navigation/SettingsPageNavigator.js

import React from 'react'
import { createNativeStackNavigator } from '@react-navigation/native-stack'
import SettingsPage from '../screens/SettingsPage';
import EditProfilePage from '../screens/EditProfilePage';
import SecurityPage from '../screens/SecurityPage';
import NotificationSettingsPage from '../screens/NotificationSettingsPage';
import HelpPageNavigator from './HelpPageNavigator';

const Stack = createNativeStackNavigator();
const SettingsPageNavigator = ({ route, navigation}) => {
    return (
        <Stack.Navigator
            initialRouteName='SettingsMenu'
        >
            <Stack.Screen
                name="SettingsMenu"
                options={(navigation) => ({
                    headerShown: false
                })}
                component={SettingsPage}
            />
            <Stack.Screen
                name="EditProfile"
                options={(navigation) => ({
                    headerShown: false
                })}
                component={EditProfilePage}
            />
            <Stack.Screen
                name="Notification"
                options={(navigation) => ({
                    headerShown: false
                })}
                component={NotificationSettingsPage}
            />
            <Stack.Screen
                name="Security"
                options={(navigation) => ({
                    headerShown: false
                })}
                component={SecurityPage}
            />
            <Stack.Screen
                name="InviteFriends"
                options={(navigation) => ({
                    headerShown: false
                })}
                component={EditProfilePage}
            />
            <Stack.Screen
                name="Help"
                options={(navigation) => ({
                    headerShown: false
                })}
                component={HelpPageNavigator}
            />
            <Stack.Screen
                name="DarkMode"
                options={(navigation) => ({
                    headerShown: false
                })}
                component={EditProfilePage}
            />
            <Stack.Screen
                name="LogOut"
                options={(navigation) => ({
                    headerShown: false
                })}
                component={EditProfilePage}
            />
        </Stack.Navigator>
    )
}

export default SettingsPageNavigator;