I have no idea how that works in react but under the assumption that the lang attribute changes properly you could do this in CSS:

html {
    font-family: your-latin-font
}
html[lang*=ar] {
    font-family: your-arabic-font
}

I don't think you can set a global font-family we have a similar thing in our app we just created a custom component for text so that we don't have to set font-family in every Text component.

I am sharing coding for our component you can tweak it to use in JS and use it instead of Text if you like this solution.

import { observer } from 'mobx-react';
import React from 'react';
import { Text, TextProps } from 'react-native';
import { useStores } from '../stores/rootStore';

type OwnProps = {
  RTLAlign?: boolean;
};

export const AppText = observer((props: TextProps & OwnProps) => {
  const { settingsStore } = useStores();
  const { style, ...rest } = props;
  return (
    <Text
      allowFontScaling={false}
      // eslint-disable-next-line react/jsx-props-no-spreading
      {...rest}
      style={[
        {
          fontFamily: settingsStore.font // Set condition for font family based on language
        },
        style
      ]}
    />
  );
});