1 files changed, 48 insertions, 44 deletions

diff --git a/web/react/components/sidebar_right.jsx b/web/react/components/sidebar_right.jsx
index df75e3adf..9aeda6626 100644
--- a/web/react/components/sidebar_right.jsx
+++ b/web/react/components/sidebar_right.jsx
@@ -4,47 +4,49 @@
 var SearchResults = require('./search_results.jsx');
 var RhsThread = require('./rhs_thread.jsx');
 var PostStore = require('../stores/post_store.jsx');
-var utils = require('../utils/utils.jsx');
+var Utils = require('../utils/utils.jsx');
 
-function getStateFromStores(from_search) {
-    return { search_visible: PostStore.getSearchResults() != null, post_right_visible:  PostStore.getSelectedPost() != null, is_mention_search: PostStore.getIsMentionSearch() };
+function getStateFromStores() {
+    return {search_visible: PostStore.getSearchResults() != null, post_right_visible: PostStore.getSelectedPost() != null, is_mention_search: PostStore.getIsMentionSearch()};
 }
 
-module.exports = React.createClass({
-    componentDidMount: function() {
-        PostStore.addSearchChangeListener(this._onSearchChange);
-        PostStore.addSelectedPostChangeListener(this._onSelectedChange);
-    },
-    componentWillUnmount: function() {
-        PostStore.removeSearchChangeListener(this._onSearchChange);
-        PostStore.removeSelectedPostChangeListener(this._onSelectedChange);
-    },
-    _onSelectedChange: function(from_search) {
-        if (this.isMounted()) {
-            var newState = getStateFromStores(from_search);
-            newState.from_search = from_search;
-            if (!utils.areStatesEqual(newState, this.state)) {
-                this.setState(newState);
-            }
+export default class SidebarRight extends React.Component {
+    constructor(props) {
+        super(props);
+
+        this.onSelectedChange = this.onSelectedChange.bind(this);
+        this.onSearchChange = this.onSearchChange.bind(this);
+        this.resize = this.resize.bind(this);
+
+        this.state = getStateFromStores();
+    }
+    componentDidMount() {
+        PostStore.addSearchChangeListener(this.onSearchChange);
+        PostStore.addSelectedPostChangeListener(this.onSelectedChange);
+    }
+    componentWillUnmount() {
+        PostStore.removeSearchChangeListener(this.onSearchChange);
+        PostStore.removeSelectedPostChangeListener(this.onSelectedChange);
+    }
+    onSelectedChange(fromSearch) {
+        var newState = getStateFromStores(fromSearch);
+        newState.from_search = fromSearch;
+        if (!Utils.areStatesEqual(newState, this.state)) {
+            this.setState(newState);
         }
-    },
-    _onSearchChange: function() {
-        if (this.isMounted()) {
-            var newState = getStateFromStores();
-            if (!utils.areStatesEqual(newState, this.state)) {
-                this.setState(newState);
-            }
+    }
+    onSearchChange() {
+        var newState = getStateFromStores();
+        if (!Utils.areStatesEqual(newState, this.state)) {
+            this.setState(newState);
         }
-    },
-    resize: function() {
+    }
+    resize() {
         var postHolder = $('.post-list-holder-by-time');
         postHolder[0].scrollTop = postHolder[0].scrollHeight - 224;
-    },
-    getInitialState: function() {
-        return getStateFromStores();
-    },
-    render: function() {
-        if (! (this.state.search_visible || this.state.post_right_visible)) {
+    }
+    render() {
+        if (!(this.state.search_visible || this.state.post_right_visible)) {
             $('.inner__wrap').removeClass('move--left').removeClass('move--right');
             $('.sidebar--right').removeClass('move--left');
             this.resize();
@@ -58,25 +60,27 @@ module.exports = React.createClass({
         $('.sidebar--right').addClass('move--left');
         $('.sidebar--right').prepend('<div class="sidebar__overlay"></div>');
         this.resize();
-        setTimeout(function(){
-            $('.sidebar__overlay').fadeOut("200", function(){
+        setTimeout(function overlayTimer() {
+            $('.sidebar__overlay').fadeOut('200', function fadeOverlay() {
                 $(this).remove();
             });
-        },500)
+        }, 500);
 
-        var content = "";
+        var content = '';
 
         if (this.state.search_visible) {
             content = <SearchResults isMentionSearch={this.state.is_mention_search} />;
-        }
-        else if (this.state.post_right_visible) {
-            content = <RhsThread fromSearch={this.state.from_search} isMentionSearch={this.state.is_mention_search} />;
+        } else if (this.state.post_right_visible) {
+            content = (<RhsThread
+                            fromSearch={this.state.from_search}
+                            isMentionSearch={this.state.is_mention_search}
+                        />);
         }
 
         return (
-            <div className="sidebar-right-container">
-                { content }
+            <div className='sidebar-right-container'>
+                {content}
             </div>
         );
     }
-});
+}