Merge #7903 (#7917)

* Add missing msg macro calls for i18n (#7903)

* Add missing msg macro calls for i18n

* Update src/screens/Settings/AppIconSettings/useAppIconSets.ts

Co-authored-by: surfdude29 <149612116+surfdude29@users.noreply.github.com>

* Apply suggestions from code review

Co-authored-by: surfdude29 <149612116+surfdude29@users.noreply.github.com>

* Apply surfdude29's suggestions from code review

Co-authored-by: surfdude29 <149612116+surfdude29@users.noreply.github.com>

---------

Co-authored-by: Samuel Newman <mozzius@protonmail.com>
Co-authored-by: surfdude29 <149612116+surfdude29@users.noreply.github.com>

* Format

---------

Co-authored-by: Stanislas Signoud <signez@stanisoft.net>
Co-authored-by: Samuel Newman <mozzius@protonmail.com>
Co-authored-by: surfdude29 <149612116+surfdude29@users.noreply.github.com>

8 files changed, 94 insertions, 25 deletions

diff --git a/src/screens/Messages/components/RequestButtons.tsx b/src/screens/Messages/components/RequestButtons.tsx
index 023cbff2d..62db09600 100644
--- a/src/screens/Messages/components/RequestButtons.tsx
+++ b/src/screens/Messages/components/RequestButtons.tsx
@@ -49,18 +49,42 @@ export function RejectMenu({
       }
     },
     onError: () => {
-      Toast.show(_('Failed to delete chat'), 'xmark')
+      Toast.show(
+        _(
+          msg({
+            context: 'toast',
+            message: 'Failed to delete chat',
+          }),
+        ),
+        'xmark',
+      )
     },
   })
   const [queueBlock] = useProfileBlockMutationQueue(shadowedProfile)
 
   const onPressDelete = useCallback(() => {
-    Toast.show(_('Chat deleted'), 'check')
+    Toast.show(
+      _(
+        msg({
+          context: 'toast',
+          message: 'Chat deleted',
+        }),
+      ),
+      'check',
+    )
     leaveConvo()
   }, [leaveConvo, _])
 
   const onPressBlock = useCallback(() => {
-    Toast.show(_('Account blocked'), 'check')
+    Toast.show(
+      _(
+        msg({
+          context: 'toast',
+          message: 'Account blocked',
+        }),
+      ),
+      'check',
+    )
     // block and also delete convo
     queueBlock()
     leaveConvo()
@@ -179,7 +203,15 @@ export function AcceptChatButton({
       // no difference if the request failed - when they send a message, the convo will be accepted
       // automatically. The only difference is that when they back out of the convo (without sending a message), the conversation will be rejected.
       // the list will still have this chat in it -sfn
-      Toast.show(_('Failed to accept chat'), 'xmark')
+      Toast.show(
+        _(
+          msg({
+            context: 'toast',
+            message: 'Failed to accept chat',
+          }),
+        ),
+        'xmark',
+      )
     },
   })
 
@@ -230,12 +262,28 @@ export function DeleteChatButton({
       }
     },
     onError: () => {
-      Toast.show(_('Failed to delete chat'), 'xmark')
+      Toast.show(
+        _(
+          msg({
+            context: 'toast',
+            message: 'Failed to delete chat',
+          }),
+        ),
+        'xmark',
+      )
     },
   })
 
   const onPressDelete = useCallback(() => {
-    Toast.show(_('Chat deleted'), 'check')
+    Toast.show(
+      _(
+        msg({
+          context: 'toast',
+          message: 'Chat deleted',
+        }),
+      ),
+      'check',
+    )
     leaveConvo()
   }, [leaveConvo, _])
 
diff --git a/src/screens/Settings/AppIconSettings/useAppIconSets.ts b/src/screens/Settings/AppIconSettings/useAppIconSets.ts
index 47fc5a15f..5c0ff698e 100644
--- a/src/screens/Settings/AppIconSettings/useAppIconSets.ts
+++ b/src/screens/Settings/AppIconSettings/useAppIconSets.ts
@@ -1,4 +1,5 @@
 import {useMemo} from 'react'
+import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 
 import {AppIconSet} from '#/screens/Settings/AppIconSettings/types'
