Add support for avatar status badge (presence)

react/features/base/avatar/components/native/StatelessAvatar.js

@@ -12,6 +12,11 @@ import styles from './styles';
 
 type Props = AbstractProps & {
 
+    /**
+     * One of the expected status strings (e.g. 'available') to render a badge on the avatar, if necessary.
+     */
+    status?: ?string,
+
     /**
      * External style passed to the componant.
      */
@@ -46,18 +51,40 @@ export default class StatelessAvatar extends AbstractStatelessAvatar<Props> {
         }
 
         return (
-            <View
-                style = { [
-                    styles.avatarContainer(size),
-                    style
-                ] }>
-                { avatar }
+            <View>
+                <View
+                    style = { [
+                        styles.avatarContainer(size),
+                        style
+                    ] }>
+                    { avatar }
+                </View>
+                { this._renderAvatarStatus() }
             </View>
         );
     }
 
     _isIcon: (?string | ?Object) => boolean
 
+    /**
+     * Renders a badge representing the avatar status.
+     *
+     * @returns {React$Elementaa}
+     */
+    _renderAvatarStatus() {
+        const { size, status } = this.props;
+
+        if (!status) {
+            return null;
+        }
+
+        return (
+            <View style = { styles.badgeContainer }>
+                <View style = { styles.badge(size, status) } />
+            </View>
+        );
+    }
+
     /**
      * Renders the default avatar.
      *