Internationalization & localization (#1822)

* install and setup lingui

* setup dynamic locale activation and async loading

* first pass of automated replacement of text messages

* add some more documentaton

* fix nits

* add `es` and `hi`locales for testing purposes

* make accessibilityLabel localized

* compile and extract new messages

* fix merge conflicts

* fix eslint warning

* change instructions from sending email to opening PR

* fix comments

1 files changed, 6 insertions, 3 deletions

diff --git a/src/view/com/modals/UserAddRemoveLists.tsx b/src/view/com/modals/UserAddRemoveLists.tsx
index f86e88439..efcfc43be 100644
--- a/src/view/com/modals/UserAddRemoveLists.tsx
+++ b/src/view/com/modals/UserAddRemoveLists.tsx
@@ -21,6 +21,8 @@ import {usePalette} from 'lib/hooks/usePalette'
 import {isWeb, isAndroid} from 'platform/detection'
 import isEqual from 'lodash.isequal'
 import {logger} from '#/logger'
+import {Trans, msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useModalControls} from '#/state/modals'
 
 export const snapPoints = ['fullscreen']
@@ -39,6 +41,7 @@ export const Component = observer(function UserAddRemoveListsImpl({
   const store = useStores()
   const {closeModal} = useModalControls()
   const pal = usePalette('default')
+  const {_} = useLingui()
   const palPrimary = usePalette('primary')
   const palInverted = usePalette('inverted')
   const [originalSelections, setOriginalSelections] = React.useState<string[]>(
@@ -181,7 +184,7 @@ export const Component = observer(function UserAddRemoveListsImpl({
   return (
     <View testID="userAddRemoveListsModal" style={s.hContentRegion}>
       <Text style={[styles.title, pal.text]}>
-        Update {displayName} in Lists
+        <Trans>Update {displayName} in Lists</Trans>
       </Text>
       <ListsList
         listsList={listsList}
@@ -195,7 +198,7 @@ export const Component = observer(function UserAddRemoveListsImpl({
           type="default"
           onPress={onPressCancel}
           style={styles.footerBtn}
-          accessibilityLabel="Cancel"
+          accessibilityLabel={_(msg`Cancel`)}
           accessibilityHint=""
           onAccessibilityEscape={onPressCancel}
           label="Cancel"
@@ -206,7 +209,7 @@ export const Component = observer(function UserAddRemoveListsImpl({
             type="primary"
             onPress={onPressSave}
             style={styles.footerBtn}
-            accessibilityLabel="Save changes"
+            accessibilityLabel={_(msg`Save changes`)}
             accessibilityHint=""
             onAccessibilityEscape={onPressSave}
             label="Save Changes"