Make Discover and Following feed names translatable on Home screen

src/state/queries/feed.ts

@@ -8,6 +8,8 @@ import {
   moderateFeedGenerator,
   RichText,
 } from '@atproto/api'
+import {msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {
   type InfiniteData,
   keepPreviousData,
@@ -423,6 +425,7 @@ const pinnedFeedInfosQueryKeyRoot = 'pinnedFeedsInfos'
 export function usePinnedFeedsInfos() {
   const {hasSession} = useSession()
   const agent = useAgent()
+  const {_} = useLingui()
   const {data: preferences, isLoading: isLoadingPrefs} = usePreferencesQuery()
   const pinnedItems = preferences?.savedFeeds.filter(feed => feed.pinned) ?? []
 
@@ -436,7 +439,12 @@ export function usePinnedFeedsInfos() {
     ],
     queryFn: async () => {
       if (!hasSession) {
-        return [PWI_DISCOVER_FEED_STUB]
+        return [
+          {
+            ...PWI_DISCOVER_FEED_STUB,
+            displayName: _(msg({message: 'Discover', context: 'feed-name'})),
+          },
+        ]
       }
 
       let resolved = new Map<string, FeedSourceInfo>()
@@ -486,7 +494,7 @@ export function usePinnedFeedsInfos() {
         } else if (pinnedItem.type === 'timeline') {
           result.push({
             type: 'feed',
-            displayName: 'Following',
+            displayName: _(msg({message: 'Following', context: 'feed-name'})),
             uri: pinnedItem.value,
             feedDescriptor: 'following',
             route: {

src/view/com/home/HomeHeader.tsx

@@ -1,4 +1,6 @@
 import React from 'react'
+import {msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 import {useNavigation} from '@react-navigation/native'
 
 import {type NavigationProp} from '#/lib/routes/types'
@@ -18,6 +20,7 @@ export function HomeHeader(
   const {feeds, onSelect: onSelectProp} = props
   const {hasSession} = useSession()
   const navigation = useNavigation<NavigationProp>()
+  const {_} = useLingui()
 
   const hasPinnedCustom = React.useMemo<boolean>(() => {
     if (!hasSession) return false
@@ -30,10 +33,18 @@ export function HomeHeader(
   const items = React.useMemo(() => {
     const pinnedNames = feeds.map(f => f.displayName)
     if (!hasPinnedCustom) {
-      return pinnedNames.concat('Feeds ✨')
+      return pinnedNames.concat(
+        _(
+          msg({
+            message: 'Feeds ✨',
+            comment:
+              'Shown in tab bar on Home screen when logged out and when the user has no pinned feeds',
+          }),
+        ),
+      )
     }
     return pinnedNames
-  }, [hasPinnedCustom, feeds])
+  }, [hasPinnedCustom, feeds, _])
 
   const onPressFeedsLink = React.useCallback(() => {
     navigation.navigate('Feeds')

src/view/com/posts/DiscoverFallbackHeader.tsx

@@ -1,5 +1,6 @@
 import {View} from 'react-native'
-import {Trans} from '@lingui/macro'
+import {msg, Trans} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
 
 import {usePalette} from '#/lib/hooks/usePalette'
 import {InfoCircleIcon} from '#/lib/icons'
@@ -8,6 +9,7 @@ import {Text} from '../util/text/Text'
 
 export function DiscoverFallbackHeader() {
   const pal = usePalette('default')
+  const {_} = useLingui()
   return (
     <View
       style={[
@@ -31,7 +33,7 @@ export function DiscoverFallbackHeader() {
             <TextLink
               type="md-medium"
               href="/profile/bsky.app/feed/whats-hot"
-              text="Discover"
+              text={_(msg({message: 'Discover', context: 'feed-name'}))}
               style={pal.link}
             />
             .