@@ -10,7 +11,7 @@ export function useAppIconSets() {
     const defaults = [
       {
         id: 'default_light',
-        name: _('Light'),
+        name: _(msg({context: 'Name of app icon variant', message: 'Light'})),
         iosImage: () => {
           return require(`../../../../assets/app-icons/ios_icon_default_light.png`)
         },
@@ -20,7 +21,7 @@ export function useAppIconSets() {
       },
       {
         id: 'default_dark',
-        name: _('Dark'),
+        name: _(msg({context: 'Name of app icon variant', message: 'Dark'})),
         iosImage: () => {
           return require(`../../../../assets/app-icons/ios_icon_default_dark.png`)
         },
@@ -36,7 +37,7 @@ export function useAppIconSets() {
     const core = [
       {
         id: 'core_aurora',
-        name: _('Aurora'),
+        name: _(msg({context: 'Name of app icon variant', message: 'Aurora'})),
         iosImage: () => {
           return require(`../../../../assets/app-icons/ios_icon_core_aurora.png`)
         },
@@ -46,7 +47,7 @@ export function useAppIconSets() {
       },
       // {
       //   id: 'core_bonfire',
-      //   name: _('Bonfire'),
+      //   name: _(msg({ context: 'Name of app icon variant', message: 'Bonfire' })),
       //   iosImage: () => {
       //     return require(`../../../../assets/app-icons/ios_icon_core_bonfire.png`)
       //   },
@@ -56,7 +57,7 @@ export function useAppIconSets() {
       // },
       {
         id: 'core_sunrise',
-        name: _('Sunrise'),
+        name: _(msg({context: 'Name of app icon variant', message: 'Sunrise'})),
         iosImage: () => {
           return require(`../../../../assets/app-icons/ios_icon_core_sunrise.png`)
         },
@@ -66,7 +67,7 @@ export function useAppIconSets() {
       },
       {
         id: 'core_sunset',
-        name: _('Sunset'),
+        name: _(msg({context: 'Name of app icon variant', message: 'Sunset'})),
         iosImage: () => {
           return require(`../../../../assets/app-icons/ios_icon_core_sunset.png`)
         },
@@ -76,7 +77,9 @@ export function useAppIconSets() {
       },
       {
         id: 'core_midnight',
-        name: _('Midnight'),
+        name: _(
+          msg({context: 'Name of app icon variant', message: 'Midnight'}),
+        ),
         iosImage: () => {
           return require(`../../../../assets/app-icons/ios_icon_core_midnight.png`)
         },
@@ -86,7 +89,9 @@ export function useAppIconSets() {
       },
       {
         id: 'core_flat_blue',
-        name: _('Flat Blue'),
+        name: _(
+          msg({context: 'Name of app icon variant', message: 'Flat Blue'}),
+        ),
         iosImage: () => {
           return require(`../../../../assets/app-icons/ios_icon_core_flat_blue.png`)
         },
@@ -96,7 +101,9 @@ export function useAppIconSets() {
       },
       {
         id: 'core_flat_white',
-        name: _('Flat White'),
+        name: _(
+          msg({context: 'Name of app icon variant', message: 'Flat White'}),
+        ),
         iosImage: () => {
           return require(`../../../../assets/app-icons/ios_icon_core_flat_white.png`)
         },
@@ -106,7 +113,9 @@ export function useAppIconSets() {
       },
       {
         id: 'core_flat_black',
-        name: _('Flat Black'),
+        name: _(
+          msg({context: 'Name of app icon variant', message: 'Flat Black'}),
+        ),
         iosImage: () => {
           return require(`../../../../assets/app-icons/ios_icon_core_flat_black.png`)
         },
@@ -116,7 +125,12 @@ export function useAppIconSets() {
       },
       {
         id: 'core_classic',
-        name: _('Bluesky Classic™'),
+        name: _(
+          msg({
+            context: 'Name of app icon variant',
+            message: 'Bluesky Classic™',
+          }),
+        ),
         iosImage: () => {
           return require(`../../../../assets/app-icons/ios_icon_core_classic.png`)
         },
diff --git a/src/screens/StarterPack/Wizard/StepDetails.tsx b/src/screens/StarterPack/Wizard/StepDetails.tsx
index 49de979ee..a01a3d3a9 100644
--- a/src/screens/StarterPack/Wizard/StepDetails.tsx
+++ b/src/screens/StarterPack/Wizard/StepDetails.tsx
@@ -50,7 +50,14 @@ export function StepDetails() {
               value={state.name}
               onChangeText={text => dispatch({type: 'SetName', name: text})}
             />
-            <TextField.SuffixText label={_(`${state.name?.length} out of 50`)}>
+            <TextField.SuffixText
+              label={_(
+                msg({
+                  comment:
+                    'Accessibility label describing how many characters the user has entered out of a 50-character limit in a text input field',
+                  message: '${state.name?.length} out of 50',
+                }),
+              )}>
               <Text style={[t.atoms.text_contrast_medium]}>
                 {state.name?.length ?? 0}/50
               </Text>
diff --git a/src/view/com/composer/videos/SubtitleDialog.tsx b/src/view/com/composer/videos/SubtitleDialog.tsx
index e907dc41c..13d1b7ce5 100644
--- a/src/view/com/composer/videos/SubtitleDialog.tsx
+++ b/src/view/com/composer/videos/SubtitleDialog.tsx
@@ -38,11 +38,11 @@ export function SubtitleDialogBtn(props: Props) {
   return (
     <View style={[a.flex_row, a.my_xs]}>
       <Button
-        label={isWeb ? _('Captions & alt text') : _('Alt text')}
+        label={isWeb ? _(msg`Captions & alt text`) : _(msg`Alt text`)}
         accessibilityHint={
           isWeb
-            ? _('Opens captions and alt text dialog')
-            : _('Opens alt text dialog')
+            ? _(msg`Opens captions and alt text dialog`)
+            : _(msg`Opens alt text dialog`)
         }
         size="small"
         color="secondary"
diff --git a/src/view/com/composer/videos/SubtitleFilePicker.tsx b/src/view/com/composer/videos/SubtitleFilePicker.tsx
index 44a6b53b6..e49189f9b 100644
--- a/src/view/com/composer/videos/SubtitleFilePicker.tsx
+++ b/src/view/com/composer/videos/SubtitleFilePicker.tsx
@@ -56,7 +56,7 @@ export function SubtitleFilePicker({
       <View style={a.flex_row}>
         <Button
           onPress={handleClick}
-          label={_('Select subtitle file (.vtt)')}
+          label={_(msg`Select subtitle file (.vtt)`)}
           size="large"
           color="primary"
           variant="solid"
diff --git a/src/view/com/profile/ProfileMenu.tsx b/src/view/com/profile/ProfileMenu.tsx
index b3aec13b3..4a92c3ff9 100644
--- a/src/view/com/profile/ProfileMenu.tsx
+++ b/src/view/com/profile/ProfileMenu.tsx
@@ -191,7 +191,7 @@ let ProfileMenu = ({
   return (
     <EventStopper onKeyDown={false}>
       <Menu.Root>
-        <Menu.Trigger label={_(`More options`)}>
+        <Menu.Trigger label={_(msg`More options`)}>
           {({props}) => {
             return (
               <Button
diff --git a/src/view/com/util/UserAvatar.tsx b/src/view/com/util/UserAvatar.tsx
index e19eb06dc..20fc1c65d 100644
--- a/src/view/com/util/UserAvatar.tsx
+++ b/src/view/com/util/UserAvatar.tsx
@@ -413,7 +413,7 @@ let EditableUserAvatar = ({
             <Menu.Group>
               <Menu.Item
                 testID="changeAvatarRemoveBtn"
-                label={_(`Remove Avatar`)}
+                label={_(msg`Remove Avatar`)}
                 onPress={onRemoveAvatar}>
                 <Menu.ItemText>
                   <Trans>Remove Avatar</Trans>
diff --git a/src/view/com/util/UserBanner.tsx b/src/view/com/util/UserBanner.tsx
index 1e9a39607..e0ace5e48 100644
--- a/src/view/com/util/UserBanner.tsx
+++ b/src/view/com/util/UserBanner.tsx
@@ -149,7 +149,7 @@ export function UserBanner({
               <Menu.Group>
                 <Menu.Item
                   testID="changeBannerRemoveBtn"
-                  label={_(`Remove Banner`)}
+                  label={_(msg`Remove Banner`)}
                   onPress={onRemoveBanner}>
                   <Menu.ItemText>
                     <Trans>Remove Banner</Trans>