use current locale

This commit is contained in:
Halit Aksoy 2024-03-31 17:20:09 +03:00
parent 3a83bf1cd5
commit b633bbcd8e

View File

@ -11,6 +11,7 @@ import { RTMTWS } from './rtmt/rtmt_websocket';
import { ConnectionState } from './rtmt/rtmt';
import { useTranslation } from 'react-i18next';
import Snackbar from 'react-native-snackbar';
import { NativeModules, I18nManager, Platform } from 'react-native'
// https://github.com/uuidjs/uuid/issues/514#issuecomment-691475020
import 'react-native-get-random-values';
@ -21,7 +22,20 @@ const context = initContext();
function App() {
const { t } = useTranslation();
// Get device language
const deviceLanguage =
Platform.OS === 'ios'
? NativeModules.SettingsManager.settings.AppleLocale // iOS
: NativeModules.I18nManager.localeIdentifier; // Android
const { t, i18n } = useTranslation();
React.useEffect(() => {
console.log(deviceLanguage);
i18n.changeLanguage(deviceLanguage === "tr_TR" ? "tr" : "en")
}, []);
const [userKey, setUserKey] = React.useState<string | undefined>(undefined);
@ -37,33 +51,33 @@ function App() {
const onThemeChange = (theme: Theme) => setTheme(theme);
const connectRTMT = (userKey: string) => {
const rtmt = context.rtmt as RTMTWS;
rtmt.on("error", onConnectionError);
rtmt.on("connectionchange", onConnectionChange)
rtmt.connectWebSocket(userKey)
return rtmt;
const rtmt = context.rtmt as RTMTWS;
rtmt.on("error", onConnectionError);
rtmt.on("connectionchange", onConnectionChange)
rtmt.connectWebSocket(userKey)
return rtmt;
}
const loadUserKeyAndConnectServer = () => {
context.userKeyStore.getUserKey().then((userKey: string) => {
setUserKey(userKey);
connectRTMT(userKey);
}).catch((error) => {
//TODO: check if it is network error!
Snackbar.show({text: t("ErrorWhenRetrievingInformation")})
console.error(error);
});
context.userKeyStore.getUserKey().then((userKey: string) => {
setUserKey(userKey);
connectRTMT(userKey);
}).catch((error) => {
//TODO: check if it is network error!
Snackbar.show({ text: t("ErrorWhenRetrievingInformation") })
console.error(error);
});
}
const disposeApp = () => {
context.rtmt?.dispose();
context.themeManager.off("themechange", onThemeChange);
context.rtmt?.dispose();
context.themeManager.off("themechange", onThemeChange);
}
React.useEffect(() => {
loadUserKeyAndConnectServer();
context.themeManager.on("themechange", onThemeChange);
return () => disposeApp();
loadUserKeyAndConnectServer();
context.themeManager.on("themechange", onThemeChange);
return () => disposeApp();
}, []);
//const textColorOnBoard = getColorByBrightness(
@ -71,16 +85,15 @@ function App() {
// context.themeManager.theme.textColor,
// context.themeManager.theme.textLightColor
//);
return (
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen name="Home" component={HomeScreen} initialParams={{context}}
options={{title: t("Mancala"), headerStyle: { backgroundColor: context.themeManager.theme.appBarBgColor }}}/>
<Stack.Screen name="Home" component={HomeScreen} initialParams={{ context }}
options={{ title: t("Mancala"), headerStyle: { backgroundColor: context.themeManager.theme.appBarBgColor } }} />
<Stack.Screen name="Loby" component={LobyScreen}
options={{title: t("Mancala"), headerStyle: { backgroundColor: context.themeManager.theme.appBarBgColor }}}/>
options={{ title: t("Mancala"), headerStyle: { backgroundColor: context.themeManager.theme.appBarBgColor } }} />
<Stack.Screen name="Game" component={GameScreen}
options={{title: t("Mancala"), headerStyle: { backgroundColor: context.themeManager.theme.appBarBgColor }}}/>
options={{ title: t("Mancala"), headerStyle: { backgroundColor: context.themeManager.theme.appBarBgColor }, headerTintColor: '#fff', }} />
</Stack.Navigator>
</NavigationContainer>
);