why does useFonts hook worked on Android but not on iOS using React Native?

I'm trying to use a custom Font on React Native using useFonts hook. This component works perfectly on Android but doesn't render anything on iOS. I've also tried Font.loadAsync but that too didn't render anything. Thoughts? (edit: iOS is on version 15.2)

import { Text } from 'react-native';
import { useFonts } from 'expo-font';

export default function AppText({ children, size, color, fontFamily }) {

  const [fontsLoaded] = useFonts({
    'Montserrat-Regular': require('../../assets/fonts/Montserrat-Regular.ttf'),
    'Montserrat-Medium': require('../../assets/fonts/Montserrat-Medium.ttf'),
    'Montserrat-SemiBold': require('../../assets/fonts/Montserrat-SemiBold.ttf'),
    'Montserrat-Bold': require('../../assets/fonts/Montserrat-Bold.ttf'),
    'Montserrat-Black': require('../../assets/fonts/Montserrat-Black.ttf'),
    'Montserrat-Light': require('../../assets/fonts/Montserrat-Light.ttf'),
  });

  if (!fontsLoaded) {
    return null;
  }

  return (
    <Text 
      style={{
        fontFamily: fontFamily || 'Montserrat-Regular',
        fontSize: size || 16,
        color: color || 'black',
      }}
    >
      {children}
    </Text>
  )
}