New translations keys

src/components/Transactions/Create.tsx

@@ -7,6 +7,8 @@ import {
 import Title from '../UI/Title';
 import TransactionForm from './Form';
 
+import { translate } from '../../i18n/locale';
+
 const Create = ({
   loading,
   accounts,
@@ -23,7 +25,7 @@ const Create = ({
   goToTransactions,
 }) => (
   <>
-    <Title navigation={navigation} text="New Transaction" />
+    <Title navigation={navigation} text={translate('transaction_screen_title')} />
     <KeyboardAvoidingView
       h={{
         base: '100%',

src/components/Transactions/Form.tsx

@@ -69,6 +69,20 @@ const Form = ({
   const [displayAutocomplete, setDisplayAutocomplete] = React.useState({
     budget: false, category: false, description: false, source: false, destination: false,
   });
+  const types = [
+    {
+      type: 'withdrawal',
+      name: translate('transaction_form_type_withdraw'),
+    },
+    {
+      type: 'deposit',
+      name: translate('transaction_form_type_deposit'),
+    },
+    {
+      type: 'transfer',
+      name: translate('transaction_form_type_transfer'),
+    },
+  ];
 
   const resetErrors = () => setErrors(INITIAL_ERROR);
   const closeAllAutocomplete = () => setDisplayAutocomplete({
@@ -132,7 +146,7 @@ const Form = ({
       <FormControl isRequired>
         <HStack justifyContent="center">
           <Button.Group isAttached borderRadius={15}>
-            {['withdrawal', 'deposit', 'transfer'].map((type) => (
+            {types.map(({ type, name }) => (
               <Button
                 shadow={2}
                 onPress={() => setData({
@@ -153,7 +167,7 @@ const Form = ({
                 borderWidth={1}
                 borderColor="white"
               >
-                {type}
+                {name}
               </Button>
             ))}
           </Button.Group>

src/i18n/locale/translations/en-US.ts

@@ -52,4 +52,15 @@ export default {
   layout_new_update_body_text: 'You can always update later in Settings tab.',
   layout_new_update_cancel_button: 'Cancel',
   layout_new_update_update_button: 'Update now',
+
+  // from version 0.31
+  transaction_screen_title: 'New Transaction',
+  navigation_home_tab: 'Home',
+  navigation_chart_tab: 'Chart',
+  navigation_create_tab: 'Create',
+  navigation_transactions_tab: 'Transactions',
+  navigation_settings_tab: 'Settings',
+  transaction_form_type_withdraw: 'Withdraw',
+  transaction_form_type_deposit: 'Deposit',
+  transaction_form_type_transfer: 'Transfer',
 };

src/routes/index.tsx

@@ -19,6 +19,8 @@ import TransactionsEditContainer from '../containers/Transactions/Edit';
 import TransactionsCreateContainer from '../containers/Transactions/Create';
 import colors from '../constants/colors';
 
+import { translate } from '../i18n/locale';
+
 const Stack = createNativeStackNavigator();
 const Stack2 = createStackNavigator();
 const Tab = createBottomTabNavigator();
@@ -179,15 +181,15 @@ const Home = () => (
     })}
   >
     <Tab.Screen
-      name="Home"
+      name={translate('navigation_home_tab')}
       component={HomeContainer}
     />
     <Tab.Screen
-      name="Chart"
+      name={translate('navigation_chart_tab')}
       component={ChartContainer}
     />
     <Tab.Screen
-      name="Create"
+      name={translate('navigation_create_tab')}
       component={HomeContainer}
       options={({ navigation }) => ({
         tabBarButton: () => (
@@ -196,7 +198,7 @@ const Home = () => (
       })}
     />
     <Tab.Screen
-      name="Transactions"
+      name={translate('navigation_transactions_tab')}
       component={TransactionNavigator}
       options={{
         tabBarIcon: (icon) => (
@@ -205,7 +207,7 @@ const Home = () => (
       }}
     />
     <Tab.Screen
-      name="Settings"
+      name={translate('navigation_settings_tab')}
       component={ConfigurationContainer}
     />
   </Tab.Navigator>