react-native icon indicating copy to clipboard operation
react-native copied to clipboard

RTL language switch not working properly on android

Open mukti107 opened this issue 1 month ago • 2 comments

Description

Seems to be caused by this PR: https://github.com/facebook/react-native/pull/53417

Locale.getAvailableLocales()[0] This gets the first locale in the list of ALL available locales installed on the device, not the current/preferred language. This is incorrect.

It should be using one of these instead: Locale.getDefault() – the system's default locale context.resources.configuration.locales[0] – the app's current locale (respects per-app language on Android 13+)

Steps to reproduce

Set app local config with LTR and RTL langauge

switch to arabic language from app setting open app, layout is still LTR, expexted to be RTL

React Native Version

0.82.1

Affected Platforms

Runtime - Android

Output of npx @react-native-community/cli info

System:
  OS: macOS 26.1
  CPU: (8) arm64 Apple M1
  Memory: 129.64 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 22.19.0
    path: /opt/homebrew/bin/node
  Yarn: Not Found
  npm:
    version: 10.9.3
    path: /opt/homebrew/bin/npm
  Watchman: Not Found
Managers:
  CocoaPods:
    version: 1.16.2
    path: /opt/homebrew/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 25.2
      - iOS 26.2
      - macOS 26.2
      - tvOS 26.2
      - visionOS 26.2
      - watchOS 26.2
  Android SDK: Not Found
IDEs:
  Android Studio: 2025.1 AI-251.27812.49.2514.14217341
  Xcode:
    version: 26.2/17C52
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 18.0.2
    path: /usr/bin/javac
  Ruby:
    version: 3.4.6
    path: /opt/homebrew/opt/ruby/bin/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 20.0.0
    wanted: 20.0.0
  react:
    installed: 19.1.1
    wanted: 19.1.1
  react-native:
    installed: 0.82.1
    wanted: 0.82.1
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: true
  newArchEnabled: true

Stacktrace or Logs

N/A

MANDATORY Reproducer

N/A

Screenshots and Videos

No response

mukti107 avatar Dec 19 '25 01:12 mukti107

[!WARNING] Missing reproducer: We could not detect a reproducible example in your issue report. Reproducers are mandatory and we can accept only one of those as a valid reproducer:


You can read more about about it on our website: How to report a bug.

react-native-bot avatar Dec 19 '25 01:12 react-native-bot

for anyone facing the same issue here is how I get it to work for now by updating MainActivity

class MainActivity : ReactActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
    applyRTLPatch()

    super.onCreate(null)
  }

  /**
   * https://github.com/facebook/react-native/issues/54938
   * Detects if the current device locale is RTL (Arabic, Hebrew, Persian, etc.)
   * and forces RTL layout direction accordingly.
   * Uses resources.configuration.locales to respect per-app language settings (Android 13+).
   */
  private fun applyRTLPatch() {
    val currentLocale = resources.configuration.locales[0]
    val isRTL = TextUtilsCompat.getLayoutDirectionFromLocale(currentLocale) == View.LAYOUT_DIRECTION_RTL
    val i18nUtil = I18nUtil.instance
    i18nUtil.allowRTL(this, true)
    i18nUtil.forceRTL(this, isRTL)
  }
}

mukti107 avatar Dec 19 '25 02:12 mukti107