Add back button to RHS threads from pinned posts (#6306)

7 files changed, 31 insertions, 9 deletions

diff --git a/webapp/actions/global_actions.jsx b/webapp/actions/global_actions.jsx
index 97d3b1071..8d3eddfd9 100644
--- a/webapp/actions/global_actions.jsx
+++ b/webapp/actions/global_actions.jsx
@@ -168,7 +168,8 @@ export function emitPostFocusRightHandSideFromSearch(post, isMentionSearch) {
                 type: ActionTypes.RECEIVED_POST_SELECTED,
                 postId: Utils.getRootId(post),
                 from_search: SearchStore.getSearchTerm(),
-                from_flagged_posts: SearchStore.getIsFlaggedPosts()
+                from_flagged_posts: SearchStore.getIsFlaggedPosts(),
+                from_pinned_posts: SearchStore.getIsPinnedPosts()
             });
 
             AppDispatcher.handleServerAction({
diff --git a/webapp/actions/post_actions.jsx b/webapp/actions/post_actions.jsx
index 3174fe681..969c764f1 100644
--- a/webapp/actions/post_actions.jsx
+++ b/webapp/actions/post_actions.jsx
@@ -142,7 +142,7 @@ export function getFlaggedPosts() {
     );
 }
 
-export function getPinnedPosts(channelId) {
+export function getPinnedPosts(channelId = ChannelStore.getCurrentId()) {
     Client.getPinnedPosts(channelId,
         (data) => {
             AppDispatcher.handleServerAction({
diff --git a/webapp/components/rhs_header_post.jsx b/webapp/components/rhs_header_post.jsx
index 951201024..55c16b0ae 100644
--- a/webapp/components/rhs_header_post.jsx
+++ b/webapp/components/rhs_header_post.jsx
@@ -6,7 +6,7 @@ import Constants from 'utils/constants.jsx';
 import {Tooltip, OverlayTrigger} from 'react-bootstrap';
 
 import * as GlobalActions from 'actions/global_actions.jsx';
-import {getFlaggedPosts} from 'actions/post_actions.jsx';
+import {getFlaggedPosts, getPinnedPosts} from 'actions/post_actions.jsx';
 
 import {FormattedMessage} from 'react-intl';
 
@@ -24,15 +24,18 @@ export default class RhsHeaderPost extends React.Component {
 
         this.state = {};
     }
+
     handleClose(e) {
         e.preventDefault();
         GlobalActions.emitCloseRightHandSide();
         this.props.shrink();
     }
+
     toggleSize(e) {
         e.preventDefault();
         this.props.toggleSize();
     }
+
     handleBack(e) {
         e.preventDefault();
 
@@ -50,8 +53,11 @@ export default class RhsHeaderPost extends React.Component {
             });
         } else if (this.props.fromFlaggedPosts) {
             getFlaggedPosts();
+        } else if (this.props.fromPinnedPosts) {
+            getPinnedPosts();
         }
     }
+
     render() {
         let back;
         const closeSidebarTooltip = (
@@ -91,6 +97,15 @@ export default class RhsHeaderPost extends React.Component {
                     />
                 </Tooltip>
             );
+        } else if (this.props.fromPinnedPosts) {
+            backToResultsTooltip = (
+                <Tooltip id='backToResultsTooltip'>
+                    <FormattedMessage
+                        id='rhs_header.backToPinnedTooltip'
+                        defaultMessage='Back to Pinned Posts'
+                    />
+                </Tooltip>
+            );
         }
 
         const expandSidebarTooltip = (
@@ -111,7 +126,7 @@ export default class RhsHeaderPost extends React.Component {
             </Tooltip>
         );
 
-        if (this.props.fromSearch || this.props.fromFlaggedPosts || this.props.isWebrtc) {
+        if (this.props.fromSearch || this.props.fromFlaggedPosts || this.props.isWebrtc || this.props.fromPinnedPosts) {
             back = (
                 <a
                     href='#'
@@ -190,6 +205,7 @@ RhsHeaderPost.propTypes = {
     isWebrtc: React.PropTypes.bool,
     fromSearch: React.PropTypes.string,
     fromFlaggedPosts: React.PropTypes.bool,
+    fromPinnedPosts: React.PropTypes.bool,
     toggleSize: React.PropTypes.func,
     shrink: React.PropTypes.func
 };
diff --git a/webapp/components/rhs_thread.jsx b/webapp/components/rhs_thread.jsx
index a7bc65243..da958d9d5 100644
--- a/webapp/components/rhs_thread.jsx
+++ b/webapp/components/rhs_thread.jsx
@@ -410,6 +410,7 @@ export default class RhsThread extends React.Component {
                 <RhsHeaderPost
                     fromFlaggedPosts={this.props.fromFlaggedPosts}
                     fromSearch={this.props.fromSearch}
+                    fromPinnedPosts={this.props.fromPinnedPosts}
                     isWebrtc={this.props.isWebrtc}
                     isMentionSearch={this.props.isMentionSearch}
                     toggleSize={this.props.toggleSize}
@@ -472,6 +473,7 @@ RhsThread.defaultProps = {
 RhsThread.propTypes = {
     fromSearch: React.PropTypes.string,
     fromFlaggedPosts: React.PropTypes.bool,
+    fromPinnedPosts: React.PropTypes.bool,
     isWebrtc: React.PropTypes.bool,
     isMentionSearch: React.PropTypes.bool,
     currentUser: React.PropTypes.object.isRequired,
diff --git a/webapp/components/sidebar_right.jsx b/webapp/components/sidebar_right.jsx
index 483d30fc7..b4ca2f53c 100644
--- a/webapp/components/sidebar_right.jsx
+++ b/webapp/components/sidebar_right.jsx
@@ -135,11 +135,12 @@ export default class SidebarRight extends React.Component {
         });
     }
 
-    onSelectedChange(fromSearch, fromFlaggedPosts) {
+    onSelectedChange(fromSearch, fromFlaggedPosts, fromPinnedPosts) {
         this.setState({
             postRightVisible: Boolean(PostStore.getSelectedPost()),
             fromSearch,
-            fromFlaggedPosts
+            fromFlaggedPosts,
+            fromPinnedPosts
         });
     }
 
@@ -230,6 +231,7 @@ export default class SidebarRight extends React.Component {
                     <RhsThread
                         fromFlaggedPosts={this.state.fromFlaggedPosts}
                         fromSearch={this.state.fromSearch}
+                        fromPinnedPosts={this.state.fromPinnedPosts}
                         isWebrtc={WebrtcStore.isBusy()}
                         isMentionSearch={this.state.isMentionSearch}
                         currentUser={this.state.currentUser}
diff --git a/webapp/i18n/en.json b/webapp/i18n/en.json
index 44163acbe..e40aa647a 100755
--- a/webapp/i18n/en.json
+++ b/webapp/i18n/en.json
@@ -1875,6 +1875,7 @@
   "rhs_comment.permalink": "Permalink",
   "rhs_header.backToCallTooltip": "Back to Call",
   "rhs_header.backToFlaggedTooltip": "Back to Flagged Posts",
+  "rhs_header.backToPinnedTooltip": "Back to Pinned Posts",
   "rhs_header.backToResultsTooltip": "Back to Search Results",
   "rhs_header.closeSidebarTooltip": "Close Sidebar",
   "rhs_header.closeTooltip": "Close Sidebar",
diff --git a/webapp/stores/post_store.jsx b/webapp/stores/post_store.jsx
index 4a5763c0e..5a1dc5cf8 100644
--- a/webapp/stores/post_store.jsx
+++ b/webapp/stores/post_store.jsx
@@ -509,8 +509,8 @@ class PostStoreClass extends EventEmitter {
         return threadPosts;
     }
 
-    emitSelectedPostChange(fromSearch, fromFlaggedPosts) {
-        this.emit(SELECTED_POST_CHANGE_EVENT, fromSearch, fromFlaggedPosts);
+    emitSelectedPostChange(fromSearch, fromFlaggedPosts, fromPinnedPosts) {
+        this.emit(SELECTED_POST_CHANGE_EVENT, fromSearch, fromFlaggedPosts, fromPinnedPosts);
     }
 
     addSelectedPostChangeListener(callback) {
@@ -717,7 +717,7 @@ PostStore.dispatchToken = AppDispatcher.register((payload) => {
         break;
     case ActionTypes.RECEIVED_POST_SELECTED:
         PostStore.storeSelectedPostId(action.postId);
-        PostStore.emitSelectedPostChange(action.from_search, action.from_flagged_posts);
+        PostStore.emitSelectedPostChange(action.from_search, action.from_flagged_posts, action.from_pinned_posts);
         break;
     case ActionTypes.RECEIVED_POST_PINNED:
     case ActionTypes.RECEIVED_POST_UNPINNED: