diff --git a/.eslintrc.json b/.eslintrc.json
index 2186efd8b..12355ac34 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -53,7 +53,8 @@
         "no-lonely-if": [2],
         "curly": [2],
         "no-unused-vars": ["error", {
-            "argsIgnorePattern": "next"
+            "argsIgnorePattern": "^_|next",
+            "varsIgnorePattern": "^_"
         }],
         "no-multiple-empty-lines": ["error", {
             "max": 1
diff --git a/client/coral-admin/src/AppRouter.js b/client/coral-admin/src/AppRouter.js
index 3bde5f931..385076b21 100644
--- a/client/coral-admin/src/AppRouter.js
+++ b/client/coral-admin/src/AppRouter.js
@@ -50,7 +50,7 @@ const routes = (
           <Route path=':id' components={Moderation} />
         </Route>
         <Route path=':id' components={Moderation} />
-        <IndexRedirect to='premod' />
+        <IndexRedirect to='all' />
       </Route>
     </Route>
   </div>
diff --git a/client/coral-admin/src/routes/Moderation/components/Moderation.js b/client/coral-admin/src/routes/Moderation/components/Moderation.js
index 2de15f2ff..eb0b21c46 100644
--- a/client/coral-admin/src/routes/Moderation/components/Moderation.js
+++ b/client/coral-admin/src/routes/Moderation/components/Moderation.js
@@ -206,6 +206,7 @@ export default class Moderation extends Component {
         )}
 
         <StorySearch
+          assetId={assetId}
           moderation={this.props.moderation}
           closeSearch={this.closeSearch}
           storySearchChange={this.props.storySearchChange}
diff --git a/client/coral-admin/src/routes/Moderation/components/ModerationQueue.js b/client/coral-admin/src/routes/Moderation/components/ModerationQueue.js
index 9ccde344d..2adf17b23 100644
--- a/client/coral-admin/src/routes/Moderation/components/ModerationQueue.js
+++ b/client/coral-admin/src/routes/Moderation/components/ModerationQueue.js
@@ -9,6 +9,7 @@ import t from 'coral-framework/services/i18n';
 import {CSSTransitionGroup} from 'react-transition-group';
 
 class ModerationQueue extends React.Component {
+  isLoadingMore = false;
 
   static propTypes = {
     viewUserDetail: PropTypes.func.isRequired,
@@ -23,7 +24,15 @@ class ModerationQueue extends React.Component {
   }
 
   loadMore = () => {
-    this.props.loadMore(this.props.activeTab);
+    if (!this.isLoadingMore) {
+      this.isLoadingMore = true;
+      this.props.loadMore(this.props.activeTab)
+        .then(() => this.isLoadingMore = false)
+        .catch((e) => {
+          this.isLoadingMore = false;
+          throw e;
+        });
+    }
   }
 
   constructor(props) {
diff --git a/client/coral-admin/src/routes/Moderation/components/StorySearch.css b/client/coral-admin/src/routes/Moderation/components/StorySearch.css
index f0503f6b9..2df130ec4 100644
--- a/client/coral-admin/src/routes/Moderation/components/StorySearch.css
+++ b/client/coral-admin/src/routes/Moderation/components/StorySearch.css
@@ -49,12 +49,14 @@
   font-weight: 300;
 }
 
-.cta {
-  letter-spacing: 1px;
+.cta > a {
+  display: inline-block;
+  cursor: pointer;
+  color: #000;
+  text-decoration: none;
   font-weight: bold;
   font-size: 15px;
   margin: 0;
-  height: 50px;
   box-sizing: border-box;
   font-size: 15px;
   font-weight: 500;
diff --git a/client/coral-admin/src/routes/Moderation/components/StorySearch.js b/client/coral-admin/src/routes/Moderation/components/StorySearch.js
index f42ceaadd..5fe82fa97 100644
--- a/client/coral-admin/src/routes/Moderation/components/StorySearch.js
+++ b/client/coral-admin/src/routes/Moderation/components/StorySearch.js
@@ -38,7 +38,11 @@ const StorySearch = (props) => {
             </Button>
           </div>
           <div className={styles.results}>
-            <p className={styles.cta}>Moderate comments on All Stories</p>
+            {props.assetId &&
+              <div className={styles.cta}>
+                <a onClick={props.goToModerateAll}>Moderate comments on All Stories</a>
+              </div>
+            }
             <div className={styles.storyList}>
 
               {
@@ -87,7 +91,8 @@ StorySearch.propTypes = {
   goToStory: PropTypes.func.isRequired,
   closeSearch: PropTypes.func.isRequired,
   moderation: PropTypes.object.isRequired,
-  handleSearchChange: PropTypes.func.isRequired
+  handleSearchChange: PropTypes.func.isRequired,
+  assetId: PropTypes.string
 };
 
 export default StorySearch;
diff --git a/client/coral-admin/src/routes/Moderation/components/UserDetail.js b/client/coral-admin/src/routes/Moderation/components/UserDetail.js
index 7047a41d5..59f696b5f 100644
--- a/client/coral-admin/src/routes/Moderation/components/UserDetail.js
+++ b/client/coral-admin/src/routes/Moderation/components/UserDetail.js
@@ -5,6 +5,7 @@ import {Button, Drawer} from 'coral-ui';
 import {Slot} from 'coral-framework/components';
 import ButtonCopyToClipboard from './ButtonCopyToClipboard';
 import {actionsMap} from '../helpers/moderationQueueActionsMap';
+import ClickOutside from 'coral-framework/components/ClickOutside';
 
 export default class UserDetail extends React.Component {
 
@@ -80,90 +81,92 @@ export default class UserDetail extends React.Component {
     }
 
     return (
-      <Drawer handleClickOutside={hideUserDetail}>
-        <h3>{user.username}</h3>
+      <ClickOutside onClickOutside={hideUserDetail}>
+        <Drawer onClose={hideUserDetail}>
+          <h3>{user.username}</h3>
 
-        <div>
-          {profile && <input className={styles.profileEmail} readOnly type="text" ref={(ref) => this.profile = ref} value={profile} />}
-          <ButtonCopyToClipboard className={styles.copyButton} copyText={profile} />
-        </div>
+          <div>
+            {profile && <input className={styles.profileEmail} readOnly type="text" ref={(ref) => this.profile = ref} value={profile} />}
+            <ButtonCopyToClipboard className={styles.copyButton} copyText={profile} />
+          </div>
 
-        <Slot
-          fill="userProfile"
-          data={this.props.data}
-          root={this.props.root}
-          user={user}
-        />
-        <p className={styles.memberSince}><strong>Member since</strong> {new Date(user.created_at).toLocaleString()}</p>
-        <hr/>
-        <p>
-          <strong>Account summary</strong>
-          <br/><small className={styles.small}>Data represents the last six months of activity</small>
-        </p>
-        <div className={styles.stats}>
-          <div className={styles.stat}>
-            <p>Total Comments</p>
-            <p>{totalComments}</p>
-          </div>
-          <div className={styles.stat}>
-            <p>Reject Rate</p>
-            <p>{`${(rejectedPercent).toFixed(1)}%`}</p>
-          </div>
-        </div>
-        {
-          selectedIds.length === 0
-          ? (
-            <ul className={styles.commentStatuses}>
-              <li className={tab === 'all' ? styles.active : ''} onClick={this.showAll}>All</li>
-              <li className={tab === 'rejected' ? styles.active : ''} onClick={this.showRejected}>Rejected</li>
-            </ul>
-          )
-          : (
-            <div className={styles.bulkActionGroup}>
-              <Button
-                onClick={bulkAccept}
-                className={styles.bulkAction}
-                cStyle='approve'
-                icon='done'>
-              </Button>
-              <Button
-                onClick={bulkReject}
-                className={styles.bulkAction}
-                cStyle='reject'
-                icon='close'>
-              </Button>
-              {`${selectedIds.length} comments selected`}
+          <Slot
+            fill="userProfile"
+            data={this.props.data}
+            root={this.props.root}
+            user={user}
+          />
+          <p className={styles.memberSince}><strong>Member since</strong> {new Date(user.created_at).toLocaleString()}</p>
+          <hr/>
+          <p>
+            <strong>Account summary</strong>
+            <br/><small className={styles.small}>Data represents the last six months of activity</small>
+          </p>
+          <div className={styles.stats}>
+            <div className={styles.stat}>
+              <p>Total Comments</p>
+              <p>{totalComments}</p>
             </div>
-          )
-        }
-
-        <div>
+            <div className={styles.stat}>
+              <p>Reject Rate</p>
+              <p>{`${(rejectedPercent).toFixed(1)}%`}</p>
+            </div>
+          </div>
           {
-            nodes.map((comment, i) => {
-              const status = comment.action_summaries ? 'FLAGGED' : comment.status;
-              const selected = selectedIds.indexOf(comment.id) !== -1;
-              return <Comment
-                key={comment.id}
-                index={i}
-                comment={comment}
-                selected={false}
-                suspectWords={suspectWords}
-                bannedWords={bannedWords}
-                viewUserDetail={() => {}}
-                actions={actionsMap[status]}
-                showBanUserDialog={showBanUserDialog}
-                showSuspendUserDialog={showSuspendUserDialog}
-                acceptComment={this.acceptThenReload}
-                rejectComment={this.rejectThenReload}
-                selected={selected}
-                toggleSelect={toggleSelect}
-                currentAsset={null}
-                currentUserId={this.props.id}
-                minimal={true} />;
-            })
+            selectedIds.length === 0
+            ? (
+              <ul className={styles.commentStatuses}>
+                <li className={tab === 'all' ? styles.active : ''} onClick={this.showAll}>All</li>
+                <li className={tab === 'rejected' ? styles.active : ''} onClick={this.showRejected}>Rejected</li>
+              </ul>
+            )
+            : (
+              <div className={styles.bulkActionGroup}>
+                <Button
+                  onClick={bulkAccept}
+                  className={styles.bulkAction}
+                  cStyle='approve'
+                  icon='done'>
+                </Button>
+                <Button
+                  onClick={bulkReject}
+                  className={styles.bulkAction}
+                  cStyle='reject'
+                  icon='close'>
+                </Button>
+                {`${selectedIds.length} comments selected`}
+              </div>
+            )
           }
-        </div>
-      </Drawer>
+
+          <div>
+            {
+              nodes.map((comment, i) => {
+                const status = comment.action_summaries ? 'FLAGGED' : comment.status;
+                const selected = selectedIds.indexOf(comment.id) !== -1;
+                return <Comment
+                  key={comment.id}
+                  index={i}
+                  comment={comment}
+                  selected={false}
+                  suspectWords={suspectWords}
+                  bannedWords={bannedWords}
+                  viewUserDetail={() => {}}
+                  actions={actionsMap[status]}
+                  showBanUserDialog={showBanUserDialog}
+                  showSuspendUserDialog={showSuspendUserDialog}
+                  acceptComment={this.acceptThenReload}
+                  rejectComment={this.rejectThenReload}
+                  selected={selected}
+                  toggleSelect={toggleSelect}
+                  currentAsset={null}
+                  currentUserId={this.props.id}
+                  minimal={true} />;
+              })
+            }
+          </div>
+        </Drawer>
+      </ClickOutside>
     );
   }
 }
diff --git a/client/coral-admin/src/routes/Moderation/components/styles.css b/client/coral-admin/src/routes/Moderation/components/styles.css
index 8b4fe971d..1228c61a4 100644
--- a/client/coral-admin/src/routes/Moderation/components/styles.css
+++ b/client/coral-admin/src/routes/Moderation/components/styles.css
@@ -190,8 +190,6 @@ span {
   }
 
   &.selected {
-    max-width: 720px;
-    max-height: 410px;
   }
 
   .context {
diff --git a/client/coral-admin/src/routes/Moderation/containers/StorySearch.js b/client/coral-admin/src/routes/Moderation/containers/StorySearch.js
index cf47ca662..f4ab6f23e 100644
--- a/client/coral-admin/src/routes/Moderation/containers/StorySearch.js
+++ b/client/coral-admin/src/routes/Moderation/containers/StorySearch.js
@@ -41,7 +41,13 @@ class StorySearchContainer extends React.Component {
 
   goToStory = (id) => {
     const {router, closeSearch} = this.props;
-    router.push(`/admin/moderate/${id}`);
+    router.push(`/admin/moderate/all/${id}`);
+    closeSearch();
+  }
+
+  goToModerateAll = () => {
+    const {router, closeSearch} = this.props;
+    router.push('/admin/moderate/all');
     closeSearch();
   }
 
@@ -50,6 +56,7 @@ class StorySearchContainer extends React.Component {
       <StorySearch
         search={this.search}
         goToStory={this.goToStory}
+        goToModerateAll={this.goToModerateAll}
         handleEsc={this.handleEsc}
         handleEnter={this.handleEnter}
         searchValue={this.state.searchValue}
diff --git a/client/coral-embed-stream/src/components/Comment.js b/client/coral-embed-stream/src/components/Comment.js
index 8626154f4..754f44558 100644
--- a/client/coral-embed-stream/src/components/Comment.js
+++ b/client/coral-embed-stream/src/components/Comment.js
@@ -76,6 +76,8 @@ const ActionButton = ({children}) => {
 };
 
 export default class Comment extends React.Component {
+  isLoadingReplies = false;
+
   constructor(props) {
     super(props);
 
@@ -211,14 +213,24 @@ export default class Comment extends React.Component {
   }
 
   loadNewReplies = () => {
-    const {replies, replyCount, id} = this.props.comment;
-    if (replyCount > replies.nodes.length) {
-      this.props.loadMore(id).then(() => {
-        this.setState(resetCursors(this.state, this.props));
-      });
-      return;
+    if (!this.isLoadingReplies) {
+      this.isLoadingReplies = true;
+      const {replies, replyCount, id} = this.props.comment;
+      if (replyCount > replies.nodes.length) {
+        this.props.loadMore(id)
+          .then(() => {
+            this.setState(resetCursors(this.state, this.props));
+            this.isLoadingReplies = false;
+          })
+          .catch((e) => {
+            this.isLoadingReplies = false;
+            throw e;
+          });
+        return;
+      }
+      this.setState(resetCursors);
+      this.isLoadingReplies = false;
     }
-    this.setState(resetCursors);
   };
 
   showReplyBox = () => {
@@ -432,28 +444,28 @@ export default class Comment extends React.Component {
             inline
           />
 
-          { (currentUser &&
-              (comment.user.id === currentUser.id))
+          { (currentUser && (comment.user.id === currentUser.id)) &&
 
-              /* User can edit/delete their own comment for a short window after posting */
-              ? <span className={cn(styles.topRight)}>
-                  {
-                    commentIsStillEditable(comment) &&
-                    <a
-                      className={cn(styles.link, {[styles.active]: this.state.isEditing})}
-                      onClick={this.onClickEdit}>Edit</a>
-                  }
-                </span>
+            /* User can edit/delete their own comment for a short window after posting */
+            <span className={cn(styles.topRight)}>
+              {
+                commentIsStillEditable(comment) &&
+                <a
+                  className={cn(styles.link, {[styles.active]: this.state.isEditing})}
+                  onClick={this.onClickEdit}>Edit</a>
+              }
+            </span>
+          }
+          { (currentUser && (comment.user.id !== currentUser.id)) &&
 
               /* TopRightMenu allows currentUser to ignore other users' comments */
-              : <span className={cn(styles.topRight, styles.topRightMenu)}>
-                  <TopRightMenu
-                    comment={comment}
-                    ignoreUser={ignoreUser}
-                    addNotification={addNotification} />
-                </span>
+              <span className={cn(styles.topRight, styles.topRightMenu)}>
+                <TopRightMenu
+                  comment={comment}
+                  ignoreUser={ignoreUser}
+                  addNotification={addNotification} />
+              </span>
           }
-
           {
             this.state.isEditing
             ? <EditableCommentContent
diff --git a/client/coral-embed-stream/src/components/LoadMore.js b/client/coral-embed-stream/src/components/LoadMore.js
index ca2816d10..3d1ad4679 100644
--- a/client/coral-embed-stream/src/components/LoadMore.js
+++ b/client/coral-embed-stream/src/components/LoadMore.js
@@ -23,15 +23,17 @@ class LoadMore extends React.Component {
     }
   }
 
+  loadMore = () => {
+    this.initialState = false;
+    this.props.loadMore();
+  }
+
   render () {
-    const {topLevel, moreComments, loadMore, replyCount} = this.props;
+    const {topLevel, moreComments, replyCount} = this.props;
     return moreComments
       ? <div className='coral-load-more'>
         <Button
-          onClick={() => {
-            this.initialState = false;
-            loadMore();
-          }}>
+          onClick={this.loadMore}>
           {topLevel ? t('framework.view_more_comments') : this.replyCountFormat(replyCount)}
         </Button>
       </div>
diff --git a/client/coral-embed-stream/src/components/Stream.js b/client/coral-embed-stream/src/components/Stream.js
index 62a58129b..f6c67fd8d 100644
--- a/client/coral-embed-stream/src/components/Stream.js
+++ b/client/coral-embed-stream/src/components/Stream.js
@@ -53,6 +53,8 @@ function invalidateCursor(invalidated, state, props) {
 
 class Stream extends React.Component {
 
+  isLoadingMore = false;
+
   constructor(props) {
     super(props);
     this.state = resetCursors(this.state, props);
@@ -95,6 +97,18 @@ class Stream extends React.Component {
     }
   };
 
+  loadMoreComments = () => {
+    if (!this.isLoadingMore) {
+      this.isLoadingMore = true;
+      this.props.loadMoreComments()
+        .then(() => this.isLoadingMore = false)
+        .catch((e) => {
+          this.isLoadingMore = false;
+          throw e;
+        });
+    }
+  }
+
   // getVisibileComments returns a list containing comments
   // which were authored by current user or comes after the `idCursor`.
   getVisibleComments() {
@@ -288,7 +302,7 @@ class Stream extends React.Component {
               <LoadMore
                 topLevel={true}
                 moreComments={asset.comments.hasNextPage}
-                loadMore={this.props.loadMoreComments}
+                loadMore={this.loadMoreComments}
               />
             </div>}
       </div>
diff --git a/client/coral-embed-stream/src/components/TopRightMenu.css b/client/coral-embed-stream/src/components/Toggleable.css
similarity index 100%
rename from client/coral-embed-stream/src/components/TopRightMenu.css
rename to client/coral-embed-stream/src/components/Toggleable.css
diff --git a/client/coral-embed-stream/src/components/Toggleable.js b/client/coral-embed-stream/src/components/Toggleable.js
new file mode 100644
index 000000000..c7996d866
--- /dev/null
+++ b/client/coral-embed-stream/src/components/Toggleable.js
@@ -0,0 +1,39 @@
+import React from 'react';
+import ClickOutside from 'coral-framework/components/ClickOutside';
+import styles from './Toggleable.css';
+import classnames from 'classnames';
+
+const upArrow = <span className={classnames(styles.chevron, styles.up)}></span>;
+const downArrow = <span className={classnames(styles.chevron, styles.down)}></span>;
+
+export default class Toggleable extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      isOpen: false
+    };
+  }
+
+  toggle = () => {
+    this.setState({isOpen: !this.state.isOpen});
+  }
+
+  close = () => {
+    this.setState({isOpen: false});
+  }
+
+  render() {
+    const {children} = this.props;
+    const {isOpen} = this.state;
+    return (
+      <ClickOutside onClickOutside={this.close}>
+        <span className={styles.Toggleable} tabIndex="0" >
+          <span className={styles.toggler}
+                onClick={this.toggle}>{isOpen ? upArrow : downArrow}</span>
+          {isOpen ? children : null}
+        </span>
+      </ClickOutside>
+    );
+  }
+}
+
diff --git a/client/coral-embed-stream/src/components/TopRightMenu.js b/client/coral-embed-stream/src/components/TopRightMenu.js
index 84d64f061..d65722b6d 100644
--- a/client/coral-embed-stream/src/components/TopRightMenu.js
+++ b/client/coral-embed-stream/src/components/TopRightMenu.js
@@ -1,8 +1,6 @@
 import React, {PropTypes} from 'react';
-import classnames from 'classnames';
-
 import {IgnoreUserWizard} from './IgnoreUserWizard';
-import styles from './TopRightMenu.css';
+import Toggleable from './Toggleable';
 
 // TopRightMenu appears as a dropdown in the top right of the comment.
 // when you click the down cehvron, it expands and shows IgnoreUserWizard
@@ -56,38 +54,6 @@ export class TopRightMenu extends React.Component {
             />
         </div>
       </Toggleable>
-    );        
-  }
-}
-
-const upArrow = <span className={classnames(styles.chevron, styles.up)}></span>;
-const downArrow = <span className={classnames(styles.chevron, styles.down)}></span>;
-class Toggleable extends React.Component {
-  constructor(props) {
-    super(props);
-    this.toggle = this.toggle.bind(this);
-    this.close = this.close.bind(this);
-    this.state = {
-      isOpen: false
-    };
-  }
-  toggle() {
-    this.setState({isOpen: !this.state.isOpen});
-  }
-  close() {
-    this.setState({isOpen: false});
-  }
-  render() {
-    const {children} = this.props;
-    const {isOpen} = this.state;
-    return (
-
-      // /*onBlur={ this.close } */
-      <span className={styles.Toggleable} tabIndex="0" >
-        <span className={styles.toggler}
-              onClick={this.toggle}>{isOpen ? upArrow : downArrow}</span>
-        {isOpen ? children : null}
-      </span>
     );
   }
 }
diff --git a/client/coral-embed/src/index.js b/client/coral-embed/src/index.js
index 14de2756e..5b42fa541 100644
--- a/client/coral-embed/src/index.js
+++ b/client/coral-embed/src/index.js
@@ -73,6 +73,11 @@ function configurePymParent(pymParent, opts) {
 
   window.document.body.appendChild(snackbar);
 
+  // Notify embed that there was a click outside.
+  document.addEventListener('click', () => {
+    pymParent.sendMessage('click');
+  }, true);
+
   // Workaround: IOS Safari ignores `width` but respects `min-width` value.
   pymParent.el.firstChild.style.width = '1px';
   pymParent.el.firstChild.style.minWidth = '100%';
diff --git a/client/coral-framework/components/ClickOutside.js b/client/coral-framework/components/ClickOutside.js
new file mode 100644
index 000000000..e13ef4472
--- /dev/null
+++ b/client/coral-framework/components/ClickOutside.js
@@ -0,0 +1,35 @@
+import {Component, cloneElement, Children} from 'react';
+import PropTypes from 'prop-types';
+import {findDOMNode} from 'react-dom';
+import {pym} from 'coral-framework';
+
+export default class ClickOutside extends Component {
+  static propTypes = {
+    onClickOutside: PropTypes.func.isRequired
+  };
+
+  domNode = null;
+
+  handleClick = (e) => {
+    const {onClickOutside} = this.props;
+    if (!e || !this.domNode.contains(e.target)) {
+      onClickOutside(e);
+    }
+  };
+
+  componentDidMount() {
+    this.domNode = findDOMNode(this);
+    document.addEventListener('click', this.handleClick, true);
+    pym.onMessage('click', this.handleClick);
+  }
+
+  componentWillUnmount() {
+    document.removeEventListener('click', this.handleClick, true);
+    pym.messageHandlers.click = pym.messageHandlers.click.filter((h) => h !== this.handleClick);
+  }
+
+  render() {
+    const {children, onClickOutside: _, ...rest} = this.props;
+    return cloneElement(Children.only(children), rest);
+  }
+}
diff --git a/client/coral-plugin-flags/FlagButton.js b/client/coral-plugin-flags/FlagButton.js
index 73ed50e9c..e8a17f201 100644
--- a/client/coral-plugin-flags/FlagButton.js
+++ b/client/coral-plugin-flags/FlagButton.js
@@ -4,11 +4,11 @@ import t from 'coral-framework/services/i18n';
 import {can} from 'coral-framework/services/perms';
 
 import {PopupMenu, Button} from 'coral-ui';
-import onClickOutside from 'react-onclickoutside';
+import ClickOutside from 'coral-framework/components/ClickOutside';
 
 const name = 'coral-plugin-flags';
 
-class FlagButton extends Component {
+export default class FlagButton extends Component {
 
   state = {
     showMenu: false,
@@ -128,7 +128,7 @@ class FlagButton extends Component {
     this.setState({message: e.target.value});
   }
 
-  handleClickOutside () {
+  handleClickOutside = () => {
     this.closeMenu();
   }
 
@@ -138,79 +138,81 @@ class FlagButton extends Component {
     const flagged = flaggedByCurrentUser || localPost;
     const popupMenu = getPopupMenu[this.state.step](this.state.itemType);
 
-    return <div className={`${name}-container`}>
-      <button
-        ref={(ref) => this.flagButton = ref}
-        onClick={!this.props.banned && !flaggedByCurrentUser && !localPost ? this.onReportClick : null}
-        className={`${name}-button`}>
-        {
-          flagged
-          ? <span className={`${name}-button-text`}>{t('reported')}</span>
-          : <span className={`${name}-button-text`}>{t('report')}</span>
-        }
-        <i className={`${name}-icon material-icons ${flagged && 'flaggedIcon'}`}
-          style={flagged ? styles.flaggedIcon : {}}
-          aria-hidden={true}>flag</i>
-      </button>
-      {
-        this.state.showMenu &&
-        <div className={`${name}-popup`} ref={(ref) => this.popup = ref}>
-          <PopupMenu>
-            <div className={`${name}-popup-header`}>{popupMenu.header}</div>
+    return (
+      <ClickOutside onClickOutside={this.handleClickOutside}>
+        <div className={`${name}-container`}>
+          <button
+            ref={(ref) => this.flagButton = ref}
+            onClick={!this.props.banned && !flaggedByCurrentUser && !localPost ? this.onReportClick : null}
+            className={`${name}-button`}>
             {
-              popupMenu.text &&
-              <div className={`${name}-popup-text`}>{popupMenu.text}</div>
+              flagged
+              ? <span className={`${name}-button-text`}>{t('reported')}</span>
+              : <span className={`${name}-button-text`}>{t('report')}</span>
             }
-            {
-              popupMenu.options && <form className={`${name}-popup-form`}>
+            <i className={`${name}-icon material-icons ${flagged && 'flaggedIcon'}`}
+              style={flagged ? styles.flaggedIcon : {}}
+              aria-hidden={true}>flag</i>
+          </button>
+          {
+            this.state.showMenu &&
+            <div className={`${name}-popup`} ref={(ref) => this.popup = ref}>
+              <PopupMenu>
+                <div className={`${name}-popup-header`}>{popupMenu.header}</div>
                 {
-                  popupMenu.options.map((option) =>
-                    <div key={option.val}>
-                      <input
-                        className={`${name}-popup-radio`}
-                        type="radio"
-                        id={option.val}
-                        checked={this.state[popupMenu.sets] === option.val}
-                        onClick={this.onPopupOptionClick(popupMenu.sets)}
-                        value={option.val}/>
-                      <label htmlFor={option.val} className={`${name}-popup-radio-label`}>{option.text}</label><br/>
-                    </div>
-                  )
+                  popupMenu.text &&
+                  <div className={`${name}-popup-text`}>{popupMenu.text}</div>
                 }
                 {
-                  this.state.reason && <div>
-                  <label htmlFor={'message'} className={`${name}-popup-radio-label`}>
-                    {t('flag_reason')}
-                  </label><br/>
-                  <textarea
-                      className={`${name}-reason-text`}
-                      id="message"
-                      rows={4}
-                      onChange={this.onNoteTextChange}
-                      value={this.state.message}/>
-                  </div>
+                  popupMenu.options && <form className={`${name}-popup-form`}>
+                    {
+                      popupMenu.options.map((option) =>
+                        <div key={option.val}>
+                          <input
+                            className={`${name}-popup-radio`}
+                            type="radio"
+                            id={option.val}
+                            checked={this.state[popupMenu.sets] === option.val}
+                            onClick={this.onPopupOptionClick(popupMenu.sets)}
+                            value={option.val}/>
+                          <label htmlFor={option.val} className={`${name}-popup-radio-label`}>{option.text}</label><br/>
+                        </div>
+                      )
+                    }
+                    {
+                      this.state.reason && <div>
+                      <label htmlFor={'message'} className={`${name}-popup-radio-label`}>
+                        {t('flag_reason')}
+                      </label><br/>
+                      <textarea
+                          className={`${name}-reason-text`}
+                          id="message"
+                          rows={4}
+                          onChange={this.onNoteTextChange}
+                          value={this.state.message}/>
+                      </div>
+                    }
+                  </form>
                 }
-              </form>
-            }
-            <div className={`${name}-popup-counter`}>
-              {this.state.step + 1} of {getPopupMenu.length}
+                <div className={`${name}-popup-counter`}>
+                  {this.state.step + 1} of {getPopupMenu.length}
+                </div>
+                {
+                  popupMenu.button && <Button
+                  className={`${name}-popup-button`}
+                  onClick={this.onPopupContinue}>
+                    {popupMenu.button}
+                  </Button>
+                }
+              </PopupMenu>
             </div>
-            {
-              popupMenu.button && <Button
-              className={`${name}-popup-button`}
-              onClick={this.onPopupContinue}>
-                {popupMenu.button}
-              </Button>
-            }
-          </PopupMenu>
+          }
         </div>
-      }
-    </div>;
+      </ClickOutside>
+    );
   }
 }
 
-export default onClickOutside(FlagButton);
-
 const styles = {
   flaggedIcon: {
     color: '#F00'
diff --git a/client/coral-plugin-moderation/ModerationLink.js b/client/coral-plugin-moderation/ModerationLink.js
index 020b8c345..7239cc793 100644
--- a/client/coral-plugin-moderation/ModerationLink.js
+++ b/client/coral-plugin-moderation/ModerationLink.js
@@ -5,7 +5,7 @@ import t from 'coral-framework/services/i18n';
 
 const ModerationLink = (props) => props.isAdmin ? (
     <div className={styles.moderationLink}>
-      <a href={`/admin/moderate/${props.assetId}`} target="_blank">
+      <a href={`/admin/moderate/all/${props.assetId}`} target="_blank">
         {t('moderate_this_stream')}
       </a>
     </div>
diff --git a/client/coral-plugin-permalinks/PermalinkButton.js b/client/coral-plugin-permalinks/PermalinkButton.js
index 8cab70b0d..3d6df996f 100644
--- a/client/coral-plugin-permalinks/PermalinkButton.js
+++ b/client/coral-plugin-permalinks/PermalinkButton.js
@@ -1,12 +1,12 @@
 import React, {PropTypes} from 'react';
-import onClickOutside from 'react-onclickoutside';
 const name = 'coral-plugin-permalinks';
 import {Button} from 'coral-ui';
 import styles from './styles.css';
+import ClickOutside from 'coral-framework/components/ClickOutside';
 
 import t from 'coral-framework/services/i18n';
 
-class PermalinkButton extends React.Component {
+export default class PermalinkButton extends React.Component {
 
   static propTypes = {
     articleURL: PropTypes.string.isRequired,
@@ -28,7 +28,7 @@ class PermalinkButton extends React.Component {
     this.setState({popoverOpen: !this.state.popoverOpen});
   }
 
-  handleClickOutside () {
+  handleClickOutside = () => {
     this.setState({popoverOpen: false});
   }
 
@@ -49,33 +49,33 @@ class PermalinkButton extends React.Component {
   render () {
     const {copySuccessful, copyFailure} = this.state;
     return (
-      <div className={`${name}-container`}>
-        <button
-          ref={(ref) => this.linkButton = ref}
-          onClick={this.toggle}
-          className={`${name}-button`}>
-          {t('permalink')}
-          <i className={`${name}-icon material-icons`} aria-hidden={true}>link</i>
-        </button>
-        <div
-          ref={(ref) => this.popover = ref}
-          className={`${name}-popover ${styles.container} ${this.state.popoverOpen ? 'active' : ''}`}>
-          <input
-            className={`${name}-copy-field`}
-            type='text'
-            ref={(input) => this.permalinkInput = input}
-            value={`${this.props.articleURL}#${this.props.commentId}`}
-            onChange={() => {}} />
-          <Button className={`${name}-copy-button ${copySuccessful ? styles.success : ''} ${copyFailure ? styles.failure : ''}`}
-                  onClick={this.copyPermalink} >
-            {!copyFailure && !copySuccessful && 'Copy'}
-            {copySuccessful && 'Copied'}
-            {copyFailure && 'Not supported'}
-          </Button>
+      <ClickOutside onClickOutside={this.handleClickOutside}>
+        <div className={`${name}-container`}>
+          <button
+            ref={(ref) => this.linkButton = ref}
+            onClick={this.toggle}
+            className={`${name}-button`}>
+            {t('permalink')}
+            <i className={`${name}-icon material-icons`} aria-hidden={true}>link</i>
+          </button>
+          <div
+            ref={(ref) => this.popover = ref}
+            className={`${name}-popover ${styles.container} ${this.state.popoverOpen ? 'active' : ''}`}>
+            <input
+              className={`${name}-copy-field`}
+              type='text'
+              ref={(input) => this.permalinkInput = input}
+              value={`${this.props.articleURL}#${this.props.commentId}`}
+              onChange={() => {}} />
+            <Button className={`${name}-copy-button ${copySuccessful ? styles.success : ''} ${copyFailure ? styles.failure : ''}`}
+                    onClick={this.copyPermalink} >
+              {!copyFailure && !copySuccessful && 'Copy'}
+              {copySuccessful && 'Copied'}
+              {copyFailure && 'Not supported'}
+            </Button>
+          </div>
         </div>
-      </div>
+      </ClickOutside>
     );
   }
 }
-
-export default onClickOutside(PermalinkButton);
diff --git a/client/coral-ui/components/Drawer.js b/client/coral-ui/components/Drawer.js
index e9ebed92c..3c4f051bd 100644
--- a/client/coral-ui/components/Drawer.js
+++ b/client/coral-ui/components/Drawer.js
@@ -1,11 +1,10 @@
 import React, {PropTypes} from 'react';
 import styles from './Drawer.css';
-import onClickOutside from 'react-onclickoutside';
 
-const Drawer = ({children, handleClickOutside}) => {
+const Drawer = ({children, onClose}) => {
   return (
     <div className={styles.drawer}>
-      <div className={styles.closeButton} onClick={handleClickOutside}>×</div>
+      <div className={styles.closeButton} onClick={onClose}>×</div>
       <div className={styles.content}>
         {children}
       </div>
@@ -15,7 +14,7 @@ const Drawer = ({children, handleClickOutside}) => {
 
 Drawer.propTypes = {
   active: PropTypes.bool,
-  handleClickOutside: PropTypes.func.isRequired
+  onClose: PropTypes.func.isRequired
 };
 
-export default onClickOutside(Drawer);
+export default Drawer;
diff --git a/package.json b/package.json
index e78a78083..729358ffc 100644
--- a/package.json
+++ b/package.json
@@ -193,7 +193,6 @@
     "react-linkify": "^0.1.3",
     "react-mdl": "^1.7.2",
     "react-mdl-selectfield": "^0.2.0",
-    "react-onclickoutside": "^5.11.1",
     "react-redux": "^4.4.5",
     "react-router": "^3.0.0",
     "react-tagsinput": "^3.14.0",
diff --git a/yarn.lock b/yarn.lock
index f35a3bf16..df7efdaf8 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2041,7 +2041,7 @@ create-hmac@^1.1.0, create-hmac@^1.1.2:
     create-hash "^1.1.0"
     inherits "^2.0.1"
 
-create-react-class@^15.5.1, create-react-class@^15.5.x:
+create-react-class@^15.5.1:
   version "15.5.2"
   resolved "https://registry.yarnpkg.com/create-react-class/-/create-react-class-15.5.2.tgz#6a8758348df660b88326a0e764d569f274aad681"
   dependencies:
@@ -6904,12 +6904,6 @@ react-mdl@^1.7.1, react-mdl@^1.7.2:
     lodash.isequal "^4.4.0"
     prop-types "^15.5.0"
 
-react-onclickoutside@^5.11.1:
-  version "5.11.1"
-  resolved "https://registry.yarnpkg.com/react-onclickoutside/-/react-onclickoutside-5.11.1.tgz#00314e52567cf55faba94cabbacd119619070623"
-  dependencies:
-    create-react-class "^15.5.x"
-
 react-recaptcha@^2.2.6:
   version "2.2.6"
   resolved "https://registry.yarnpkg.com/react-recaptcha/-/react-recaptcha-2.2.6.tgz#bb44c1948a39b37d5a41920c73db833e5d8524f9"