UNPKG

react-native-get-device-locale

Version:

react-native-get-device-locale is a lightweight and efficient React Native module that provides easy access to the device's locale.

103 lines (75 loc) 3.05 kB
# react-native-get-device-locale react-native-get-device-locale is a lightweight and efficient React Native module that provides easy access to the device's locale. Designed to work seamlessly with React Native’s new architecture, it replaces the now unreliable APIs (NativeModules.SettingsManager.settings.AppleLocale and similar) following recent updates in React Native. <br /> ## ✨ Features - Retrieve the device’s locale in `en_US`, `fr_FR` format. - Compatible with React Native >= 0.68, the new architecture (TurboModules) and backward compatibility with old arch. - Minimal setup with low resource usage. | Support | | | ----------- | -----------: | | react-native version | >=0.68 | | Android | ✅ | | iOS | ✅ | | New Architecture | ✅ | | Old Architecture | ✅ | <br /> ## 📦 Installation ```bash npm install react-native-get-device-locale ``` ## Additional Steps (iOS only) After installation, run the following command in your project’s ios directory: ```bash cd ios && pod install ``` <br /> ## 📖 Usage Example Here's how to use `react-native-get-device-locale to retrieve the device locale: ```tsx const deviceLocale = await getDeviceLocale("fr_FR"); // Optional default locale if fetching fails (en_US by default in case of error) ``` <details> <summary><h2>Minimal App demo:</h2></summary> ```tsx import { useState, useEffect } from 'react'; import { View, Text } from 'react-native'; import { getDeviceLocale } from 'react-native-get-device-locale'; export default function App() { const [locale, setLocale] = useState<string | null>(null); useEffect(() => { (async () => { const deviceLocale = await getDeviceLocale(); setLocale(deviceLocale); })(); }, []); return ( <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}> <Text>Device Locale: {locale}</Text> </View> ); } ``` </details> <br /> ## 💼 Use Cases This package serves as a replacement for deprecated native locale-fetching methods like: - `NativeModules.SettingsManager.settings.AppleLocale` - `NativeModules.SettingsManager.settings.AppleLanguages[0]` - `NativeModules.I18nManager.localeIdentifier` Which no longer work in React Native 0.76 and above. getDeviceLocale provides a reliable and modern way to access the device locale, compatible with the latest React Native architecture. <br /> ## 🔄 Roadmap and Future Features Planned additions: - Alternate locale formats (e.g., `en` or `en-US`). - Getting all the device locales if multiple. <br /> ## 🛠️ Contributing Contributions are welcome! We follow the [conventional commits](https://www.conventionalcommits.org/en/v1.0.0/) guidelines. To contribute: 1. Fork the repo. 2. Clone it and create a new branch. 3. Follow the commit message conventions. 4. Open a Pull Request! > 💡 Tip: Make sure your commit messages are in English for consistency! <br /> ## 📞 Support If you have questions or issues, feel free to open an issue on GitHub. I’ll stay active to respond to queries and provide support.