diff --git a/app/javascript/src/__tests__/__snapshots__/Onboarding.test.jsx.snap b/app/javascript/src/__tests__/__snapshots__/Onboarding.test.jsx.snap
index e0d8aa833..bbde3463f 100644
--- a/app/javascript/src/__tests__/__snapshots__/Onboarding.test.jsx.snap
+++ b/app/javascript/src/__tests__/__snapshots__/Onboarding.test.jsx.snap
@@ -247,7 +247,7 @@ preact-render-spy (1 nodes)
             >
               <a
                 class="onboarding-tag-link"
-                href="#"
+                href="#0"
                 style="color:"
                 onClick={[Function bound onClick]}
               >
@@ -255,7 +255,7 @@ preact-render-spy (1 nodes)
               </a>
               <a
                 class="onboarding-tag-link-follow"
-                href="#"
+                href="#0"
                 id="onboarding-tag-link-follow-discuss"
                 style="color:"
                 onClick={[Function bound onClick]}
@@ -270,7 +270,7 @@ preact-render-spy (1 nodes)
             >
               <a
                 class="onboarding-tag-link"
-                href="#"
+                href="#0"
                 style="color:#000000"
                 onClick={[Function bound onClick]}
               >
@@ -278,7 +278,7 @@ preact-render-spy (1 nodes)
               </a>
               <a
                 class="onboarding-tag-link-follow"
-                href="#"
+                href="#0"
                 id="onboarding-tag-link-follow-javascript"
                 style="color:#000000"
                 onClick={[Function bound onClick]}
@@ -293,7 +293,7 @@ preact-render-spy (1 nodes)
             >
               <a
                 class="onboarding-tag-link"
-                href="#"
+                href="#0"
                 style="color:"
                 onClick={[Function bound onClick]}
               >
@@ -301,7 +301,7 @@ preact-render-spy (1 nodes)
               </a>
               <a
                 class="onboarding-tag-link-follow"
-                href="#"
+                href="#0"
                 id="onboarding-tag-link-follow-career"
                 style="color:"
                 onClick={[Function bound onClick]}
@@ -883,7 +883,7 @@ preact-render-spy (1 nodes)
             >
               <a
                 class="onboarding-tag-link"
-                href="#"
+                href="#0"
                 style="color:"
                 onClick={[Function bound onClick]}
               >
@@ -891,7 +891,7 @@ preact-render-spy (1 nodes)
               </a>
               <a
                 class="onboarding-tag-link-follow"
-                href="#"
+                href="#0"
                 id="onboarding-tag-link-follow-discuss"
                 style="color:"
                 onClick={[Function bound onClick]}
@@ -906,7 +906,7 @@ preact-render-spy (1 nodes)
             >
               <a
                 class="onboarding-tag-link"
-                href="#"
+                href="#0"
                 style="color:#000000"
                 onClick={[Function bound onClick]}
               >
@@ -914,7 +914,7 @@ preact-render-spy (1 nodes)
               </a>
               <a
                 class="onboarding-tag-link-follow"
-                href="#"
+                href="#0"
                 id="onboarding-tag-link-follow-javascript"
                 style="color:#000000"
                 onClick={[Function bound onClick]}
@@ -929,7 +929,7 @@ preact-render-spy (1 nodes)
             >
               <a
                 class="onboarding-tag-link"
-                href="#"
+                href="#0"
                 style="color:"
                 onClick={[Function bound onClick]}
               >
@@ -937,7 +937,7 @@ preact-render-spy (1 nodes)
               </a>
               <a
                 class="onboarding-tag-link-follow"
-                href="#"
+                href="#0"
                 id="onboarding-tag-link-follow-career"
                 style="color:"
                 onClick={[Function bound onClick]}
@@ -1144,7 +1144,7 @@ preact-render-spy (1 nodes)
             >
               <a
                 class="onboarding-tag-link"
-                href="#"
+                href="#0"
                 style="color:"
                 onClick={[Function bound onClick]}
               >
