add topic following for internal testing

app/assets/stylesheets/application.scss.erb

@@ -3139,3 +3139,13 @@ script.data-gratipay-username {
 .inline {
   display: inline-block;
 }
+
+.topicFollow {
+    text-align: center;
+    height: 48px;
+    line-height: 48px;
+    border-top: 1px solid #BDBDBD;
+    background: #FFF;
+    cursor: pointer;
+    font-family: din-regular;
+}

frontend/src/Metamaps/Views/TopicCard.js

@@ -5,6 +5,7 @@ import ReactDOM from 'react-dom'
 
 import Active from '../Active'
 import Visualize from '../Visualize'
+import GlobalUI from '../GlobalUI'
 
 import ReactTopicCard from '../../components/TopicCard'
 
@@ -24,6 +25,20 @@ const TopicCard = {
         updateTopic: obj => {
           topic.save(obj, { success: topic => self.populateShowCard(topic) })
         },
+        onFollow: () => {
+          const isFollowing = topic.isFollowedBy(Active.Mapper)
+          $.post({
+            url: `/topics/${topic.id}/${isFollowing ? 'un' : ''}follow`
+          })
+          if (isFollowing) {
+            GlobalUI.notifyUser('You are no longer following this topic')
+            Active.Mapper.unfollowTopic(topic.id)
+          } else {
+            GlobalUI.notifyUser('You are now following this topic')
+            Active.Mapper.followTopic(topic.id)
+          }
+          self.populateShowCard(topic)
+        },
         metacodeSets: self.metacodeSets,
         redrawCanvas: () => {
           Visualize.mGraph.plot()

frontend/src/components/TopicCard/Follow.js

@@ -0,0 +1,17 @@
+import React, { PropTypes, Component } from 'react'
+
+class Follow extends Component {
+  render = () => {
+    const { isFollowing, onFollow } = this.props
+    return <div className='topicFollow' onClick={onFollow}>
+      {isFollowing ? 'Unfollow' : 'Follow'}
+    </div>
+  }
+}
+
+Follow.propTypes = {
+  isFollowing: PropTypes.bool,
+  onFollow: PropTypes.func
+}
+
+export default Follow

frontend/src/components/TopicCard/index.js

@@ -4,11 +4,15 @@ import Title from './Title'
 import Links from './Links'
 import Desc from './Desc'
 import Attachments from './Attachments'
+import Follow from './Follow'
+import Util from '../../Metamaps/Util'
+
 
 class ReactTopicCard extends Component {
   render = () => {
-    const { topic, ActiveMapper } = this.props
+    const { topic, ActiveMapper, onFollow } = this.props
     const authorizedToEdit = topic.authorizeToEdit(ActiveMapper)
+    const isFollowing = topic.isFollowedBy(ActiveMapper)
     const hasAttachment = topic.get('link') && topic.get('link') !== ''
 
     let classname = 'permission'
@@ -40,6 +44,7 @@ class ReactTopicCard extends Component {
             authorizedToEdit={authorizedToEdit}
             updateTopic={this.props.updateTopic}
           />
+          {Util.isTester(ActiveMapper) && <Follow isFollowing={isFollowing} onFollow={onFollow} />}
           <div className="clearfloat"></div>
         </div>
       </div>
@@ -51,6 +56,7 @@ ReactTopicCard.propTypes = {
   topic: PropTypes.object,
   ActiveMapper: PropTypes.object,
   updateTopic: PropTypes.func,
+  onFollow: PropTypes.func,
   metacodeSets: PropTypes.arrayOf(PropTypes.shape({
     name: PropTypes.string,
     metacodes: PropTypes.arrayOf(PropTypes.shape({