diff --git a/src/components/views/groups/GroupInviteTile.js b/src/components/views/groups/GroupInviteTile.js
index bc861eb156..a21b091145 100644
--- a/src/components/views/groups/GroupInviteTile.js
+++ b/src/components/views/groups/GroupInviteTile.js
@@ -16,7 +16,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
-import React, {createRef} from 'react';
+import React from 'react';
import PropTypes from 'prop-types';
import createReactClass from 'create-react-class';
import { MatrixClient } from 'matrix-js-sdk';
@@ -27,6 +27,7 @@ import classNames from 'classnames';
import MatrixClientPeg from "../../../MatrixClientPeg";
import {ContextMenu, ContextMenuButton, toRightOf} from "../../structures/ContextMenu";
+// XXX this class copies a lot from RoomTile.js
export default createReactClass({
displayName: 'GroupInviteTile',
@@ -47,10 +48,6 @@ export default createReactClass({
});
},
- componentDidMount: function() {
- this._contextMenuButton = createRef();
- },
-
onClick: function(e) {
dis.dispatch({
action: 'view_group',
@@ -74,16 +71,12 @@ export default createReactClass({
});
},
- openMenu: function(e) {
+ _showContextMenu: function(boundingClientRect) {
// Only allow non-guests to access the context menu
if (MatrixClientPeg.get().isGuest()) return;
- // Prevent the GroupInviteTile onClick event firing as well
- e.stopPropagation();
- e.preventDefault();
-
const state = {
- menuDisplayed: true,
+ contextMenuPosition: boundingClientRect,
};
// If the badge is clicked, then no longer show tooltip
@@ -94,9 +87,28 @@ export default createReactClass({
this.setState(state);
},
+ onContextMenuButtonClick: function(e) {
+ // Prevent the RoomTile onClick event firing as well
+ e.stopPropagation();
+ e.preventDefault();
+
+ this._showContextMenu(e.target.getBoundingClientRect());
+ },
+
+ onContextMenu: function(e) {
+ // Prevent the native context menu
+ e.preventDefault();
+
+ this._showContextMenu({
+ right: e.clientX,
+ top: e.clientY,
+ height: 0,
+ });
+ },
+
closeMenu: function() {
this.setState({
- menuDisplayed: false,
+ contextMenuPosition: null,
});
},
@@ -110,15 +122,16 @@ export default createReactClass({
const av =