Merge pull request #33 from FBDevCLagos/feature/#16/proverbs-CRUD

Feature/#16/proverbs crud

Author: akinjide

.gitignore

@@ -6,3 +6,4 @@ node_modules
 bower_components
 buildcoverage
 coverage
+.idea

package.json

@@ -39,13 +39,15 @@
     "react-redux": "4.4.5",
     "react-router": "2.4.0",
     "react-router-redux": "4.0.4",
+    "react-select": "^1.0.0-rc.1",
     "react-static-container": "^1.0.1",
     "react-tinymce": "^0.5.1",
     "redux": "3.5.2",
     "redux-thunk": "2.0.1",
     "sinon": "^1.17.4",
     "toastr": "2.1.2",
     "twitter-bootstrap-wizard": "^1.2.0",
+    "underscore": "^1.8.3",
     "url-loader": "^0.5.6",
     "webpack": "^1.12.2"
   },

src/css/4-pages/proverbs.scss

@@ -33,8 +33,30 @@
     }
 
     .fav-buttons {
+      display: flex;
       float: right;
       margin: 0 10px;
     }
   }
 }
+
+.proverb-form {
+  .proverb-form-control {
+    padding: 0 15px;
+
+    .btn {
+      outline: none;
+    }
+  }
+}
+
+.translation-form {
+  border: 1px solid $gray1;
+  border-radius: 5px;
+  padding: 10px;
+
+  .close-form {
+    color: $primary-color;
+    cursor: pointer;
+  }
+}

src/css/main.scss

@@ -1,3 +1,6 @@
+@import "../../node_modules/react-select/dist/react-select.css";
+@import "../../node_modules/toastr/build/toastr.css";
+
 @import "1-tools/-tools-index";
 @import "2-base/-base-index";
 @import "3-modules/-modules-index";

src/js/actions/actionTypes.js

@@ -3,7 +3,9 @@ export default {
   LOAD_PROVERBS_SUCCESS     : 'LOAD_PROVERBS_SUCCESS',
   LOAD_PROVERB_SUCCESS      : 'LOAD_PROVERB_SUCCESS',
   UPDATE_PROVERB_SUCCESS    : 'UPDATE_PROVERB_SUCCESS',
+  CREATE_PROVERB_SUCCESS    : 'CREATE_PROVERB_SUCCESS',
   LOAD_TRANSLATIONS_SUCCESS : 'LOAD_TRANSLATIONS_SUCCESS',
   LOAD_TRANSLATION_SUCCESS  : 'LOAD_TRANSLATION_SUCCESS',
-  UPDATE_TRANSLATION_SUCCESS: 'UPDATE_TRANSLATION_SUCCESS'
+  UPDATE_TRANSLATION_SUCCESS: 'UPDATE_TRANSLATION_SUCCESS',
+  SAVE_PROVERB_ERROR        : 'SAVE_PROVERB_ERROR'
 };

src/js/actions/proverbActions.js

@@ -3,43 +3,40 @@ import webAPI from '../utils/webAPI';
 import mockProverbApi from '../api/mockProverbsApi';
 
 /**
-* @param {Object} proverbs: object
+* @param array of proverbs
 * @return {Object} containing the action type and data
 */
 export function loadProverbsSuccess(proverbs) {
   return { type: types.LOAD_PROVERBS_SUCCESS, proverbs };
 }
 
 /**
-* @param {Object} proverbs: object
-* @return {Object} containing the action type and data
-*/
-export function loadProverbSuccess(proverb) {
-  return { type: types.LOAD_PROVERB_SUCCESS, proverb };
-}
-
-/**
-* @param {Object} proverbs: key proverbs and value is an array of questions
+* @param {Object} proverb
 * @return {Object} containing the action type and proverb
 */
 export function updateProverbSuccess(proverb) {
   return { type: types.UPDATE_PROVERB_SUCCESS, proverb };
 }
 
