mobileapp/navigation/RegistrationStackNavigator.js

import 'react-native-gesture-handler';
import React from 'react';
import { createStackNavigator } from '@react-navigation/stack';
import { DefaultTheme, Provider } from 'react-native-paper'
import RegisterCredentials from '../screens/RegisterCredentials';
import RegisterMeasurements from '../screens/RegisterMeasurements';
import { RegistrationFormProvider } from '../contexts/RegisterContext';
import RegisterImage from '../screens/RegisterImage';
import RegisterResult from '../screens/RegistrationResult';

const RegistrationStack = createStackNavigator();
const theme = {
  ...DefaultTheme,
  colors: {
    primary: '#df3f3f',
    accent: 'white',
  },
}

const RegistrationStackNavigator = () => {
  return(
        <RegistrationFormProvider>
          <RegistrationStack.Navigator screenOptions={{
              headerTransparent: true,
              headerTintColor: 'white',
              headerTitle: ""
            }} initialRouteName="Map">
            <Stack.Screen name="Credentials" component={RegisterCredentials} />
            <Stack.Screen name="Measurements" component={RegisterMeasurements} />
            <Stack.Screen name="RegisterImage" component={RegisterImage} />
            <Stack.Screen name="RegisterResult" component={RegisterResult} />
          </RegistrationStack.Navigator>
        </RegistrationFormProvider>
  )
}

export default RegistrationStackNavigator;