@applicaster/zapp-react-native-utils/localizationUtils/index.ts

Applicaster Zapp React Native utilities package

import * as R from "ramda";
import { ViewStyle } from "react-native";

import { useMemo } from "react";
import { getUILanguage } from "../appUtils/localizationsHelper";
import { utilsLogger } from "../logger";

export {
  getLocale,
  getLanguageCode,
  getCountryCode,
  getLocalizations,
  getUILanguage,
} from "../appUtils/localizationsHelper";

const RTL_LOCALES = [
  "ar", // Arabic
  "arc", // Aramaic
  "dv", // Divehi
  "fa", // Persian
  "ha", // Hausa
  "he", // Hebrew
  "iw", // Israel - required for android locales
  "khw", // Khowar
  "ks", // Kashmiri
  "ku", // Kurdish
  "ps", // Pashto
  "ur", // Urdu
  "yi", // Yiddish
];

export function useLocalizedStrings({ localizations }) {
  const languageCode = getUILanguage();

  // TODO: probably we can call getLocalizations here from localizationsHelper.js
  const result = useMemo(
    () =>
      localizations?.[languageCode] ||
      R.compose(R.head, R.filter(R.is(Object)), R.values)(localizations) ||
      {},
    [languageCode, localizations]
  );

  return result;
}

export function getIsRTL(): boolean {
  const uiLanguage = getUILanguage();

  if (!uiLanguage) {
    utilsLogger.error({ message: "getUILanguage returned null or undefined" });

    return false;
  }

  const [languageCode] = uiLanguage.split("-");

  const lowerCaseLanguageCode = languageCode.toLocaleLowerCase();

  const isRTL = R.contains(lowerCaseLanguageCode, RTL_LOCALES);

  return isRTL;
}

export function useIsRTL(): boolean {
  return getIsRTL();
}

export const applyRTLStylesIfNeeded = (
  styles: ViewStyle,
  isRTL: boolean
): ViewStyle => {
  if (isRTL) {
    return {
      ...styles,
      flexDirection: "row-reverse",
    };
  }

  return styles;
};