@@ -1152,7 +1152,7 @@ preact-render-spy (1 nodes)
               </a>
               <a
                 class="onboarding-tag-link-follow"
-                href="#"
+                href="#0"
                 id="onboarding-tag-link-follow-discuss"
                 style="color:"
                 onClick={[Function bound onClick]}
@@ -1167,7 +1167,7 @@ preact-render-spy (1 nodes)
             >
               <a
                 class="onboarding-tag-link"
-                href="#"
+                href="#0"
                 style="color:#000000"
                 onClick={[Function bound onClick]}
               >
@@ -1175,7 +1175,7 @@ preact-render-spy (1 nodes)
               </a>
               <a
                 class="onboarding-tag-link-follow"
-                href="#"
+                href="#0"
                 id="onboarding-tag-link-follow-javascript"
                 style="color:#000000"
                 onClick={[Function bound onClick]}
@@ -1190,7 +1190,7 @@ preact-render-spy (1 nodes)
             >
               <a
                 class="onboarding-tag-link"
-                href="#"
+                href="#0"
                 style="color:"
                 onClick={[Function bound onClick]}
               >
@@ -1198,7 +1198,7 @@ preact-render-spy (1 nodes)
               </a>
               <a
                 class="onboarding-tag-link-follow"
-                href="#"
+                href="#0"
                 id="onboarding-tag-link-follow-career"
                 style="color:"
                 onClick={[Function bound onClick]}
diff --git a/app/javascript/src/components/OnboardingSingleTag.jsx b/app/javascript/src/components/OnboardingSingleTag.jsx
index 5b7e4ec58..5bf1da813 100644
--- a/app/javascript/src/components/OnboardingSingleTag.jsx
+++ b/app/javascript/src/components/OnboardingSingleTag.jsx
@@ -2,56 +2,53 @@ import { h, Component } from 'preact';
 import PropTypes from 'prop-types';
 
 class OnboardingSingleTag extends Component {
+  propTypes = {
+    onTagClick: PropTypes.func.isRequired,
+    tag: PropTypes.objectOf().isRequired,
+  };
+
   constructor(props) {
     super(props);
     this.onClick = this.onClick.bind(this);
   }
 
   onClick() {
-    this.props.onTagClick(this.props.tag);
+    const { onTagClick, tag } = this.props;
+    onTagClick(tag);
   }
 
   render() {
-    const backgroundColor = this.props.tag.following
-      ? this.props.tag.bg_color_hex
-      : '';
-    const textroundColor = this.props.tag.following
-      ? this.props.tag.text_color_hex
-      : '';
+    const { tag } = this.props;
+    const backgroundColor = tag.following ? tag.bg_color_hex : '';
+    const textroundColor = tag.following ? tag.text_color_hex : '';
     return (
       <div
         className={`onboarding-tag-container${
-          this.props.tag.following ? ' followed-tag' : ''
+          tag.following ? ' followed-tag' : ''
         }`}
-        id={`onboarding-tag-container-${this.props.tag.name}`}
+        id={`onboarding-tag-container-${tag.name}`}
         style={`background: ${backgroundColor}`}
       >
         <a
           className="onboarding-tag-link"
-          href="#"
+          href="#0"
           style={`color:${textroundColor}`}
           onClick={this.onClick}
         >
-          #
-          {this.props.tag.name}
+          #{tag.name}
         </a>
         <a
           className="onboarding-tag-link-follow"
-          href="#"
-          id={`onboarding-tag-link-follow-${this.props.tag.name}`}
+          href="#0"
+          id={`onboarding-tag-link-follow-${tag.name}`}
           style={`color:${textroundColor}`}
           onClick={this.onClick}
         >
-          {this.props.tag.following ? '✓' : '+'}
+          {tag.following ? '✓' : '+'}
         </a>
       </div>
     );
   }
 }
 
-OnboardingSingleTag.propTypes = {
-  onTagClick: PropTypes.func.isRequired,
-  tag: PropTypes.object.isRequired,
-};
-
 export default OnboardingSingleTag;
