Add missing translations and fix react key error in MyLists.tsx (#2103)

* add missing translations

* fix key errors in MyLists

* Update UserAddRemoveLists.tsx

src/view/com/lists/MyLists.tsx

@@ -82,6 +82,7 @@ export function MyLists({
       if (item === EMPTY) {
         return (
           <View
+            key={item._reactKey}
             testID="listsEmpty"
             style={[{padding: 18, borderTopWidth: 1}, pal.border]}>
             <Text style={pal.textLight}>
@@ -92,13 +93,14 @@ export function MyLists({
       } else if (item === ERROR_ITEM) {
         return (
           <ErrorMessage
+            key={item._reactKey}
             message={cleanError(error)}
             onPressTryAgain={onRefresh}
           />
         )
       } else if (item === LOADING) {
         return (
-          <View style={{padding: 20}}>
+          <View key={item._reactKey} style={{padding: 20}}>
             <ActivityIndicator />
           </View>
         )
@@ -107,6 +109,7 @@ export function MyLists({
         renderItem(item, index)
       ) : (
         <ListCard
+          key={item.uri}
           list={item}
           testID={`list-${item.name}`}
           style={styles.item}
@@ -123,7 +126,7 @@ export function MyLists({
         <FlatListCom
           testID={testID ? `${testID}-flatlist` : undefined}
           data={items}
-          keyExtractor={(item: any) => item._reactKey}
+          keyExtractor={item => (item.uri ? item.uri : item._reactKey)}
           renderItem={renderItemInner}
           refreshControl={
             <RefreshControl

src/view/com/modals/UserAddRemoveLists.tsx

@@ -58,6 +58,7 @@ export function Component({
         inline
         renderItem={(list, index) => (
           <ListItem
+            key={list.uri}
             index={index}
             list={list}
             memberships={memberships}

src/view/screens/ModerationModlists.tsx

@@ -14,6 +14,7 @@ import {SimpleViewHeader} from 'view/com/util/SimpleViewHeader'
 import {s} from 'lib/styles'
 import {useSetMinimalShellMode} from '#/state/shell'
 import {useModalControls} from '#/state/modals'
+import {Trans} from '@lingui/macro'
 
 type Props = NativeStackScreenProps<CommonNavigatorParams, 'ModerationModlists'>
 export function ModerationModlistsScreen({}: Props) {
@@ -54,10 +55,12 @@ export function ModerationModlistsScreen({}: Props) {
         }>
         <View style={{flex: 1}}>
           <Text type="title-lg" style={[pal.text, {fontWeight: 'bold'}]}>
-            Moderation Lists
+            <Trans>Moderation Lists</Trans>
           </Text>
           <Text style={pal.textLight}>
-            Public, shareable lists of users to mute or block in bulk.
+            <Trans>
+              Public, shareable lists of users to mute or block in bulk.
+            </Trans>
           </Text>
         </View>
         <View>
@@ -72,7 +75,7 @@ export function ModerationModlistsScreen({}: Props) {
             }}>
             <FontAwesomeIcon icon="plus" color={pal.colors.text} />
             <Text type="button" style={pal.text}>
-              New
+              <Trans>New</Trans>
             </Text>
           </Button>
         </View>