[Chat] Some tweaks (#10840)

src/components/dms/MessageItem.tsx

@@ -21,6 +21,7 @@ import {
   type ChatBskyActorDefs,
   ChatBskyConvoDefs,
   ChatBskyEmbedJoinLink,
+  moderateProfile,
   RichText as RichTextAPI,
 } from '@atproto/api'
 import {plural} from '@lingui/core/macro'
@@ -29,7 +30,6 @@ import {useQueryClient} from '@tanstack/react-query'
 
 import {isBlockedOrBlocking} from '#/lib/moderation/blocked-and-muted'
 import {createSanitizedDisplayName} from '#/lib/moderation/create-sanitized-display-name'
-import {makeProfileLink} from '#/lib/routes/links'
 import {sanitizeHandle} from '#/lib/strings/handles'
 import {useMaybeProfileShadow} from '#/state/cache/profile-shadow'
 import {type Shadow} from '#/state/cache/types'
@@ -38,12 +38,13 @@ import {useModerationOpts} from '#/state/preferences/moderation-opts'
 import {useProfileBlockMutationQueue} from '#/state/queries/profile'
 import {unstableCacheProfileView} from '#/state/queries/unstable-profile-cache'
 import {useSession} from '#/state/session'
+import {PreviewableUserAvatar} from '#/view/com/util/UserAvatar'
 import {atoms as a, native, platform, useTheme} from '#/alf'
 import {isOnlyEmoji} from '#/alf/typography'
 import {Button} from '#/components/Button'
 import {ActionsWrapper} from '#/components/dms/ActionsWrapper'
 import {useMessageDialogs} from '#/components/dms/MessageOverlays'
-import {InlineLinkText, Link} from '#/components/Link'
+import {InlineLinkText} from '#/components/Link'
 import * as ProfileCard from '#/components/ProfileCard'
 import * as Prompt from '#/components/Prompt'
 import {RichText} from '#/components/RichText'
@@ -227,22 +228,13 @@ let MessageItem = ({
 
   const avatar =
     profile && moderationOpts ? (
-      <Link
+      <PreviewableUserAvatar
-        style={[a.rounded_full]}
+        profile={profile}
-        label={l`${createSanitizedDisplayName(profile)}’s avatar`}
+        size={AVATAR_SIZE}
-        accessibilityHint={l`Opens this profile`}
+        type={profile.associated?.labeler ? 'labeler' : 'user'}
-        to={makeProfileLink({
+        onBeforePress={() => unstableCacheProfileView(queryClient, profile)}
-          did: profile.did,
+        moderation={moderateProfile(profile, moderationOpts).ui('avatar')}
-          handle: profile.handle,
+      />
-        })}
-        onPress={() => unstableCacheProfileView(queryClient, profile)}>
-        <ProfileCard.Avatar
-          profile={profile}
-          size={AVATAR_SIZE}
-          moderationOpts={moderationOpts}
-          disabledPreview
-        />
-      </Link>
     ) : (
       <ProfileCard.AvatarPlaceholder size={AVATAR_SIZE} />
     )

src/screens/Messages/components/MessagesList.tsx

@@ -308,7 +308,13 @@ export function MessagesList({
         } else {
           flatListRef.current?.scrollToOffset({
             offset: height,
-            animated: hasScrolled && height > prevContentHeight.current,
+            // only animate when new items were appended - pure layout growth
+            // (e.g. the composer spacer getting its height on web) should
+            // snap instantly rather than visibly scrolling
+            animated:
+              hasScrolled &&
+              height > prevContentHeight.current &&
+              renderItems.length > prevItemCount.current,
           })
         }
       }