ios – forceRTL not changing text alignment when xcode project localization is set to english

Following this tutorial https://shiharadilshan.medium.com/rtl-right-to-left-support-with-internationalization-for-react-native-applications-7ca69e8b68e5
I am testing RTL on iOS

import React, { useEffect } from 'react';
import RNRestart from 'react-native-restart'; 
import {Button, DevSettings, I18nManager, StyleSheet, Text, View} from 'react-native';
import './i18n';
import {useTranslation} from 'react-i18next';

const App = () => {
  const {t, i18n} = useTranslation();
  return (
    <View style={styles.container}>
      <Text style={styles.text}>{t('dummy_text')}</Text>
      <View style={styles.innerView}>
        <View style={styles.innerViewContainer1}>
          <Text>{t('viewText1')}</Text>
        </View>
        <View style={styles.innerViewContainer2}>
          <Text>{t('viewText2')}</Text>
        </View>
      </View>
      <Button
        title={t('changeLngBtn')}
        onPress={() => {
          console.log(i18n.language)
            i18n
              .changeLanguage(i18n.language === 'ar' ? 'en' : 'ar')
              .then(() => {
                console.log(i18n.language)
                I18nManager.allowRTL(i18n.language === 'ar' ? true : false);
                I18nManager.forceRTL(i18n.language === 'ar' ? true : false);
                console.log(i18n.language === 'ar' ? true : false)
                RNRestart.restart();
              })
              .catch(err => {
                console.log('something went wrong while applying RTL');
              });
          }}
      />
    </View>
  );
};

export default App;

the code above changes the language and RTL

but the alignment is not changing.
unless Arabic is set to default in xcode then its is always RTL

the appDelegate.m has
[[RCTI18nUtil sharedInstance] allowRTL:YES];

what am I missing?