-export function loadProverbs() {
+export function loadProverbs(locale) {
+  const defaultLocale = locale ? locale : 'en';
   return dispatch => {
-    return webAPI(`/proverbs`, 'GET', '')
+    return webAPI(`${'/' + defaultLocale + '/proverbs'}`, 'GET', '')
       .then(res => {
-        dispatch(loadProverbsSuccess(res.proverbs));
+        dispatch(loadProverbsSuccess(res));
       });
   };
 }
 
-export function loadProverb(proverbId) {
-  return dispatch => {
-    return mockProverbApi.getProverb(proverbId)
-      .then(proverb => {
-        dispatch(loadProverbSuccess(proverb));
-      });
+export function saveProverb(proverb) {
+  const type = proverb.id ? 'PUT' : 'POST';
+  const rootUrl = `/proverbs`;
+  const url = proverb.id ? `${rootUrl + '/' + proverb.id}` : rootUrl;
+
+  return (dispatch) => {
+    return webAPI(url, type, proverb)
+      .then(res => {
+        dispatch(updateProverbSuccess(res))       
+      })
   };
 }

src/js/actions/proverbActions.spec.js

@@ -1,63 +1,97 @@
 import expect from 'expect';
-import * as proverbActions from './proverbActions';
-import * as types from './actionTypes';
 import thunk from 'redux-thunk';
 import nock from 'nock';
 import configureMockStore from 'redux-mock-store';
-
+import { omit } from 'underscore';
 import Config from '../config/environment';
+import * as proverbActions from './proverbActions';
+import * as types from './actionTypes';
 
-describe('loadProverbsSuccess', () => {
-  describe('Create load Proverbs Action', () => {
-    it('should create a LOAD_PROVERBS_SUCCESS action', () => {
-      // setup
-      const proverbs = [
-        {id: 'A1023'}
-      ];
-      const expectedAction = {
-        type: types.default.LOAD_PROVERBS_SUCCESS,
-        proverbs
-      };
-
-      // actions
-      const action = proverbActions.loadProverbsSuccess(proverbs);
-
-      // assertions
-      expect(action).toEqual(expectedAction);
-    });
-  });
-});
+const proverb = { id: 'A1023', body: 'Testing proverb' };
+const proverbs = [ proverb ]; 
 
-const middleware = [thunk];
-const mockStore = configureMockStore(middleware);
+describe('Proverb actions', () => {
 
-describe('loadProverbs', function() {
-  afterEach(() => {
-    nock.cleanAll();
-  });
-  // this.timeout(15000);
-  it('should dispatch a success action on successful API response', done => {
+  it('should create a LOAD_PROVERBS_SUCCESS action', () => {
+
+    const expectedAction = {
+      type: types.default.LOAD_PROVERBS_SUCCESS,
+      proverbs
+    };
+
+    // actions
+    const action = proverbActions.loadProverbsSuccess(proverbs);
+
+    // assertions
+    expect(action).toEqual(expectedAction);
+  }); 
+
+  it('should create a UPDATE_PROVERB_SUCCESS action', () => {
     // setup
-    const proverbs = [{id: 'A1023', name: 'first proverb'}];
+    const expectedUpdateAction = {
+      type: types.default.UPDATE_PROVERB_SUCCESS,
+      proverb
+    };
+
+    // actions
+    const action = proverbActions.updateProverbSuccess(proverb);
 
-    nock(Config.host)
-    .get('/proverbs/recent')
-    .reply(200, {body: proverbs});
+    // assertions
+    expect(action).toEqual(expectedUpdateAction);
+  });
 
-    const expectedActions = [
-      {type: types.default.LOAD_PROVERBS_SUCCESS, proverbs}
-    ];
+  describe('Proverb action thunks', function() {
 
-    // action
-    const initialAppState = {tags: []};
-    const store = mockStore(initialAppState, expectedActions);
+    const middleware = [thunk];
+    const mockStore = configureMockStore(middleware);
+    const initialAppState = { proverbs: [], proverb: {} };
 
-    store.dispatch(proverbActions.loadProverbs()).then(() => {
-      const actions = store.getActions();
-      // expect(actions[0].type).toEqual(types.default.LOAD_PROVERBS_SUCCESS);
-      // expect(actions[0].proverbs).toEqual(proverbs);
+    afterEach(() => {
+      nock.cleanAll();
     });
 
-    done();
-  });
+    // this.timeout(15000);
+    describe('loadProverbs', () => {
+      it('should dispatch a success action on successful API response', done => {
+
+        nock(Config.host)
+        .get('/proverbs')
+        .reply(200, proverbs);
+
+        const expectedActions = [
+          {type: types.default.LOAD_PROVERBS_SUCCESS, proverbs}
+        ];
+
+        // action
+        const store = mockStore(initialAppState, expectedActions);
+        store.dispatch(proverbActions.loadProverbs())
+          .then(() => {
+            const [actions] = store.getActions();
+            expect(actions.type).toEqual(types.default.LOAD_PROVERBS_SUCCESS);
+          });
+
+          done();
+      }); 
+    })
+
+    describe('saveProverbs', () => {
+      it('should dispatch a success action on successful API response', done => {
+
+        const expectedActions = [
+          {type: types.default.UPDATE_PROVERB_SUCCESS, proverb}
+        ];
+        
+        // action
+        const store = mockStore(initialAppState, expectedActions);
+        const [actions] = store.getActions();
+        store.dispatch(proverbActions.saveProverb(proverb))
+          .then(() => {
+            expect(actions.type).toEqual(types.default.UPDATE_PROVERB_SUCCESS);
+          });
+          
+          done();
+      }); 
+    })    
+  });  
+
 });

src/js/api/data/proverbs.js

@@ -13,14 +13,16 @@ export const proverbs = [
       translations: [
           {
               id: 1,
+              proverbId: 1,
               body: "Ura ga-eju onye nwuru anwu afo",
-              language: "ig"
+              language: "Igbo"
 
           },
           {
-              id: 1,
+              id: 2,
+              proverbId: 1,
               body: "Eni to ku, o ma sun dada",
-              language: "yb"
+              language: "Yoruba"
 
           }
       ],
@@ -37,9 +39,10 @@ export const proverbs = [
       ],
       translations: [
           {
-              id: 2,
+              id: 1,
+              proverbId: 2,
               body: "Gidi gidi bụ ugwu eze.",
-              language: "ig"
+              language: "Igbo"
           }
       ],
       status: "approved"
@@ -54,9 +57,10 @@ export const proverbs = [
       ],
       translations: [
           {
-              id: 3,
+              id: 1,
+              proverbId: 3,
               body: "Chọọ ewu ojii ka chi dị",
-              language: "ig"
+              language: "Igbo"
           }
       ],
       status: "approved"
@@ -70,9 +74,10 @@ export const proverbs = [
       ],
       translations: [
           {
-              id: 4,
+              id: 1,
+              proverbId: 4,
               body: "Ihe ehi hụrụ gbalaba oso ka okuku huru na-atụ onu",
-              language: "ig"
+              language: "Igbo"
           }
       ],
       status: "approved"
@@ -88,9 +93,10 @@ export const proverbs = [
       ],
       translations: [
           {
-              id: 5,
+              id: 1,
+              proverbId: 5,
               body: "Ibi tí à ńlọ là ńwò, a kìí wo ibi tí a ti ṣubú",
-              language: "yb",
+              language: "Yoruba",
               literal_translation: "Focus on where you are going, not where you'd fallen"
           }
       ],
@@ -106,9 +112,10 @@ export const proverbs = [
       ],
       translations: [
           {
-              id: 6,
+              id: 1,
+              proverbId: 6,
               body: "Tí ẹyẹ ò bá fín ẹyẹ níràn, ojú ọrun tó ẹyẹ ẹ́ fò láì fara kanra. ",
-              language: "yb",
+              language: "Yoruba",
               literal_translation: "If a bird won't seek the ill of another, the sky is wide enough for all to fly without colliding."
           }
       ]
@@ -124,9 +131,10 @@ export const proverbs = [
       ],
       translations: [
           {
-              id: 7,
+              id: 1,
+              proverbId: 7,
               body: "Adániwáyè ò gbàgbé ẹnìkan; àìmàsìkò ló ńdààmú ẹ̀dá.",
-              language: "yb",
+              language: "Yoruba",
               literal_translation: "God hasn't forgotten anyone; ignorance of divine timing is what makes us fret."
           }
       ]
@@ -140,9 +148,10 @@ export const proverbs = [
       ],
       translations: [
           {
-              id: 8,
+              id: 1,
+              proverbId: 8,
               body: "Ẹni tó bá da omi síwájú á tẹ'lẹ tútù.",
-              language: "yb",
+              language: "Yoruba",
               tags: [ "love", "name", "peace" ]
           }
       ],