diff --git a/packages/app/components/setLanguage.component.tsx b/packages/app/components/setLanguage.component.tsx index 944b6092..fffca3ed 100644 --- a/packages/app/components/setLanguage.component.tsx +++ b/packages/app/components/setLanguage.component.tsx @@ -11,11 +11,12 @@ import React, { useState } from 'react' import { SafeAreaView, StyleSheet, View } from 'react-native' import { TouchableOpacity } from 'react-native-gesture-handler' import { useLanguage } from '../hooks/useLanguage' -import { LanguageService } from '../services/languageService' +import { isRTL, LanguageService } from '../services/languageService' import { Colors, Layout as LayoutStyle, Sizing } from '../styles' import { translate } from '../utils/translation' import { BackIcon } from './icon.component' import { SafeAreaViewContainer } from './safeAreaViewContainer.component' +import RNRestart from 'react-native-restart' export const SetLanguage = () => { const navigation = useNavigation() @@ -27,9 +28,19 @@ export const SetLanguage = () => { ) const { setLanguageCode } = useLanguage() + const shouldRestart = () => { + return isRTL(selectedLanguage) || isRTL(currentLanguage) + } + const saveLanguage = () => { setLanguageCode({ languageCode: selectedLanguage }) - goBack() + + // Checks if rtl mode has changed, then we need to restart the app + if (shouldRestart()) { + RNRestart.Restart() + } else { + goBack() + } } const isSelected = (lang: string): boolean => { diff --git a/packages/app/ios/Podfile.lock b/packages/app/ios/Podfile.lock index a78fb4d9..0923c574 100644 --- a/packages/app/ios/Podfile.lock +++ b/packages/app/ios/Podfile.lock @@ -272,6 +272,8 @@ PODS: - React - react-native-cookies (5.0.1): - React-Core + - react-native-restart (0.0.22): + - React-Core - react-native-safe-area-context (3.2.0): - React-Core - react-native-simple-toast (1.1.3): @@ -406,6 +408,7 @@ DEPENDENCIES: - React-jsinspector (from `../node_modules/react-native/ReactCommon/jsinspector`) - "react-native-blur (from `../node_modules/@react-native-community/blur`)" - "react-native-cookies (from `../node_modules/@react-native-community/cookies`)" + - react-native-restart (from `../node_modules/react-native-restart`) - react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`) - react-native-simple-toast (from `../node_modules/react-native-simple-toast`) - react-native-webview (from `../node_modules/react-native-webview`) @@ -483,6 +486,8 @@ EXTERNAL SOURCES: :path: "../node_modules/@react-native-community/blur" react-native-cookies: :path: "../node_modules/@react-native-community/cookies" + react-native-restart: + :path: "../node_modules/react-native-restart" react-native-safe-area-context: :path: "../node_modules/react-native-safe-area-context" react-native-simple-toast: @@ -562,6 +567,7 @@ SPEC CHECKSUMS: React-jsinspector: 0ae35a37b20d5e031eb020a69cc5afdbd6406301 react-native-blur: cad4d93b364f91e7b7931b3fa935455487e5c33c react-native-cookies: ce50e42ace7cf0dd47769260ca5bbe8eee607e4e + react-native-restart: 733a51ad137f15b0f8dc34c4082e55af7da00979 react-native-safe-area-context: f0906bf8bc9835ac9a9d3f97e8bde2a997d8da79 react-native-simple-toast: bf002828cf816775a6809f7a9ec3907509bce11f react-native-webview: 71567b6bf3d4e55914e580d720cc8f7df64af817 diff --git a/packages/app/package.json b/packages/app/package.json index 0f6f0ed1..e28f7c56 100644 --- a/packages/app/package.json +++ b/packages/app/package.json @@ -45,6 +45,7 @@ "react-native-localize": "^2.0.2", "react-native-markdown-display": "7.0.0-alpha.2", "react-native-modal-datetime-picker": "9.2.0", + "react-native-restart": "^0.0.22", "react-native-safe-area-context": "3.2.0", "react-native-screens": "2.18.1", "react-native-simple-toast": "1.1.3", diff --git a/packages/app/services/languageService.ts b/packages/app/services/languageService.ts index 91a936b3..0f0be380 100644 --- a/packages/app/services/languageService.ts +++ b/packages/app/services/languageService.ts @@ -22,8 +22,8 @@ const rtlList: { [key: string]: boolean } = { ar: true, } -const isRTL = (langCode: string) => { - if (!isRTL.hasOwnProperty(langCode)) { +export const isRTL = (langCode: string) => { + if (!rtlList.hasOwnProperty(langCode)) { return false } return rtlList[langCode] diff --git a/packages/app/yarn.lock b/packages/app/yarn.lock index 4e7003e1..c4125b40 100644 --- a/packages/app/yarn.lock +++ b/packages/app/yarn.lock @@ -7493,6 +7493,11 @@ react-native-modal-datetime-picker@9.2.0: dependencies: prop-types "^15.7.2" +react-native-restart@^0.0.22: + version "0.0.22" + resolved "https://registry.yarnpkg.com/react-native-restart/-/react-native-restart-0.0.22.tgz#81fcb7f31e35951d85410c68b9556acf3ab88705" + integrity sha512-XwCqAMAKsO8yCM3xACPFKvkDQZe41lcavOuO0gUEu803IuTLtciualCq/qs83ryRDCDh1jkXYRqFjsGjLMCN3Q== + react-native-safe-area-context@3.2.0: version "3.2.0" resolved "https://registry.npmjs.org/react-native-safe-area-context/-/react-native-safe-area-context-3.2.0.tgz"