@planningcenter/chat-react-native 3.38.0-rc.4 → 3.38.0-rc.6

package/src/screens/conversation_details_screen.tsx

@@ -49,8 +49,10 @@ import {
   useConversationUpdate,
 } from '../hooks/use_conversation'
 import { availableFeatures, useFeatures } from '../hooks/use_features'
+import { usePreviewAvatarDiameter } from '../hooks/use_preview_avatar_diameter'
 import { type ConversationResource, MemberResource, isDefined } from '../types'
 import { GroupResource } from '../types/resources/group_resource'
+import { MAX_FONT_SIZE_MULTIPLIER_LANDMARK } from '../utils'
 import { genderDisplayLabel } from '../utils/gender_display_label'
 import { tokens } from '../vendor/tapestry/tokens'
 // =========================================
@@ -634,10 +636,16 @@ function AvatarCard({
   onPress: () => void
 }) {
   const styles = useStyles()
+  const diameter = usePreviewAvatarDiameter()
 
   return (
     <View style={styles.avatarCard}>
-      <ConversationAvatar conversation={conversation} size="2xl" />
+      <ConversationAvatar
+        conversation={conversation}
+        size="2xl"
+        maxFontSizeMultiplier={MAX_FONT_SIZE_MULTIPLIER_LANDMARK}
+        style={{ width: diameter, height: diameter }}
+      />
       <Button
         title="Update avatar"
         iconNameLeft="general.pencil"
@@ -645,6 +653,7 @@ function AvatarCard({
         variant="outline"
         appearance="interaction"
         size="sm"
+        maxFontSizeMultiplier={MAX_FONT_SIZE_MULTIPLIER_LANDMARK}
       />
     </View>
   )