merge main

src/screens/Home/NoFeedsPinned.tsx

@@ -3,13 +3,10 @@ import {View} from 'react-native'
 import {TID} from '@atproto/common-web'
 import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
-import {useNavigation} from '@react-navigation/native'
 
 import {DISCOVER_SAVED_FEED, TIMELINE_SAVED_FEED} from '#/lib/constants'
-import {isNative} from '#/platform/detection'
 import {useOverwriteSavedFeedsMutation} from '#/state/queries/preferences'
 import {UsePreferencesQueryResponse} from '#/state/queries/preferences'
-import {NavigationProp} from 'lib/routes/types'
 import {CenteredView} from '#/view/com/util/Views'
 import {atoms as a} from '#/alf'
 import {Button, ButtonIcon, ButtonText} from '#/components/Button'
@@ -26,7 +23,6 @@ export function NoFeedsPinned({
 }) {
   const {_} = useLingui()
   const headerOffset = useHeaderOffset()
-  const navigation = useNavigation<NavigationProp>()
   const {isPending, mutateAsync: overwriteSavedFeeds} =
     useOverwriteSavedFeedsMutation()
 
@@ -66,15 +62,6 @@ export function NoFeedsPinned({
     await overwriteSavedFeeds(toSave)
   }, [overwriteSavedFeeds, preferences.savedFeeds])
 
-  const onPressFeedsLink = React.useCallback(() => {
-    if (isNative) {
-      // Hack that's necessary due to how our navigators are set up.
-      navigation.navigate('FeedsTab')
-      navigation.popToTop()
-      return false
-    }
-  }, [navigation])
-
   return (
     <CenteredView sideBorders style={[a.h_full_vh]}>
       <View
@@ -115,7 +102,6 @@ export function NoFeedsPinned({
           <Link
             label={_(msg`Browse other feeds`)}
             to="/feeds"
-            onPress={onPressFeedsLink}
             size="medium"
             variant="solid"
             color="secondary">

src/screens/Messages/Conversation/index.tsx

@@ -1,5 +1,6 @@
 import React, {useCallback} from 'react'
 import {View} from 'react-native'
+import {useKeyboardController} from 'react-native-keyboard-controller'
 import {AppBskyActorDefs, moderateProfile, ModerationOpts} from '@atproto/api'
 import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
@@ -34,6 +35,17 @@ export function MessagesConversationScreen({route}: Props) {
   const convoId = route.params.conversation
   const {setCurrentConvoId} = useCurrentConvoId()
 
+  const {setEnabled} = useKeyboardController()
+  useFocusEffect(
+    useCallback(() => {
+      if (isWeb) return
+      setEnabled(true)
+      return () => {
+        setEnabled(false)
+      }
+    }, [setEnabled]),
+  )
+
   useFocusEffect(
     useCallback(() => {
       setCurrentConvoId(convoId)

src/screens/Messages/List/ChatListItem.tsx

@@ -20,6 +20,7 @@ import {useProfileShadow} from '#/state/cache/profile-shadow'
 import {useModerationOpts} from '#/state/preferences/moderation-opts'
 import {useSession} from '#/state/session'
 import {useHaptics} from 'lib/haptics'
+import {decrementBadgeCount} from 'lib/notifications/notifications'
 import {logEvent} from 'lib/statsig/statsig'
 import {sanitizeDisplayName} from 'lib/strings/display-names'
 import {TimeElapsed} from '#/view/com/util/TimeElapsed'
@@ -177,14 +178,16 @@ function ChatListItemReady({
 
   const onPress = useCallback(
     (e: GestureResponderEvent) => {
+      decrementBadgeCount(convo.unreadCount)
       if (isDeletedAccount) {
         e.preventDefault()
+        menuControl.open()
         return false
       } else {
         logEvent('chat:open', {logContext: 'ChatsList'})
       }
     },
-    [isDeletedAccount],
+    [convo.unreadCount, isDeletedAccount, menuControl],
   )
 
   const onLongPress = useCallback(() => {
@@ -206,7 +209,9 @@ function ChatListItemReady({
         accessibilityHint={
           !isDeletedAccount
             ? _(msg`Go to conversation with ${profile.handle}`)
-            : undefined
+            : _(
+                msg`This conversation is with a deleted or a deactivated account. Press for options.`,
+              )
         }
         accessibilityActions={
           isNative
@@ -218,12 +223,7 @@ function ChatListItemReady({
         }
         onPress={onPress}
         onLongPress={isNative ? onLongPress : undefined}
-        onAccessibilityAction={onLongPress}
-        style={[
-          web({
-            cursor: isDeletedAccount ? 'default' : 'pointer',
-          }),
-        ]}>
+        onAccessibilityAction={onLongPress}>
         {({hovered, pressed, focused}) => (
           <View
             style={[
@@ -233,9 +233,7 @@ function ChatListItemReady({
               a.px_lg,
               a.py_md,
               a.gap_md,
-              (hovered || pressed || focused) &&
-                !isDeletedAccount &&
-                t.atoms.bg_contrast_25,
+              (hovered || pressed || focused) && t.atoms.bg_contrast_25,
               t.atoms.border_contrast_low,
             ]}>
             <UserAvatar

src/screens/Profile/Header/ProfileHeaderStandard.tsx

@@ -30,6 +30,10 @@ import {Button, ButtonIcon, ButtonText} from '#/components/Button'
 import {MessageProfileButton} from '#/components/dms/MessageProfileButton'
 import {Check_Stroke2_Corner0_Rounded as Check} from '#/components/icons/Check'
 import {PlusLarge_Stroke2_Corner0_Rounded as Plus} from '#/components/icons/Plus'
+import {
+  KnownFollowers,
+  shouldShowKnownFollowers,
+} from '#/components/KnownFollowers'
 import * as Prompt from '#/components/Prompt'
 import {RichText} from '#/components/RichText'
 import {ProfileHeaderDisplayName} from './DisplayName'
@@ -268,6 +272,16 @@ let ProfileHeaderStandard = ({
                 />
               </View>
             ) : undefined}
+
+            {!isMe &&
+              shouldShowKnownFollowers(profile.viewer?.knownFollowers) && (
+                <View style={[a.flex_row, a.align_center, a.gap_sm, a.pt_md]}>
+                  <KnownFollowers
+                    profile={profile}
+                    moderationOpts={moderationOpts}
+                  />
+                </View>
+              )}
           </>
         )}
       </View>

src/screens/Profile/Header/Shell.tsx

@@ -83,7 +83,7 @@ let ProfileHeaderShell = ({
 
       {!isPlaceholderProfile && (
         <View
-          style={[a.px_lg, a.pb_sm]}
+          style={[a.px_lg, a.py_xs]}
           pointerEvents={isIOS ? 'auto' : 'box-none'}>
           {isMe ? (
             <LabelsOnMe details={{did: profile.did}} labels={profile.labels} />

src/screens/Profile/KnownFollowers.tsx

@@ -0,0 +1,134 @@
+import React from 'react'
+import {View} from 'react-native'
+import {AppBskyActorDefs} from '@atproto/api'
+import {msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {useFocusEffect} from '@react-navigation/native'
+
+import {cleanError} from '#/lib/strings/errors'
+import {logger} from '#/logger'
+import {useProfileKnownFollowersQuery} from '#/state/queries/known-followers'
+import {useResolveDidQuery} from '#/state/queries/resolve-uri'
+import {useSetMinimalShellMode} from '#/state/shell'
+import {useInitialNumToRender} from 'lib/hooks/useInitialNumToRender'
+import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types'
+import {ProfileCardWithFollowBtn} from '#/view/com/profile/ProfileCard'
+import {List} from '#/view/com/util/List'
+import {ViewHeader} from '#/view/com/util/ViewHeader'
+import {
+  ListFooter,
+  ListHeaderDesktop,
+  ListMaybePlaceholder,
+} from '#/components/Lists'
+
+function renderItem({item}: {item: AppBskyActorDefs.ProfileViewBasic}) {
+  return <ProfileCardWithFollowBtn key={item.did} profile={item} />
+}
+
+function keyExtractor(item: AppBskyActorDefs.ProfileViewBasic) {
+  return item.did
+}
+
+type Props = NativeStackScreenProps<
+  CommonNavigatorParams,
+  'ProfileKnownFollowers'
+>
+export const ProfileKnownFollowersScreen = ({route}: Props) => {
+  const {_} = useLingui()
+  const setMinimalShellMode = useSetMinimalShellMode()
+  const initialNumToRender = useInitialNumToRender()
+
+  const {name} = route.params
+
+  const [isPTRing, setIsPTRing] = React.useState(false)
+  const {
+    data: resolvedDid,
+    isLoading: isDidLoading,
+    error: resolveError,
+  } = useResolveDidQuery(route.params.name)
+  const {
+    data,
+    isLoading: isFollowersLoading,
+    isFetchingNextPage,
+    hasNextPage,
+    fetchNextPage,
+    error,
+    refetch,
+  } = useProfileKnownFollowersQuery(resolvedDid)
+
+  const onRefresh = React.useCallback(async () => {
+    setIsPTRing(true)
+    try {
+      await refetch()
+    } catch (err) {
+      logger.error('Failed to refresh followers', {message: err})
+    }
+    setIsPTRing(false)
+  }, [refetch, setIsPTRing])
+
+  const onEndReached = React.useCallback(async () => {
+    if (isFetchingNextPage || !hasNextPage || !!error) return
+    try {
+      await fetchNextPage()
+    } catch (err) {
+      logger.error('Failed to load more followers', {message: err})
+    }
+  }, [isFetchingNextPage, hasNextPage, error, fetchNextPage])
+
+  const followers = React.useMemo(() => {
+    if (data?.pages) {
+      return data.pages.flatMap(page => page.followers)
+    }
+    return []
+  }, [data])
+
+  const isError = Boolean(resolveError || error)
+
+  useFocusEffect(
+    React.useCallback(() => {
+      setMinimalShellMode(false)
+    }, [setMinimalShellMode]),
+  )
+
+  if (followers.length < 1) {
+    return (
+      <ListMaybePlaceholder
+        isLoading={isDidLoading || isFollowersLoading}
+        isError={isError}
+        emptyType="results"
+        emptyMessage={_(msg`You don't follow any users who follow @${name}.`)}
+        errorMessage={cleanError(resolveError || error)}
+        onRetry={isError ? refetch : undefined}
+      />
+    )
+  }
+
+  return (
+    <View style={{flex: 1}}>
+      <ViewHeader title={_(msg`Followers you know`)} />
+      <List
+        data={followers}
+        renderItem={renderItem}
+        keyExtractor={keyExtractor}
+        refreshing={isPTRing}
+        onRefresh={onRefresh}
+        onEndReached={onEndReached}
+        onEndReachedThreshold={4}
+        ListHeaderComponent={
+          <ListHeaderDesktop title={_(msg`Followers you know`)} />
+        }
+        ListFooterComponent={
+          <ListFooter
+            isFetchingNextPage={isFetchingNextPage}
+            error={cleanError(error)}
+            onRetry={fetchNextPage}
+          />
+        }
+        // @ts-ignore our .web version only -prf
+        desktopFixedHeight
+        initialNumToRender={initialNumToRender}
+        windowSize={11}
+      />
+    </View>
+  )
+}

src/screens/Profile/Sections/Feed.tsx

@@ -56,7 +56,7 @@ export const ProfileFeedSection = React.forwardRef<
   }))
 
   const renderPostsEmpty = React.useCallback(() => {
-    return <EmptyState icon="feed" message={_(msg`This feed is empty!`)} />
+    return <EmptyState icon="growth" message={_(msg`No posts yet.`)} />
   }, [_])
 
   React.useEffect(() => {