React navigation/native property doesn't exist on type props

I'm having troubles adding a prop to my page using React Navigation in my TypeScript React Native app. I have tried to follow the instructions in https://reactnavigation.org/docs/typescript, notably the Organizing types section, and created a navigationTypes.tsx file:

import { NativeStackScreenProps } from "@react-navigation/native-stack";

export type StackParamList = {
  Home: undefined;
  Admin: undefined;
  "Trail Screen": { trailID: number } | undefined;
};

export type StackNativeScreenProps<T extends keyof StackParamList> =
  NativeStackScreenProps<StackParamList, T>;

declare global {
  namespace ReactNavigation {
    interface ParamList extends StackParamList {}
  }
}

Here is the what I'm calling in the Trail Screen component:

import { StackNativeScreenProps } from "../interfaces/navigationTypes";

type Props = StackNativeScreenProps<"Trail Screen">;

export default function TrailScreen({ trailID, navigation }: Props) {

And here is how I'm calling my navigation in my App.tsx:

const Stack = createNativeStackNavigator<StackParamList>();

function App() {
  return (
      <NavigationContainer>
        <Stack.Navigator>
          <Stack.Screen name="Home" component={HomeScreen} />
          <Stack.Screen name="Admin" component={AdminLogin} />
          <Stack.Screen name="Trail Screen" component={TrailScreen} />
        </Stack.Navigator>
      </NavigationContainer>    
  );
}

If I try to add options or anything in to the Navigator, it just gives me more of the same error:

Property 'trailID' does not exist on type 'Props'.

My Home and Admin screens work fine with using the navigation prop. I'm just not sure what is wrong when I try to add an optional prop.