UserAvatarWithPresence: Convert all callers to use …ById instead

Author: chrisbobbe

src/lightbox/Lightbox.js

@@ -106,9 +106,8 @@ export default function Lightbox(props: Props): Node {
               navigation.dispatch(navigateBack());
             }}
             timestamp={message.timestamp}
-            avatarUrl={message.avatar_url}
             senderName={message.sender_full_name}
-            senderEmail={message.sender_email}
+            senderId={message.sender_id}
           />
         </View>
         <View

src/lightbox/LightboxHeader.js

@@ -6,10 +6,10 @@ import { SafeAreaView } from 'react-native-safe-area-context';
 
 import { shortTime, humanDate } from '../utils/date';
 import { createStyleSheet } from '../styles';
-import UserAvatarWithPresence from '../common/UserAvatarWithPresence';
+import { UserAvatarWithPresenceById } from '../common/UserAvatarWithPresence';
 import { Icon } from '../common/Icons';
-import { AvatarURL } from '../utils/avatar';
 import { OfflineNoticePlaceholder } from '../boot/OfflineNoticeProvider';
+import type { UserId } from '../api/idTypes';
 
 const styles = createStyleSheet({
   text: {
@@ -40,9 +40,8 @@ const styles = createStyleSheet({
 
 type Props = $ReadOnly<{|
   senderName: string,
-  senderEmail: string,
+  senderId: UserId,
   timestamp: number,
-  avatarUrl: AvatarURL,
   onPressBack: () => void,
 |}>;
 
@@ -55,7 +54,7 @@ type Props = $ReadOnly<{|
  * @prop [onPressBack]
  */
 export default function LightboxHeader(props: Props): Node {
-  const { onPressBack, senderName, senderEmail, timestamp, avatarUrl } = props;
+  const { onPressBack, senderName, senderId, timestamp } = props;
   const displayDate = humanDate(new Date(timestamp * 1000));
   const time = shortTime(new Date(timestamp * 1000));
   const subheader = `${displayDate} at ${time}`;
@@ -64,7 +63,7 @@ export default function LightboxHeader(props: Props): Node {
     <SafeAreaView mode="padding" edges={['top']}>
       <OfflineNoticePlaceholder />
       <SafeAreaView mode="padding" edges={['right', 'left']} style={styles.contentArea}>
-        <UserAvatarWithPresence size={36} avatarUrl={avatarUrl} email={senderEmail} />
+        <UserAvatarWithPresenceById size={36} userId={senderId} />
         <View style={styles.text}>
           <Text style={styles.name} numberOfLines={1}>
             {senderName}

src/user-picker/AvatarItem.js

@@ -5,7 +5,7 @@ import { Animated, Easing, View } from 'react-native';
 import type AnimatedValue from 'react-native/Libraries/Animated/nodes/AnimatedValue';
 
 import type { UserId, UserOrBot } from '../types';
-import UserAvatarWithPresence from '../common/UserAvatarWithPresence';
+import { UserAvatarWithPresenceById } from '../common/UserAvatarWithPresence';
 import ComponentWithOverlay from '../common/ComponentWithOverlay';
 import ZulipText from '../common/ZulipText';
 import Touchable from '../common/Touchable';
@@ -77,12 +77,7 @@ export default class AvatarItem extends PureComponent<Props> {
             overlayPosition="bottom-right"
             overlay={<IconCancel color="gray" size={20} />}
           >
-            <UserAvatarWithPresence
-              key={user.user_id}
-              size={50}
-              avatarUrl={user.avatar_url}
-              email={user.email}
-            />
+            <UserAvatarWithPresenceById key={user.user_id} size={50} userId={user.user_id} />
           </ComponentWithOverlay>
         </Touchable>
         <View style={styles.textFrame}>