function useFontLoading()

in fusion-plugin-font-loader-react/src/use-font-loading.js [15:47]

• 29 lines of code
• 6 McCabe index (conditional complexity)

function useFontLoading(fontName: string) {
  const mounted = useRef<?boolean>(null);
  const getFontDetails = useService(FontLoaderReactToken);
  if (typeof getFontDetails !== 'function') {
    throw new Error(
      `useFontLoading not supported. This might be because you set \`withStyleOverloads\`
    to true in the font loader config`
    );
  }
  const {fallbackName, styles} = getFontDetails(fontName);
  const initialFontStyles = fallbackName
    ? // switch to fallback name and apply styles to trigger faux font rendition
      {fontFamily: fallbackName, ...styles}
    : // no fallback so just apply true font
      {fontFamily: fontName};

  const [fontStyles, setFontStyles] = useState(initialFontStyles);

  useEffect(() => {
    mounted.current = true;
    if (fontStyles.fontFamily !== fontName) {
      // Promise.resolve() case is for hypothetcial server call (to keep flow happy)
      (loadFont(fontName) || Promise.resolve()).then(() => {
        mounted && setFontStyles({fontFamily: fontName});
      });
    }
    return () => {
      mounted.current = false;
    };
  });

  return fontStyles;
}