Preparing for follow form

app/assets/javascripts/components/actions/follow.jsx

+import api from '../api'
+
+export const FOLLOW_CHANGE         = 'FOLLOW_CHANGE';
+export const FOLLOW_SUBMIT         = 'FOLLOW_SUBMIT';
+export const FOLLOW_SUBMIT_REQUEST = 'FOLLOW_SUBMIT_REQUEST';
+export const FOLLOW_SUBMIT_SUCCESS = 'FOLLOW_SUBMIT_SUCCESS';
+export const FOLLOW_SUBMIT_FAIL    = 'FOLLOW_SUBMIT_FAIL';
+
+export function followChange(text) {
+  return {
+    type: FOLLOW_CHANGE,
+    text: text
+  };
+}
+
+export function followSubmit() {
+  return function (dispatch, getState) {
+    dispatch(followSubmitRequest());
+
+    api(getState).post('/api/follows', {
+      uri: getState().getIn(['follow', 'text'])
+    }).then(function (response) {
+      dispatch(followSubmitSuccess(response.data));
+    }).catch(function (error) {
+      dispatch(followSubmitFail(error));
+    });
+  };
+}
+
+export function followSubmitRequest() {
+  return {
+    type: FOLLOW_SUBMIT_REQUEST
+  };
+}
+
+export function followSubmitSuccess(account) {
+  return {
+    type: FOLLOW_SUBMIT_SUCCESS,
+    account: account
+  };
+}
+
+export function followSubmitFail(error) {
+  return {
+    type: FOLLOW_SUBMIT_FAIL,
+    error: error
+  };
+}

app/assets/javascripts/components/components/status.jsx

@@ -34,10 +34,10 @@ const Status = React.createClass({
 
     if (status.get('reblog') !== null) {
       return (
-        <div>
+        <div style={{ cursor: 'pointer' }}>
           <div style={{ marginLeft: '68px', color: '#616b86', padding: '8px 0', paddingBottom: '2px', fontSize: '14px', position: 'relative' }}>
             <div style={{ position: 'absolute', 'left': '-26px'}}><i className='fa fa-fw fa-retweet'></i></div>
-            <a href={status.getIn(['account', 'url'])} style={{ color: '#616b86' }}>{status.getIn(['account', 'display_name'])}</a> reblogged
+            <a href={status.getIn(['account', 'url'])} className='status__display-name'><strong style={{ color: '#616b86'}}>{status.getIn(['account', 'display_name'])}</strong></a> reblogged
           </div>
 
           <Status {...other} status={status.get('reblog')} />

app/assets/javascripts/components/reducers/follow.jsx

+import * as constants from '../actions/follow';
+import Immutable                                                                                              from 'immutable';
+
+const initialState = Immutable.Map({
+  text: '',
+  is_submitting: false
+});
+
+export default function compose(state = initialState, action) {
+  switch(action.type) {
+    case constants.FOLLOW_CHANGE:
+      return state.set('text', action.text);
+    case constants.FOLLOW_SUBMIT_REQUEST:
+      return state.set('is_submitting', true);
+    case constants.FOLLOW_SUBMIT_SUCCESS:
+      return state.withMutations(map => {
+        map.set('text', '').set('is_submitting', false);
+      });
+    case constants.FOLLOW_SUBMIT_FAIL:
+      return state.set('is_submitting', false);
+    default:
+      return state;
+  }
+}

app/assets/javascripts/components/reducers/index.jsx

@@ -2,9 +2,11 @@ import { combineReducers } from 'redux-immutable';
 import timelines           from './timelines';
 import meta                from './meta';
 import compose             from './compose';
+import follow              from './follow';
 
 export default combineReducers({
   timelines,
   meta,
-  compose
+  compose,
+  follow
 });