finish localization and text extractions for English

openmultiplayer · Nov 12, 2023 · c6465ab · c6465ab
1 parent cbda330
commit c6465ab
Show file tree

Hide file tree

Showing 17 changed files with 192 additions and 101 deletions.
diff --git a/src/containers/AddThirdPartyServer/index.tsx b/src/containers/AddThirdPartyServer/index.tsx
@@ -1,9 +1,10 @@
+import { t } from "i18next";
 import { useContext, useState } from "react";
 import {
   TextInput,
   TouchableOpacity,
   View,
-  useWindowDimensions
+  useWindowDimensions,
 } from "react-native";
 import * as Animatable from "react-native-animatable";
 import Icon from "../../components/Icon";
@@ -93,10 +94,10 @@ const AddThirdPartyServerModal = () => {
         <Icon image={images.icons.favorite} size={30} />
         <View style={{ width: 300, marginTop: 10 }}>
           <Text color={theme.textPrimary} size={1}>
-            Add your server manually to favorite list.
+            {t("add_server_modal_description_1")}
           </Text>
           <Text color={theme.textPrimary} size={1}>
-            Example: 127.0.0.1:7777
+            {t("add_server_modal_description_2")}
           </Text>
         </View>
         <TextInput
@@ -130,7 +131,7 @@ const AddThirdPartyServerModal = () => {
           onPress={() => addServer()}
         >
           <Text color={theme.textPrimary} size={1}>
-            Add
+            {t("add")}
           </Text>
         </TouchableOpacity>
         <TouchableOpacity

diff --git a/src/containers/JoinServerPrompt/index.tsx b/src/containers/JoinServerPrompt/index.tsx
@@ -1,4 +1,5 @@
-import { useContext, useState, useEffect } from "react";
+import { t } from "i18next";
+import { useContext, useEffect, useState } from "react";
 import {
   TextInput,
   TouchableOpacity,
@@ -71,19 +72,19 @@ const JoinServerPrompt = () => {
           }}
         >
           <Text semibold color={theme.textPrimary} size={1}>
-            Server:{" "}
+            {t("server")}:{" "}
             <Text medium color={theme.textPrimary} size={1}>
               {server?.hostname}
             </Text>
           </Text>
           <Text semibold color={theme.textPrimary} size={1}>
-            Address:{" "}
+            {t("address")}:{" "}
             <Text medium color={theme.textPrimary} size={1}>
               {server?.ip}:{server?.port}
             </Text>
           </Text>
           <Text semibold color={theme.textPrimary} size={1}>
-            Players:{" "}
+            {t("players")}:{" "}
             <Text medium color={theme.textPrimary} size={1}>
               {server?.playerCount}/{server?.maxPlayers}
             </Text>
@@ -92,11 +93,13 @@ const JoinServerPrompt = () => {
         {server?.hasPassword && (
           <View style={{ marginTop: 15 }}>
             <Text color={theme.textPrimary} size={1}>
-              This server is protected, please enter password.
+              {t("server_join_prompt_enter_password")}
             </Text>
             <TextInput
               placeholderTextColor={theme.textPlaceholder}
-              placeholder={"Enter password..."}
+              placeholder={t(
+                "server_join_prompt_enter_password_input_placeholder"
+              )}
               value={password}
               onChangeText={(text) => setPassword(text)}
               style={{
@@ -117,11 +120,11 @@ const JoinServerPrompt = () => {
         )}
         <View style={{ marginTop: server?.hasPassword ? 5 : 15 }}>
           <Text color={theme.textPrimary} size={1}>
-            Nickname:
+            {t("nickname")}:
           </Text>
           <TextInput
             placeholderTextColor={theme.textPlaceholder}
-            placeholder={"Enter Nickname..."}
+            placeholder={t("server_join_prompt_nickname_input_placeholder")}
             value={nickName}
             onChangeText={(text) => setNickName(text)}
             style={{
@@ -163,7 +166,7 @@ const JoinServerPrompt = () => {
           }}
         >
           <Text color={theme.textPrimary} size={1}>
-            Connect
+            {t("connect")}
           </Text>
         </TouchableOpacity>
         <TouchableOpacity

diff --git a/src/containers/MainBody/BottomBar.tsx b/src/containers/MainBody/BottomBar.tsx
@@ -1,4 +1,5 @@
 import { Clipboard } from "@react-native-clipboard/clipboard/dist/Clipboard.web";
+import { t } from "i18next";
 import { useContext, useMemo } from "react";
 import { StyleSheet, TouchableOpacity, View } from "react-native";
 import Icon from "../../components/Icon";
@@ -60,7 +61,7 @@ const BottomBar = () => {
             }}
           >
             <Text semibold color={theme.textPrimary} style={{ fontSize: 10 }}>
-              Copy
+              {t("copy")}
             </Text>
           </TouchableOpacity>
           <TouchableOpacity
@@ -96,7 +97,7 @@ const BottomBar = () => {
               color={theme.textPrimary}
               style={{ marginLeft: 2, fontSize: 10 }}
             >
-              {favorited ? "Remove from Favorites" : "Add to Favorites"}
+              {favorited ? t("remove_from_favorites") : t("add_to_favorites")}
             </Text>
           </TouchableOpacity>
         </View>

diff --git a/src/containers/MainBody/ServerInfo/AdditionalInfo.tsx b/src/containers/MainBody/ServerInfo/AdditionalInfo.tsx
@@ -1,3 +1,4 @@
+import { t } from "i18next";
 import { useContext, useMemo } from "react";
 import { FlatList, ListRenderItemInfo, StyleSheet, View } from "react-native";
 import Text from "../../../components/Text";
@@ -76,12 +77,12 @@ const AdditionalInfo = (props: IProps) => {
       >
         <View style={[styles.commonFieldContainer, styles.ruleFieldContainer]}>
           <Text semibold size={1} color={theme.textPrimary + "AA"}>
-            Rule
+            {t("rule")}
           </Text>
         </View>
         <View style={[styles.commonFieldContainer, styles.valueFieldContainer]}>
           <Text semibold size={1} color={theme.textPrimary + "AA"}>
-            Value
+            {t("value")}
           </Text>
         </View>
       </View>

diff --git a/src/containers/MainBody/ServerInfo/PlayerList.tsx b/src/containers/MainBody/ServerInfo/PlayerList.tsx
@@ -1,8 +1,9 @@
+import { t } from "i18next";
 import { useContext } from "react";
-import { StyleSheet, View, FlatList, ListRenderItemInfo } from "react-native";
-import { Player } from "../../../utils/types";
+import { FlatList, ListRenderItemInfo, StyleSheet, View } from "react-native";
 import Text from "../../../components/Text";
 import { ThemeContext } from "../../../contexts/theme";
+import { Player } from "../../../utils/types";
 
 interface IProps {
   players: Player[];
@@ -56,12 +57,12 @@ const PlayerList = (props: IProps) => {
       >
         <View style={[styles.commonFieldContainer, styles.nameFieldContainer]}>
           <Text semibold size={1} color={theme.textPrimary + "AA"}>
-            Player
+            {t("player")}
           </Text>
         </View>
         <View style={[styles.commonFieldContainer, styles.scoreFieldContainer]}>
           <Text semibold size={1} color={theme.textPrimary + "AA"}>
-            Score
+            {t("score")}
           </Text>
         </View>
       </View>

diff --git a/src/containers/MainBody/ServerList/Item.tsx b/src/containers/MainBody/ServerList/Item.tsx
@@ -1,3 +1,4 @@
+import { t } from "i18next";
 import { memo, useContext, useEffect, useRef } from "react";
 import { Animated, Pressable, StyleSheet, View } from "react-native";
 import Icon from "../../../components/Icon";
@@ -120,7 +121,7 @@ const ServerItem = memo((props: IProps) => {
           ]}
         >
           <Icon
-            title={server.hasPassword ? "Locked" : "Unlocked"}
+            title={server.hasPassword ? t("locked") : t("unlocked")}
             image={
               server.hasPassword ? images.icons.locked : images.icons.unlocked
             }
@@ -130,7 +131,7 @@ const ServerItem = memo((props: IProps) => {
         {server.usingOmp && (
           <View style={[styles.iconContainer]}>
             <Icon
-              title={"open.mp server"}
+              title={t("openmp_server")}
               image={images.icons.ompLight}
               size={20}
             />

diff --git a/src/containers/MainBody/ServerList/ListHeader.tsx b/src/containers/MainBody/ServerList/ListHeader.tsx
@@ -1,7 +1,8 @@
+import { t } from "i18next";
 import { useContext } from "react";
-import { StyleSheet, View, Pressable } from "react-native";
-import Text from "../../../components/Text";
+import { Pressable, StyleSheet, View } from "react-native";
 import Icon from "../../../components/Icon";
+import Text from "../../../components/Text";
 import { images } from "../../../constants/images";
 import { ThemeContext } from "../../../contexts/theme";
 import { useGenericTempState } from "../../../states/genericStates";
@@ -49,7 +50,7 @@ const ListHeader = () => {
             </Text>
           )}
           <Text semibold size={1} color={theme.textPrimary + "AA"}>
-            Name
+            {t("name")}
           </Text>
         </Pressable>
       </View>
@@ -86,7 +87,7 @@ const ListHeader = () => {
             </Text>
           )}
           <Text semibold size={1} color={theme.textPrimary + "AA"}>
-            Ping
+            {t("ping")}
           </Text>
         </Pressable>
 
@@ -116,7 +117,7 @@ const ListHeader = () => {
             </Text>
           )}
           <Text semibold size={1} color={theme.textPrimary + "AA"}>
-            Mode
+            {t("mode")}
           </Text>
         </Pressable>
         <Pressable
@@ -145,7 +146,7 @@ const ListHeader = () => {
             </Text>
           )}
           <Text semibold size={1} color={theme.textPrimary + "AA"}>
-            Players
+            {t("players")}
           </Text>
         </Pressable>
       </View>

diff --git a/src/containers/MainBody/ServerList/SearchBar.tsx b/src/containers/MainBody/ServerList/SearchBar.tsx
@@ -20,6 +20,7 @@ import { useJoinServerPrompt } from "../../../states/joinServerPrompt";
 import { usePersistentServers, useServers } from "../../../states/servers";
 import { fetchServers } from "../../../utils/helpers";
 import { ListType } from "../../../utils/types";
+import { t } from "i18next";
 
 interface IProps {
   onChange: (query: string) => void;
@@ -102,7 +103,7 @@ const SearchBar = (props: IProps) => {
         onPress={() => showFilterMenu(!filterMenu)}
       >
         <Icon
-          title={"Filter Servers"}
+          title={t("filter_servers")}
           image={images.icons.filter}
           size={16}
           color={theme.textPlaceholder}
@@ -129,7 +130,7 @@ const SearchBar = (props: IProps) => {
         ]}
       >
         <TextInput
-          placeholder="Search for server hostname/mode"
+          placeholder={t("search_for_server_hostname_mode")}
           placeholderTextColor={theme.textPlaceholder}
           value={searchQuery}
           style={{
@@ -171,7 +172,7 @@ const SearchBar = (props: IProps) => {
           onPress={() => clearRecentlyJoined()}
         >
           <Icon
-            title={"Clear Recently Joined List"}
+            title={t("clear_recently_joined_list")}
             image={images.icons.clean}
             size={18}
             color={"#D2691E"}
@@ -192,7 +193,7 @@ const SearchBar = (props: IProps) => {
         onPress={() => refreshServers()}
       >
         <Icon
-          title={"Refresh Internet List"}
+          title={t("refresh_servers")}
           image={images.icons.refresh}
           size={20}
         />
@@ -202,7 +203,7 @@ const SearchBar = (props: IProps) => {
         onPress={() => playSelectedServer()}
       >
         <Icon
-          title={"Play"}
+          title={t("play")}
           image={images.icons.play}
           size={22}
           color={theme.primary}
@@ -223,8 +224,8 @@ const SearchBar = (props: IProps) => {
         <Icon
           title={
             favorited
-              ? "Remove Selected Server from Favorites"
-              : "Add Selected Server to Favorites"
+              ? t("remove_selected_server_from_favorites")
+              : t("add_selected_server_to_favorites")
           }
           image={favorited ? images.icons.unfavorite : images.icons.favorite}
           size={19}
@@ -236,7 +237,7 @@ const SearchBar = (props: IProps) => {
         onPress={() => showAddThirdPartyServer(true)}
       >
         <Icon
-          title={"Add Your Server"}
+          title={t("add_server")}
           image={images.icons.add}
           size={20}
           color={"#3B833D"}
@@ -255,8 +256,8 @@ const SearchBar = (props: IProps) => {
         <Icon
           title={
             sideLists
-              ? "Hide player and rule list"
-              : "Show player and rule list"
+              ? t("hide_player_and_rule_list")
+              : t("show_player_and_rule_list")
           }
           image={
             sideLists ? images.icons.closeSideLists : images.icons.openSideLists

diff --git a/src/containers/MainBody/index.tsx b/src/containers/MainBody/index.tsx
@@ -1,3 +1,4 @@
+import { t } from "i18next";
 import { useContext } from "react";
 import { Pressable, StyleSheet, View } from "react-native";
 import CheckBox from "../../components/CheckBox";
@@ -63,15 +64,15 @@ const FiltersModal = () => {
         }}
       >
         <Text semibold size={1} color={theme.textPrimary}>
-          Filters:
+          {t("filters")}:
         </Text>
         <Pressable
           style={{ flexDirection: "row", alignItems: "center", marginTop: 3 }}
           onPress={() => setSearchData("ompOnly", !ompOnly)}
         >
           <CheckBox value={ompOnly} style={{ marginRight: 5 }} />
           <Text size={1} color={theme.textPrimary}>
-            open.mp servers
+            {t("filter_only_omp_servers")}
           </Text>
         </Pressable>
         <Pressable
@@ -80,7 +81,7 @@ const FiltersModal = () => {
         >
           <CheckBox value={nonEmpty} style={{ marginRight: 5 }} />
           <Text size={1} color={theme.textPrimary}>
-            Non-empty Servers
+            {t("filter_non_empty_servers")}
           </Text>
         </Pressable>
         <Pressable
@@ -89,7 +90,7 @@ const FiltersModal = () => {
         >
           <CheckBox value={unpassworded} style={{ marginRight: 5 }} />
           <Text size={1} color={theme.textPrimary}>
-            unpassworded Servers
+            {t("filter_unpassworded_servers")}
           </Text>
         </Pressable>
       </View>