set clientId on remote actions for duplicate vote prevention

teropa · teropa · commit 59a8b529d7a7 · 2015-09-10T16:42:16.000+03:00
diff --git a/package.json b/package.json
@@ -25,10 +25,12 @@
   "dependencies": {
     "classnames": "^2.1.3",
     "immutable": "^3.7.5",
+    "object-assign": "^4.0.1",
     "react": "^0.13.3",
     "react-redux": "^2.1.0",
     "react-router": "^0.13.3",
     "redux": "^2.0.0",
-    "socket.io-client": "^1.3.6"
+    "socket.io-client": "^1.3.6",
+    "uuid": "^2.0.1"
   }
 }
diff --git a/src/action_creators.js b/src/action_creators.js
@@ -1,3 +1,10 @@
+export function setClientId(clientId) {
+  return {
+    type: 'SET_CLIENT_ID',
+    clientId
+  };
+}
+
 export function setState(state) {
   return {
     type: 'SET_STATE',
diff --git a/src/client_id.js b/src/client_id.js
@@ -0,0 +1,10 @@
+import uuid from 'uuid';
+
+export default function getClientId() {
+  let id = localStorage.getItem('clientId');
+  if (!id) {
+    id = uuid.v4();
+    localStorage.setItem('clientId', id);
+  }
+  return id;
+}
diff --git a/src/index.jsx b/src/index.jsx
@@ -4,8 +4,9 @@ import {createStore, applyMiddleware} from 'redux';
 import {Provider} from 'react-redux';
 import io from 'socket.io-client';
 import reducer from './reducer';
-import {setState} from './action_creators';
+import {setClientId, setState} from './action_creators';
 import remoteActionMiddleware from './remote_action_middleware';
+import getClientId from './client_id';
 import App from './components/App';
 import {VotingContainer} from './components/Voting';
 import {ResultsContainer} from './components/Results';
@@ -21,6 +22,7 @@ const createStoreWithMiddleware = applyMiddleware(
   remoteActionMiddleware(socket)
 )(createStore);
 const store = createStoreWithMiddleware(reducer);
+store.dispatch(setClientId(getClientId()));
 
 const routes = <Route handler={App}>
   <Route path="/results" handler={ResultsContainer} />
diff --git a/src/reducer.js b/src/reducer.js
@@ -29,6 +29,8 @@ function resetVote(state) {
 
 export default function(state = Map(), action) {
   switch (action.type) {
+  case 'SET_CLIENT_ID':
+    return state.set('clientId', action.clientId);
   case 'SET_STATE':
     return resetVote(setState(state, action.state));
   case 'VOTE':
diff --git a/src/remote_action_middleware.js b/src/remote_action_middleware.js
@@ -1,6 +1,9 @@
+import objectAssign from 'object-assign';
+
 export default socket => store => next => action => {
   if (action.meta && action.meta.remote) {
-    socket.emit('action', action);
+    const clientId = store.getState().get('clientId');
+    socket.emit('action', objectAssign({}, action, {clientId}));
   }
   return next(action);
 }
diff --git a/test/reducer_spec.js b/test/reducer_spec.js
@@ -5,6 +5,19 @@ import reducer from '../src/reducer';
 
 describe('reducer', () => {
 
+  it('handles SET_CLIENT_ID', () => {
+    const initialState = Map();
+    const action = {
+      type: 'SET_CLIENT_ID',
+      clientId: '1234'
+    };
+    const nextState = reducer(initialState, action);
+
+    expect(nextState).to.equal(fromJS({
+      clientId: '1234'
+    }));
+  });
+  
   it('handles SET_STATE', () => {
     const initialState = Map();
     const action = {

Original file line number	Diff line number	Diff line change
`@@ -25,10 +25,12 @@`
`25`	`25`	`"dependencies": {`
`26`	`26`	`"classnames": "^2.1.3",`
`27`	`27`	`"immutable": "^3.7.5",`
	`28`	`+ "object-assign": "^4.0.1",`
`28`	`29`	`"react": "^0.13.3",`
`29`	`30`	`"react-redux": "^2.1.0",`
`30`	`31`	`"react-router": "^0.13.3",`
`31`	`32`	`"redux": "^2.0.0",`
`32`		`- "socket.io-client": "^1.3.6"`
	`33`	`+ "socket.io-client": "^1.3.6",`
	`34`	`+ "uuid": "^2.0.1"`
`33`	`35`	`}`
`34`	`36`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,9 @@`
	`1`	`+import objectAssign from 'object-assign';`
	`2`	`+`
`1`	`3`	`export default socket => store => next => action => {`
`2`	`4`	`if (action.meta && action.meta.remote) {`
`3`		`- socket.emit('action', action);`
	`5`	`+ const clientId = store.getState().get('clientId');`
	`6`	`+ socket.emit('action', objectAssign({}, action, {clientId}));`
`4`	`7`	`}`
`5`	`8`	`return next(action);`
`6`	`9`	`}`