ShareDialog share Message, link to timestamp and permalink in ctx menu

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

src/components/views/context_menus/MessageContextMenu.js

@@ -184,6 +184,15 @@ module.exports = React.createClass({
         this.closeMenu();
     },
 
+    onPermalinkClick: function(e: Event) {
+        e.preventDefault();
+        const ShareDialog = sdk.getComponent("dialogs.ShareDialog");
+        Modal.createTrackedDialog('share room message dialog', '', ShareDialog, {
+            target: this.props.mxEvent,
+        });
+        this.closeMenu();
+    },
+
     onReplyClick: function() {
         dis.dispatch({
             action: 'reply_to_event',
@@ -290,7 +299,7 @@ module.exports = React.createClass({
         const permalinkButton = (
             <div className="mx_MessageContextMenu_field">
                 <a href={makeEventPermalink(this.props.mxEvent.getRoomId(), this.props.mxEvent.getId())}
-                  target="_blank" rel="noopener" onClick={this.closeMenu}>{ _t('Permalink') }</a>
+                  target="_blank" rel="noopener" onClick={this.onPermalinkClick}>{ _t('Share Message') }</a>
             </div>
         );
 

src/components/views/dialogs/ShareDialog.js

@@ -16,7 +16,7 @@ limitations under the License.
 
 import React from 'react';
 import PropTypes from 'prop-types';
-import {Room, User, Group, RoomMember} from 'matrix-js-sdk';
+import {Room, User, Group, RoomMember, MatrixEvent} from 'matrix-js-sdk';
 import sdk from '../../../index';
 import { _t } from '../../../languageHandler';
 import QRCode from 'qrcode-react';
@@ -59,7 +59,7 @@ export default class ShareDialog extends React.Component {
             PropTypes.instanceOf(User),
             PropTypes.instanceOf(Group),
             PropTypes.instanceOf(RoomMember),
-            // PropTypes.instanceOf(MatrixEvent),
+            PropTypes.instanceOf(MatrixEvent),
         ]).isRequired,
     };
 
@@ -155,6 +155,9 @@ export default class ShareDialog extends React.Component {
         } else if (this.props.target instanceof Group) {
             title = _t('Share Community');
             matrixToUrl = makeGroupPermalink(this.props.target.groupId);
+        } else if (this.props.target instanceof MatrixEvent) {
+            title = _t('Share Room Message');
+            matrixToUrl = makeEventPermalink(this.props.target.roomId, this.props.target.eventId);
         }
 
         const encodedUrl = encodeURIComponent(matrixToUrl);

src/components/views/rooms/EventTile.js

@@ -438,6 +438,17 @@ module.exports = withMatrixClient(React.createClass({
         });
     },
 
+    onPermalinkShareClicked: function(e) {
+        // These permalinks are like above, can be opened in new tab/window to matrix.to
+        // but otherwise fire the ShareDialog as it makes little sense to click permalink
+        // whilst it is in the current room
+        e.preventDefault();
+        const ShareDialog = sdk.getComponent("dialogs.ShareDialog");
+        Modal.createTrackedDialog('share room event dialog', '', ShareDialog, {
+            target: this.props.mxEvent,
+        });
+    },
+
     _renderE2EPadlock: function() {
         const ev = this.props.mxEvent;
         const props = {onClick: this.onCryptoClicked};
@@ -667,7 +678,7 @@ module.exports = withMatrixClient(React.createClass({
                         { avatar }
                         { sender }
                         <div className="mx_EventTile_reply">
-                            <a href={permalink} onClick={this.onPermalinkClicked}>
+                            <a href={permalink} onClick={this.onPermalinkShareClicked}>
                                 { timestamp }
                             </a>
                             { this._renderE2EPadlock() }
@@ -694,7 +705,7 @@ module.exports = withMatrixClient(React.createClass({
                         { avatar }
                         { sender }
                         <div className="mx_EventTile_line">
-                            <a href={permalink} onClick={this.onPermalinkClicked}>
+                            <a href={permalink} onClick={this.onPermalinkShareClicked}>
                                 { timestamp }
                             </a>
                             { this._renderE2EPadlock() }