From 1bbed1cb2bf1248e9ca8a1511cfe8a385c5f21f7 Mon Sep 17 00:00:00 2001
From: Andrei Stanciu <andrei.stanciu@geminisols.ro>
Date: Fri, 10 Feb 2017 16:56:48 +0200
Subject: Add permalink to timestamp (#5206)

* Add permalink to timestamp

* Add permalink to timestamp

* Add permalink to timestamp

* Add permalink to timestamp

* fix error with duplicated import

* underline permalink on hover
---
 webapp/components/rhs_comment.jsx | 53 +++++++++++++++++++++++++++++++++------
 1 file changed, 46 insertions(+), 7 deletions(-)

(limited to 'webapp/components/rhs_comment.jsx')

diff --git a/webapp/components/rhs_comment.jsx b/webapp/components/rhs_comment.jsx
index 24baaa09c..67fd394b9 100644
--- a/webapp/components/rhs_comment.jsx
+++ b/webapp/components/rhs_comment.jsx
@@ -12,6 +12,8 @@ import RhsDropdown from 'components/rhs_dropdown.jsx';
 import * as GlobalActions from 'actions/global_actions.jsx';
 import {flagPost, unflagPost} from 'actions/post_actions.jsx';
 
+import TeamStore from 'stores/team_store.jsx';
+
 import * as Utils from 'utils/utils.jsx';
 import * as PostUtils from 'utils/post_utils.jsx';
 
@@ -24,6 +26,7 @@ import {FormattedMessage} from 'react-intl';
 import loadingGif from 'images/load.gif';
 
 import React from 'react';
+import {Link} from 'react-router/es6';
 
 export default class RhsComment extends React.Component {
     constructor(props) {
@@ -38,7 +41,23 @@ export default class RhsComment extends React.Component {
         this.canDelete = false;
         this.editDisableAction = new DelayedAction(this.handleEditDisable);
 
-        this.state = {};
+        this.state = {
+            currentTeamDisplayName: TeamStore.getCurrent().name,
+            width: '',
+            height: ''
+        };
+    }
+
+    componentDidMount() {
+        window.addEventListener('resize', () => {
+            Utils.updateWindowDimensions(this);
+        });
+    }
+
+    componentWillUnmount() {
+        window.removeEventListener('resize', () => {
+            Utils.updateWindowDimensions(this);
+        });
     }
 
     handlePermalink(e) {
@@ -235,6 +254,31 @@ export default class RhsComment extends React.Component {
         );
     }
 
+    timeTag(post, timeOptions) {
+        return (
+            <time
+                className='post__time'
+                dateTime={Utils.getDateForUnixTicks(post.create_at).toISOString()}
+            >
+                {Utils.getDateForUnixTicks(post.create_at).toLocaleString('en', timeOptions)}
+            </time>
+        );
+    }
+
+    renderTimeTag(post, timeOptions) {
+        return Utils.isMobile() ?
+            this.timeTag(post, timeOptions) :
+            (
+                <Link
+                    to={`/${this.state.currentTeamDisplayName}/pl/${post.id}`}
+                    target='_blank'
+                    className='post__permalink'
+                >
+                    {this.timeTag(post, timeOptions)}
+                </Link>
+            );
+    }
+
     render() {
         const post = this.props.post;
         const flagIcon = Constants.FLAG_ICON_SVG;
@@ -479,12 +523,7 @@ export default class RhsComment extends React.Component {
                             </li>
                             {botIndicator}
                             <li className='col'>
-                                <time
-                                    className='post__time'
-                                    dateTime={Utils.getDateForUnixTicks(post.create_at).toISOString()}
-                                >
-                                    {Utils.getDateForUnixTicks(post.create_at).toLocaleString('en', timeOptions)}
-                                </time>
+                                {this.renderTimeTag(post, timeOptions)}
                                 {flagTrigger}
                             </li>
                             {options}
-- 
cgit v1.2.3-1-g7c22