I am unable to pass params to a route using React Navigation

I have a button on the header to activate EDIT mode on a page, or SAVE when edit mode is done.

type TabProfileParamList = {  ProfileScreen: { isEditing: boolean };};const TabFourStack = createStackNavigator<TabProfileParamList>();function ProfileNavigator1() {  const r = useRoute();  const n = useNavigation();  return (<TabFourStack.Navigator><TabFourStack.Screen        initialParams={{ isEditing: false }}        name="ProfileScreen"        component={ProfileScreen}        options={{          headerRight: () => (<MyBtn              buttonStyle={{ padding: 0 }}              text={r.params.isEditing ? "Save" : "Edit"}              onPress={() => {                n.setParams({ isEditing: !r.params.isEditing });              }}            />          ),        }}      /></TabFourStack.Navigator>  );}

On the lines containing r.params.isEditing I am getting I place the cursor on top of .params:

Object is possibly 'undefined'.ts(2532)

And top of .isEditing:

Property 'isEditing' does not exist on type 'object'.ts(2339)

And here where I need it:

export function ProfileScreen1(): JSX.Element {  const r = useRoute();  return (<ScrollView style={styles.container}>      {r.params.isEditing ? <MembershipScreen /> : <ProfileContent />}</ScrollView>  );}

So, every time I click on the SAVE/EDIT button, the app crashes.

I would like to know what I am doing wrong