Incompatibility with expo-font plugin

[samuelbadru]

To avoid showing invisible icons on my app's initial load I decided to use the expo-font config plugin like below in my app.json

{
  "expo": {
    "plugins": [
      [
        "expo-font",
        {
          "fonts": [
            "node_modules/@expo/vector-icons/build/vendor/react-native-vector-icons/Fonts/Ionicons.ttf",
            "node_modules/@expo/vector-icons/build/vendor/react-native-vector-icons/Fonts/Fontisto.ttf"
          ]
        }
      ]
    ]
  }
}

This correctly creates Ionicons.ttf and Fontisto.ttf assets on android. However the fontName being used on the createIconSet for Ionicons is lowercase ionicons, in contrast to uppercase for Fontisto.

This results in fontIsLoaded incorrectly resolving to false for Ionicons and correctly resolving to true for Fontisto. In the isLoadedNative function from expo-font the fontFamily is ionicons and Fontisto, and the loadedNativeFonts has Ionicons and Fontisto.

Which leads to Ionicons still being loaded asynchronously despite being bundled, in contrast to Fontisto which correctly renders straight away. This causes a flicker where ionicons show the invisible fallback icon on the app's initial load, defeating the purpose of bundling fonts via the config plugin.

This mismatch in the fontName being used in the createIconSet occurs in multiple icons besides Ionicons. So the fix for this would be going through all the icons and ensuring the fontName being used in the createIconSet is in line with the file name/fontFamily name of the ttf files. Which I am happy to do if my deduction is correct and there isn't a reason it has been named these way.

Here is a list of the fontName used in for the createIconSet function for all the fonts

 LOG  [IconSet] Initializing: material-community
 LOG  [IconSet] Initializing: anticon
 LOG  [IconSet] Initializing: entypo
 LOG  [IconSet] Initializing: evilicons
 LOG  [IconSet] Initializing: feather
 LOG  [IconSet] Initializing: Fontisto
 LOG  [IconSet] Initializing: FontAwesome
 LOG  [IconSet] Initializing: FontAwesome5Free-Brand
 LOG  [IconSet] Initializing: FontAwesome5Free-Light
 LOG  [IconSet] Initializing: FontAwesome5Free-Regular
 LOG  [IconSet] Initializing: FontAwesome5Free-Solid
 LOG  [IconSet] Initializing: FontAwesome6Brands-Regular
 LOG  [IconSet] Initializing: FontAwesome6Free-Light
 LOG  [IconSet] Initializing: FontAwesome6Free-Regular
 LOG  [IconSet] Initializing: FontAwesome6Free-Solid
 LOG  [IconSet] Initializing: FontAwesome6Sharp-Regular
 LOG  [IconSet] Initializing: FontAwesome6Sharp-Light
 LOG  [IconSet] Initializing: FontAwesome6Sharp-Solid
 LOG  [IconSet] Initializing: FontAwesome6Duotone-Solid
 LOG  [IconSet] Initializing: FontAwesome6Free-Thin
 LOG  [IconSet] Initializing: foundation
 LOG  [IconSet] Initializing: ionicons
 LOG  [IconSet] Initializing: material
 LOG  [IconSet] Initializing: octicons
 LOG  [IconSet] Initializing: simple-line-icons
 LOG  [IconSet] Initializing: zocial