diff --git a/app/javascript/src/components/OnboardingTags.jsx b/app/javascript/src/components/OnboardingTags.jsx
index e3e4d7d0b..3ad197254 100644
--- a/app/javascript/src/components/OnboardingTags.jsx
+++ b/app/javascript/src/components/OnboardingTags.jsx
@@ -1,30 +1,30 @@
-import { h, render, Component } from 'preact';
+import { h } from 'preact';
+import PropTypes from 'prop-types';
 import OnboardingSingleTag from './OnboardingSingleTag';
 
 // page 2
-class OnboardingTags extends Component {
-  constructor(props) {
-    super(props);
-  }
-
-  render() {
-    const tags = this.props.allTags.map(tag => {
-      return (
-        <OnboardingSingleTag
-          key={tag.id}
-          tag={tag}
-          onTagClick={this.props.handleFollowTag.bind(this, tag)}
-        />
-      );
-    });
-
+function OnboardingTags({ allTags, handleFollowTag }) {
+  const tags = allTags.map(tag => {
     return (
-      <div className="tags-slide">
-        <div className="onboarding-user-cta">Personalize your home feed</div>
-        <div className="tags-col-container">{tags}</div>
-      </div>
+      <OnboardingSingleTag
+        key={tag.id}
+        tag={tag}
+        onTagClick={handleFollowTag.bind(this, tag)} // eslint-disable-line react/jsx-no-bind
+      />
     );
-  }
+  });
+
+  return (
+    <div className="tags-slide">
+      <div className="onboarding-user-cta">Personalize your home feed</div>
+      <div className="tags-col-container">{tags}</div>
+    </div>
+  );
 }
 
+OnboardingTags.propTypes = {
+  handleFollowTag: PropTypes.func.isRequired,
+  allTags: PropTypes.objectOf().isRequired,
+};
+
 export default OnboardingTags;
diff --git a/app/javascript/src/components/__tests__/__snapshots__/OnboardingFollowTags.test.jsx.snap b/app/javascript/src/components/__tests__/__snapshots__/OnboardingFollowTags.test.jsx.snap
index 4b0720c4d..8215a6665 100644
--- a/app/javascript/src/components/__tests__/__snapshots__/OnboardingFollowTags.test.jsx.snap
+++ b/app/javascript/src/components/__tests__/__snapshots__/OnboardingFollowTags.test.jsx.snap
@@ -19,7 +19,7 @@ exports[`<OnboardingFollowTags /> renders properly when given a tag 1`] = `
     >
       <a
         class="onboarding-tag-link"
-        href="#"
+        href="#0"
         onClick={[Function]}
         style="color:"
       >
@@ -27,7 +27,7 @@ exports[`<OnboardingFollowTags /> renders properly when given a tag 1`] = `
       </a>
       <a
         class="onboarding-tag-link-follow"
-        href="#"
+        href="#0"
         id="onboarding-tag-link-follow-discuss"
         onClick={[Function]}
         style="color:"
@@ -42,7 +42,7 @@ exports[`<OnboardingFollowTags /> renders properly when given a tag 1`] = `
     >
       <a
         class="onboarding-tag-link"
-        href="#"
+        href="#0"
         onClick={[Function]}
         style="color:"
       >
@@ -50,7 +50,7 @@ exports[`<OnboardingFollowTags /> renders properly when given a tag 1`] = `
       </a>
       <a
         class="onboarding-tag-link-follow"
-        href="#"
+        href="#0"
         id="onboarding-tag-link-follow-javascript"
         onClick={[Function]}
         style="color:"
@@ -65,7 +65,7 @@ exports[`<OnboardingFollowTags /> renders properly when given a tag 1`] = `
     >
       <a
         class="onboarding-tag-link"
-        href="#"
+        href="#0"
         onClick={[Function]}
         style="color:"
       >
@@ -73,7 +73,7 @@ exports[`<OnboardingFollowTags /> renders properly when given a tag 1`] = `
       </a>
       <a
         class="onboarding-tag-link-follow"
-        href="#"
+        href="#0"
         id="onboarding-tag-link-follow-javascript"
         onClick={[Function]}
         style="color:"
diff --git a/app/javascript/src/components/__tests__/__snapshots__/OnboardingSingleTag.test.jsx.snap b/app/javascript/src/components/__tests__/__snapshots__/OnboardingSingleTag.test.jsx.snap
index 687f46ec4..dc50ff69d 100644
--- a/app/javascript/src/components/__tests__/__snapshots__/OnboardingSingleTag.test.jsx.snap
+++ b/app/javascript/src/components/__tests__/__snapshots__/OnboardingSingleTag.test.jsx.snap
@@ -8,7 +8,7 @@ exports[`<OnboardingSingleTag /> when given a following tag renders correctly 1`
 >
   <a
     class="onboarding-tag-link"
-    href="#"
+    href="#0"
     onClick={[Function]}
     style="color:undefined"
   >
@@ -16,7 +16,7 @@ exports[`<OnboardingSingleTag /> when given a following tag renders correctly 1`
   </a>
   <a
     class="onboarding-tag-link-follow"
-    href="#"
+    href="#0"
     id="onboarding-tag-link-follow-undefined"
     onClick={[Function]}
     style="color:undefined"
@@ -34,7 +34,7 @@ exports[`<OnboardingSingleTag /> when given a non-following tag renders correctl
 >
   <a
     class="onboarding-tag-link"
-    href="#"
+    href="#0"
     onClick={[Function]}
     style="color:"
   >
@@ -42,7 +42,7 @@ exports[`<OnboardingSingleTag /> when given a non-following tag renders correctl
   </a>
   <a
     class="onboarding-tag-link-follow"
-    href="#"
+    href="#0"
     id="onboarding-tag-link-follow-undefined"
     onClick={[Function]}
     style="color:"
diff --git a/app/javascript/src/utils/getUnopenedChannels.jsx b/app/javascript/src/utils/getUnopenedChannels.jsx
index 8c4a26bed..06fbfe5f2 100644
--- a/app/javascript/src/utils/getUnopenedChannels.jsx
+++ b/app/javascript/src/utils/getUnopenedChannels.jsx
@@ -1,7 +1,18 @@
 import { h, render, Component } from 'preact';
+import PropTypes from 'prop-types';
 import setupPusher from './pusher';
 
 class UnopenedChannelNotice extends Component {
+  static defaultProps = {
+    unopenedChannels: undefined,
+    pusherKey: undefined,
+  };
+
+  propTypes = {
+    unopenedChannels: PropTypes.Object,
+    pusherKey: PropTypes.Object,
+  };
+
   constructor(props) {
     super(props);
     const { unopenedChannels } = this.props;
@@ -13,12 +24,13 @@ class UnopenedChannelNotice extends Component {
   }
 
   componentDidMount() {
-    setupPusher(this.props.pusherKey, {
+    const { pusherKey } = this.props;
+    setupPusher(pusherKey, {
       channelId: `private-message-notifications-${window.currentUser.id}`,
       messageCreated: this.receiveNewMessage,
     });
     const component = this;
-    document.getElementById('connect-link').onclick = function() {
+    document.getElementById('connect-link').onclick = () => {
       // Hack, should probably be its own component in future
       document.getElementById('connect-number').classList.remove('showing');
       component.setState({ visible: false });
@@ -26,47 +38,49 @@ class UnopenedChannelNotice extends Component {
   }
 
   receiveNewMessage = e => {
-    if (location.pathname.startsWith('/connect')) {
+    if (window.location.pathname.startsWith('/connect')) {
       return;
     }
-    const channels = this.state.unopenedChannels;
+    const { unopenedChannels } = this.state;
     const newObj = { adjusted_slug: e.chat_channel_adjusted_slug };
     if (
-      channels.filter(obj => obj.adjusted_slug === newObj.adjusted_slug)
+      unopenedChannels.filter(obj => obj.adjusted_slug === newObj.adjusted_slug)
         .length === 0 &&
-      newObj.adjusted_slug != `@${window.currentUser.username}`
+      newObj.adjusted_slug !== `@${window.currentUser.username}`
     ) {
-      channels.push(newObj);
+      unopenedChannels.push(newObj);
     }
     this.setState({
-      visible: channels.length > 0 && e.user_id != window.currentUser.id,
-      unopenedChannels: channels,
+      visible:
+        unopenedChannels.length > 0 && e.user_id !== window.currentUser.id,
+      unopenedChannels,
     });
 
     const number = document.getElementById('connect-number');
     number.classList.add('showing');
-    number.innerHTML = channels.length;
+    number.innerHTML = unopenedChannels.length;
     const component = this;
-    if (channels.length === 0) {
+    if (unopenedChannels.length === 0) {
       number.classList.remove('showing');
     } else {
       document.getElementById('connect-link').href = `/connect/${
-        channels[0].adjusted_slug
+        unopenedChannels[0].adjusted_slug
       }`;
     }
-    setTimeout(function() {
+    setTimeout(() => {
       component.setState({ visible: false });
     }, 7500);
   };
 
-  handleClick = e => {
+  handleClick = () => {
     document.getElementById('connect-number').classList.remove('showing');
     this.setState({ visible: false });
   };
 
   render() {
-    if (this.state.visible) {
-      const channels = this.state.unopenedChannels.map(channel => {
+    const { visible, unopenedChannels } = this.state;
+    if (visible) {
+      const channels = unopenedChannels.map(channel => {
         return (
           <a
             href={`/connect/${channel.adjusted_slug}`}
@@ -87,7 +101,7 @@ class UnopenedChannelNotice extends Component {
       return (
         <a
           onClick={this.handleClick}
-          href={`/connect/${this.state.unopenedChannels[0].adjusted_slug}`}
+          href={`/connect/${unopenedChannels[0].adjusted_slug}`}
           style={{
             position: 'fixed',
             zIndex: '200',
@@ -104,16 +118,29 @@ class UnopenedChannelNotice extends Component {
             padding: '19px 5px 14px',
           }}
         >
-          New Message from 
-          {' '}
-          {channels}
+          New Message from {channels}
         </a>
       );
     }
+
+    return '';
   }
 }
 
-export default function getUnopenedChannels(user, successCb) {
+function manageChannel(json) {
+  const number = document.getElementById('connect-number');
+  if (json.length > 0) {
+    number.classList.add('showing');
+    number.innerHTML = json.length;
+    document.getElementById('connect-link').href = `/connect/${
+      json[0].adjusted_slug
+    }`; // Jump the user directly to the channel where appropriate
+  } else {
+    number.classList.remove('showing');
+  }
+}
+
+export default function getUnopenedChannels() {
   render(
     <UnopenedChannelNotice
       unopenedChannels={[]}
@@ -121,27 +148,12 @@ export default function getUnopenedChannels(user, successCb) {
     />,
     document.getElementById('message-notice'),
   );
-  if (location.pathname.startsWith('/connect')) {
-    return;
-  }
+  if (window.location.pathname.startsWith('/connect')) return;
   fetch('/chat_channels?state=unopened', {
-    method: 'GET',
     credentials: 'same-origin',
   })
     .then(response => response.json())
     .then(json => {
-      const number = document.getElementById('connect-number');
-      if (json.length > 0) {
-        number.classList.add('showing');
-        number.innerHTML = json.length;
-        document.getElementById('connect-link').href = `/connect/${
-          json[0].adjusted_slug
-        }`; // Jump the user directly to the channel where appropriate
-      } else {
-        number.classList.remove('showing');
-      }
-    })
-    .catch(error => {
-      console.log(error);
+      manageChannel(json);
     });
 }