martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-02-12 03:29:16 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

pulling language from OS

Browse Source
This commit is contained in:
balzack 2023-08-24 18:03:37 -07:00
parent 6bd073fdf9
commit d4e571e3fd
3 changed files with 43 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
app/mobile/src/constants/Strings.js
View File

@ -1,20 +1,6 @@
export function getLanguageId(language) { import { NativeModules, Platform } from 'react-native'
if (language === 'english') {
return 0;
}
if (language === 'french') {
return 1;
}
if (language === 'spanish') {
return 2;
}
if (language === 'german') {
return 3;
}
return 0; // default
};
export const Strings = [ const Strings = [
{ {
visibleRegistry: 'Visible in Registry', visibleRegistry: 'Visible in Registry',
edit: 'Edit', edit: 'Edit',
@ -97,4 +83,22 @@ export const Strings = [
} }
]; ];
export default Strings; export function getLanguageStrings() {
const locale = Platform.OS === 'ios' ? NativeModules.SettingsManager.settings.AppleLocale || NativeModules.SettingsManager.settings.AppleLanguages[0] : NativeModules.I18nManager.localeIdentifier;
const lang = locale.slice(0, 2) || '';
if (lang === 'en') {
return Strings[0];
}
if (lang === 'fr') {
return Strings[1];
}
if (lang === 'es') {
return Strings[2];
}
if (lang === 'de') {
return Strings[3];
}
return Strings[0];
};

50
app/mobile/src/session/settings/Settings.jsx
View File

@ -1,27 +1,27 @@
import { useState } from 'react';
import { ScrollView, View, Text, Switch, TouchableOpacity } from 'react-native'; import { ScrollView, View, Text, Switch, TouchableOpacity } from 'react-native';
import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context'; import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context';
import { styles } from './Settings.styled'; import { styles } from './Settings.styled';
import { useSettings } from './useSettings.hook'; import { useSettings } from './useSettings.hook';
import MatIcons from 'react-native-vector-icons/MaterialCommunityIcons'; import MatIcons from 'react-native-vector-icons/MaterialCommunityIcons';
import Colors from 'constants/Colors'; import Colors from 'constants/Colors';
import Strings from 'constants/Strings';
export function Settings() { export function Settings() {
const { state, actions } = useSettings(); const { state, actions } = useSettings();
return ( return (
<ScrollView style={styles.content}> <ScrollView style={styles.content}>
<SafeAreaView edges={['top']}> <SafeAreaView edges={['top']}>
<Text style={styles.label}>{ Strings[state.lang].messaging }</Text> <Text style={styles.label}>{ state.strings.messaging }</Text>
<View style={styles.group}> <View style={styles.group}>
<TouchableOpacity style={styles.entry} activeOpacity={1}> <TouchableOpacity style={styles.entry} activeOpacity={1}>
<View style={styles.icon}> <View style={styles.icon}>
<MatIcons name="bell-outline" size={20} color={Colors.linkText} /> <MatIcons name="bell-outline" size={20} color={Colors.linkText} />
</View> </View>
<View style={styles.option}> <View style={styles.option}>
<Text style={styles.optionLink}>{ Strings[state.lang].enableNotifications }</Text> <Text style={styles.optionLink}>{ state.strings.enableNotifications }</Text>
</View> </View>
<View style={styles.control}> <View style={styles.control}>
<Switch style={styles.notifications} trackColor={styles.track}/> <Switch style={styles.notifications} trackColor={styles.track}/>
@ -33,43 +33,33 @@ export function Settings() {
<MatIcons name="lock-outline" size={20} color={Colors.linkText} /> <MatIcons name="lock-outline" size={20} color={Colors.linkText} />
</View> </View>
<View style={styles.option}> <View style={styles.option}>
<Text style={styles.optionLink}>{ Strings[state.lang].sealedTopics }</Text> <Text style={styles.optionLink}>{ state.strings.sealedTopics }</Text>
</View> </View>
<View style={styles.control} /> <View style={styles.control} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<Text style={styles.label}>{ Strings[state.lang].display }</Text> <Text style={styles.label}>{ state.strings.display }</Text>
<View style={styles.group}> <View style={styles.group}>
<TouchableOpacity style={styles.entry} activeOpacity={1}> <TouchableOpacity style={styles.entry} activeOpacity={1}>
<View style={styles.icon}> <View style={styles.icon}>
<MatIcons name="progress-clock" size={20} color={Colors.linkText} /> <MatIcons name="progress-clock" size={20} color={Colors.linkText} />
</View> </View>
<View style={styles.option}> <View style={styles.option}>
<Text style={styles.optionLink}>{ Strings[state.lang].hourMode }</Text> <Text style={styles.optionLink}>{ state.strings.hourMode }</Text>
</View>
<View style={styles.control} />
</TouchableOpacity>
<View style={styles.divider} />
<TouchableOpacity style={styles.entry} activeOpacity={1}>
<View style={styles.icon}>
<MatIcons name="earth" size={20} color={Colors.linkText} />
</View>
<View style={styles.option}>
<Text style={styles.optionLink}>{ Strings[state.lang].language }</Text>
</View> </View>
<View style={styles.control} /> <View style={styles.control} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<Text style={styles.label}>{ Strings[state.lang].account }</Text> <Text style={styles.label}>{ state.strings.account }</Text>
<View style={styles.group}> <View style={styles.group}>
<TouchableOpacity style={styles.entry} activeOpacity={1}> <TouchableOpacity style={styles.entry} activeOpacity={1}>
<View style={styles.icon}> <View style={styles.icon}>
<MatIcons name="logout" size={20} color={Colors.linkText} /> <MatIcons name="logout" size={20} color={Colors.linkText} />
</View> </View>
<View style={styles.option}> <View style={styles.option}>
<Text style={styles.optionLink}>{ Strings[state.lang].logout }</Text> <Text style={styles.optionLink}>{ state.strings.logout }</Text>
</View> </View>
<View style={styles.control} /> <View style={styles.control} />
</TouchableOpacity> </TouchableOpacity>
@ -79,7 +69,7 @@ export function Settings() {
<MatIcons name="login" size={20} color={Colors.linkText} /> <MatIcons name="login" size={20} color={Colors.linkText} />
</View> </View>
<View style={styles.option}> <View style={styles.option}>
<Text style={styles.optionLink}>{ Strings[state.lang].changeLogin }</Text> <Text style={styles.optionLink}>{ state.strings.changeLogin }</Text>
</View> </View>
<View style={styles.control} /> <View style={styles.control} />
</TouchableOpacity> </TouchableOpacity>
@ -89,20 +79,20 @@ export function Settings() {
<MatIcons name="trash-can-outline" size={20} color={Colors.dangerText} /> <MatIcons name="trash-can-outline" size={20} color={Colors.dangerText} />
</View> </View>
<View style={styles.option}> <View style={styles.option}>
<Text style={styles.dangerLink}>{ Strings[state.lang].deleteAccount }</Text> <Text style={styles.dangerLink}>{ state.strings.deleteAccount }</Text>
</View> </View>
<View style={styles.control} /> <View style={styles.control} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<Text style={styles.label}>{ Strings[state.lang].blocked }</Text> <Text style={styles.label}>{ state.strings.blocked }</Text>
<View style={styles.group}> <View style={styles.group}>
<TouchableOpacity style={styles.entry} activeOpacity={1}> <TouchableOpacity style={styles.entry} activeOpacity={1}>
<View style={styles.icon}> <View style={styles.icon}>
<MatIcons name="account-multiple-outline" size={20} color={Colors.linkText} /> <MatIcons name="account-multiple-outline" size={20} color={Colors.linkText} />
</View> </View>
<View style={styles.option}> <View style={styles.option}>
<Text style={styles.optionLink}>{ Strings[state.lang].contacts }</Text> <Text style={styles.optionLink}>{ state.strings.contacts }</Text>
</View> </View>
<View style={styles.control} /> <View style={styles.control} />
</TouchableOpacity> </TouchableOpacity>
@ -112,7 +102,7 @@ export function Settings() {
<MatIcons name="book-open-outline" size={20} color={Colors.linkText} /> <MatIcons name="book-open-outline" size={20} color={Colors.linkText} />
</View> </View>
<View style={styles.option}> <View style={styles.option}>
<Text style={styles.optionLink}>{ Strings[state.lang].topics }</Text> <Text style={styles.optionLink}>{ state.strings.topics }</Text>
</View> </View>
<View style={styles.control} /> <View style={styles.control} />
</TouchableOpacity> </TouchableOpacity>
@ -122,13 +112,13 @@ export function Settings() {
<MatIcons name="comment-text-multiple-outline" size={20} color={Colors.linkText} /> <MatIcons name="comment-text-multiple-outline" size={20} color={Colors.linkText} />
</View> </View>
<View style={styles.option}> <View style={styles.option}>
<Text style={styles.optionLink}>{ Strings[state.lang].messages }</Text> <Text style={styles.optionLink}>{ state.strings.messages }</Text>
</View> </View>
<View style={styles.control} /> <View style={styles.control} />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<Text style={styles.label}>{ Strings[state.lang].support }</Text> <Text style={styles.label}>{ state.strings.support }</Text>
<View style={styles.group}> <View style={styles.group}>
<TouchableOpacity style={styles.entry} activeOpacity={1}> <TouchableOpacity style={styles.entry} activeOpacity={1}>
<View style={styles.icon}> <View style={styles.icon}>
@ -141,7 +131,7 @@ export function Settings() {
</TouchableOpacity> </TouchableOpacity>
</View> </View>
</SafeAreaView> </SafeAreaView>
</ScrollView> </ScrollView>
); );
} }

3
app/mobile/src/session/settings/useSettings.hook.js
View File

@ -1,9 +1,10 @@
import { useState, useEffect, useRef, useContext } from 'react'; import { useState, useEffect, useRef, useContext } from 'react';
import { getLanguageStrings } from 'constants/Strings';
export function useSettings() { export function useSettings() {
const [state, setState] = useState({ const [state, setState] = useState({
lang: 0, strings: getLanguageStrings(),
}); });
const updateState = (value) => { const updateState = (value) => {