Show group name in flair tooltip if one is set

e.g. "Group Name (+group_id:homeserver)" or "+group_id:homeserver"

Fixes element-hq/element-web#5341

Author: lukebarnard1

src/components/views/elements/Flair.js

@@ -43,18 +43,22 @@ class FlairAvatar extends React.Component {
     render() {
         const httpUrl = this.context.matrixClient.mxcUrlToHttp(
             this.props.groupProfile.avatarUrl, 16, 16, 'scale', false);
+        const tooltip = this.props.groupProfile.name ?
+            `${this.props.groupProfile.name} (${this.props.groupProfile.groupId})`:
+            this.props.groupProfile.groupId;
         return <img
             src={httpUrl}
             width="16"
             height="16"
             onClick={this.onClick}
-            title={this.props.groupProfile.groupId} />;
+            title={tooltip} />;
     }
 }
 
 FlairAvatar.propTypes = {
     groupProfile: PropTypes.shape({
         groupId: PropTypes.string.isRequired,
+        name: PropTypes.string.isRequired,
         avatarUrl: PropTypes.string.isRequired,
     }),
 };