Merge branch 'develop' of https://github.com/matrix-org/matrix-react-sdk into t3chguy/room-list/14466

src/components/structures/GroupView.js

@@ -1003,9 +1003,10 @@ export default createReactClass({
                     this.state.inviterProfile.avatarUrl, 36, 36,
                 ) : null;
 
-            let inviterName = group.inviter.userId;
+            const inviter = group.inviter || {};
+            let inviterName = inviter.userId;
             if (this.state.inviterProfile) {
-                inviterName = this.state.inviterProfile.displayName || group.inviter.userId;
+                inviterName = this.state.inviterProfile.displayName || inviter.userId;
             }
             return <div className="mx_GroupView_membershipSection mx_GroupView_membershipSection_invited">
                 <div className="mx_GroupView_membershipSubSection">
@@ -1016,7 +1017,7 @@ export default createReactClass({
                             height={36}
                         />
                         { _t("%(inviter)s has invited you to join this community", {
-                            inviter: inviterName,
+                            inviter: inviterName || _t("Someone"),
                         }) }
                     </div>
                     <div className="mx_GroupView_membership_buttonContainer">

src/components/views/elements/AccessibleTooltipButton.tsx

@@ -25,6 +25,7 @@ interface ITooltipProps extends React.ComponentProps<typeof AccessibleButton> {
     title: string;
     tooltip?: React.ReactNode;
     tooltipClassName?: string;
+    forceHide?: boolean;
 }
 
 interface IState {
@@ -39,7 +40,16 @@ export default class AccessibleTooltipButton extends React.PureComponent<IToolti
         };
     }
 
+    componentDidUpdate(prevProps: Readonly<ITooltipProps>) {
+        if (!prevProps.forceHide && this.props.forceHide && this.state.hover) {
+            this.setState({
+                hover: false,
+            });
+        }
+    }
+
     onMouseOver = () => {
+        if (this.props.forceHide) return;
         this.setState({
             hover: true,
         });

src/components/views/rooms/RoomTile.tsx

@@ -113,7 +113,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
     };
 
     private get showContextMenu(): boolean {
-        return !this.props.isMinimized && this.props.tag !== DefaultTagID.Invite;
+        return this.props.tag !== DefaultTagID.Invite;
     }
 
     private get showMessagePreview(): boolean {
@@ -304,7 +304,9 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
     private onClickMute = ev => this.saveNotifState(ev, MUTE);
 
     private renderNotificationsMenu(isActive: boolean): React.ReactElement {
-        if (MatrixClientPeg.get().isGuest() || this.props.tag === DefaultTagID.Archived || !this.showContextMenu) {
+        if (MatrixClientPeg.get().isGuest() || this.props.tag === DefaultTagID.Archived ||
+            !this.showContextMenu || this.props.isMinimized
+        ) {
             // the menu makes no sense in these cases so do not show one
             return null;
         }
@@ -530,9 +532,13 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
             ariaDescribedBy = messagePreviewId(this.props.room.roomId);
         }
 
+        const props: Partial<React.ComponentProps<typeof AccessibleTooltipButton>> = {};
         let Button: React.ComponentType<React.ComponentProps<typeof AccessibleButton>> = AccessibleButton;
         if (this.props.isMinimized) {
             Button = AccessibleTooltipButton;
+            props.title = name;
+            // force the tooltip to hide whilst we are showing the context menu
+            props.forceHide = !!this.state.generalMenuPosition;
         }
 
         return (
@@ -540,6 +546,7 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
                 <RovingTabIndexWrapper inputRef={this.roomTileRef}>
                     {({onFocus, isActive, ref}) =>
                         <Button
+                            {...props}
                             onFocus={onFocus}
                             tabIndex={isActive ? 0 : -1}
                             inputRef={ref}
@@ -550,7 +557,6 @@ export default class RoomTile extends React.PureComponent<IProps, IState> {
                             aria-label={ariaLabel}
                             aria-selected={this.state.selected}
                             aria-describedby={ariaDescribedBy}
-                            title={this.props.isMinimized ? name : undefined}
                         >
                             {roomAvatar}
                             {nameContainer}