[feature #165412889 && #165412878] add article rating && article read…

… time

src/__tests__/actions/articles/getPublished.test.js

@@ -0,0 +1,12 @@
+import { getPublished } from '../../../actions/articles';
+import article from '../../../__mocks__/article';
+
+const dispatch = jest.fn(action => action);
+
+describe('published article articles', () => {
+  it('returns publish information', async () => {
+    const result = getPublished()(dispatch);
+    expect(result).toHaveProperty('type');
+    expect(result).toHaveProperty('payload');
+  });
+});

src/__tests__/actions/rating/__snapshots__/createRate.test.js.snap

@@ -0,0 +1,3 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<RatingComponent /> should render a <CreateRatingComponent /> component  1`] = `ShallowWrapper {}`;

src/__tests__/actions/rating/createRate.test.js

@@ -0,0 +1,36 @@
+import React from 'react';
+import configureMockStore from 'redux-mock-store';
+import thunk from 'react-thunk';
+import { Provider } from 'react-redux';
+// import article from '../../../__mocks__/article';
+import { createRate } from '../../../actions/rating';
+import { Rating as RatingComponent } from '../../../components/Articles/Article/Rating';
+import { shallow, mount } from '../../../../config/enzymeConfig';
+
+describe('<RatingComponent />', () => {
+  const props = {
+    slug: 'slug-slug',
+    rating: 1,
+    errors: { error: ['12'] },
+    createRate: jest.fn(),
+    fetchOneArticle: jest.fn()
+  };
+  const rating = {
+    slug: 'slug-slug',
+    rating: 1
+  };
+  const component = shallow(<RatingComponent {...props} />);
+  it('should render a <CreateRatingComponent /> component ', () => {
+    expect(component).toMatchSnapshot();
+  });
+  const dispatch = jest.fn(action => action);
+
+  describe('Create rating', () => {
+    test('returns rating information', async () => {
+      const result = createRate(rating)(dispatch);
+      expect(result).toHaveProperty('type');
+      expect(result).toHaveProperty('payload');
+      // expect(result.payload).toEqual(rating);
+    });
+  });
+});

src/__tests__/components/Profile/MyArticles/Published.test.js

@@ -0,0 +1,100 @@
+import React from 'react';
+import configureMockStore from 'redux-mock-store';
+import thunk from 'react-thunk';
+import { Provider } from 'react-redux';
+import { MemoryRouter } from 'react-router-dom';
+import URL from '../../../../__mocks__/URL';
+import articles from '../../../../__mocks__/articles';
+import { mockStore, initialState } from '../../../../__mocks__/store';
+import { PublishedArticles as PublishedArticlesComponent } from '../../../../components/Profile/Articles/MyArticles/Published';
+import { mount, shallow } from '../../../../../config/enzymeConfig';
+
+const props = {
+  errors: {},
+  article: {
+    title: 'Hello John Doe',
+    description: 'John Doe, Mocker',
+    body: 'body of the article',
+    slug: 'slug-slug-slug'
+  },
+  message: { message: 'Published' },
+  fetchOneArticle: jest.fn(),
+  history: {},
+  match: { params: { slug: 'slug-slug-slug' } },
+  publishArticle: jest.fn(),
+  unpublishArticle: jest.fn(),
+  deleteArticle: jest.fn(),
+  fileSelectedHandler: jest.fn(),
+  createObjectURL: jest.fn(),
+  getPublished: jest.fn()
+};
+const store = mockStore({
+  ...initialState,
+  articles: { articles },
+  getPublished: jest.fn(true)
+});
+const state = {
+  article: {
+    title: 'Hello John Doe',
+    description: 'John Doe, Mocker',
+    body: JSON.stringify({
+      blocks: [
+        {
+          key: 'cnu26',
+          text: 'test componentWillReceiveProps failedtest componentWillReceiveProps failed',
+          type: 'unstyled',
+          depth: 0,
+          inlineStyleRanges: [
+            { offset: 0, length: 74, style: 'color-rgb(36,41,46)' },
+            { offset: 0, length: 74, style: 'bgcolor-rgb(255,255,255)' },
+            { offset: 0, length: 74, style: 'fontsize-32' },
+            {
+              offset: 0,
+              length: 74,
+              style:
+                'fontfamily--apple-system, system-ui, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol'
+            }
+          ],
+          entityRanges: [],
+          data: { 'text-align': 'start' }
+        },
+        {
+          key: 'emuik',
+          text: 'Okey',
+          type: 'unstyled',
+          depth: 0,
+          inlineStyleRanges: [
+            { offset: 0, length: 4, style: 'color-rgb(36,41,46)' },
+            { offset: 0, length: 4, style: 'bgcolor-rgb(255,255,255)' },
+            { offset: 0, length: 4, style: 'fontsize-32' },
+            {
+              offset: 0,
+              length: 4,
+              style:
+                'fontfamily--apple-system, system-ui, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol'
+            }
+          ],
+          entityRanges: [],
+          data: {}
+        }
+      ],
+      entityMap: {}
+    }),
+    slug: 'slug-slug-slug'
+  },
+  message: { message: 'Published' },
+  getPublished: jest.fn()
+};
+describe('<PublishedArticlesComponent />', () => {
+  const component = shallow(<PublishedArticlesComponent {...props} />);
+  it('should render a <PublishedArticlesComponent /> component ', () => {
+    const component = mount(<Provider store={store}>
+        <MemoryRouter>
+          <PublishedArticlesComponent {...props} />
+        </MemoryRouter>
+      </Provider>);
+  });
+  it('should trigger publish ', () => {
+    component.setProps({ article: state.article });
+  });
+});

src/__tests__/components/Profile/MyArticles/__snapshots__/Published.test.js.snap

@@ -0,0 +1,3 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<PublishedArticlesComponent /> should render a <PublishedArticlesComponent /> component  1`] = `ShallowWrapper {}`;

src/__tests__/components/Routes.test.js

@@ -16,6 +16,7 @@ import Article from '../../components/Articles/Article/Article';
 import CreateArticle from '../../components/Profile/Articles/CreateArticle';
 import EditArticle from '../../components/Profile/Articles/EditArticle';
 import PreviewArticle from '../../components/Profile/Articles/PreviewArticle';
+import PublishedArticles from '../../components/Profile/Articles/MyArticles/Published';
 
 describe('<Routes />', () => {
   test('renders <Home /> without crashing', () => {
@@ -147,4 +148,12 @@ describe('<Routes />', () => {
       </Provider>);
     expect(component.find(PreviewArticle).length).toBe(1);
   });
+  test('renders <PublishedArticles/> without crashing', () => {
+    const component = mount(<Provider store={store}>
+        <MemoryRouter initialEntries={['/profile/articles']}>
+          <Routes />
+        </MemoryRouter>
+      </Provider>);
+    expect(component.find(PublishedArticles).length).toBe(1);
+  });
 });

src/__tests__/reducers/articlesReducers.test.js

@@ -130,7 +130,27 @@ describe('Articles reducers', () => {
     });
     expect(reducer.errors).toBeInstanceOf(Object);
   });
-
+  it('FETCH_MY_PUBLISHED_ARTICLES_START', () => {
+    const reducer = articlesReducer(initialState, {
+      type: articlesType.FETCH_MY_PUBLISHED_ARTICLES_START,
+      payload: []
+    });
+    expect(reducer.errors).toBeInstanceOf(Object);
+  });
+  it('FETCH_MY_PUBLISHED_ARTICLES_SUCCESS', () => {
+    const reducer = articlesReducer(initialState, {
+      type: articlesType.FETCH_MY_PUBLISHED_ARTICLES_SUCCESS,
+      payload: { articles }
+    });
+    expect(reducer.articles).toBeInstanceOf(Array);
+  });
+  it('FETCH_MY_PUBLISHED_ARTICLES_FAILURE', () => {
+    const reducer = articlesReducer(initialState, {
+      type: articlesType.FETCH_MY_PUBLISHED_ARTICLES_FAILURE,
+      payload: { errors }
+    });
+    expect(reducer.errors).toBeInstanceOf(Object);
+  });
   it('DEFAULT', () => {
     articlesReducer(initialState, {
       type: null,

src/__tests__/reducers/rating/ratingReducers.test.js

@@ -0,0 +1,42 @@
+import createRatingReducer from '../../../reducers/rating/createRatingReducer';
+import initialState from '../../../store/initialStates/ratingInitialState';
+import { ratingActionsTypes } from '../../../actions-types';
+// import articles from '../../__mocks__/articles';
+// import article from '../../__mocks__/article';
+// import message from '../../__mocks__/articleMessage';
+// import errors from '../../__mocks__/errors';
+
+const rating = {
+  slug: 'slug-slug',
+  rating: 1
+};
+
+describe('Rating reducers', () => {
+  it('CREATE_RATING_START', () => {
+    const reducer = createRatingReducer(initialState, {
+      type: ratingActionsTypes.CREATE_RATING_START,
+      payload: {}
+    });
+    expect(reducer.createRate).toBeInstanceOf(Object);
+  });
+  it('CREATE_RATING_SUCCESS', () => {
+    const reducer = createRatingReducer(initialState, {
+      type: ratingActionsTypes.CREATE_RATING_SUCCESS,
+      payload: { rating }
+    });
+    expect(reducer.createRate).toHaveProperty('errors');
+  });
+  it('CREATE_RATING_FAILURE', () => {
+    const reducer = createRatingReducer(initialState, {
+      type: ratingActionsTypes.CREATE_RATING_FAILURE,
+      payload: {}
+    });
+    expect(reducer.createRate).toHaveProperty('errors');
+  });
+  it('DEFAULT', () => {
+    createRatingReducer(initialState, {
+      type: null,
+      payload: null
+    });
+  });
+});

src/actions-types/articlesActionTypes.js

@@ -32,3 +32,8 @@ export const PUBLISH_ARTICLE_START = 'PUBLISH_ARTICLE_START';
 export const PUBLISH_ARTICLE_END = 'PUBLISH_ARTICLE_END';
 export const PUBLISH_ARTICLE_SUCCESS = 'PUBLISH_ARTICLE_SUCCESS';
 export const PUBLISH_ARTICLE_FAILURE = 'PUBLISH_ARTICLE_FAILURE';
+
+export const FETCH_MY_PUBLISHED_ARTICLES_START = 'FETCH_MY_ARTICLES_START';
+export const FETCH_MY_PUBLISHED_ARTICLES_END = 'FETCH_MY_ARTICLES_END';
+export const FETCH_MY_PUBLISHED_ARTICLES_SUCCESS = 'FETCH_MY_ARTICLES_SUCCESS';
+export const FETCH_MY_PUBLISHED_ARTICLES_FAILURE = 'FETCH_MY_ARTICLES_FAILURE';

src/actions-types/index.js

@@ -3,6 +3,13 @@ import * as apiActionsTypes from './apiActionsTypes';
 import * as notificationActionTypes from './notificationActionTypes';
 import * as articlesType from './articlesActionTypes';
 import * as imagesTypes from './imagesActionTypes';
+import * as ratingActionsTypes from './ratingActionsTypes';
 
-export { articlesType, imagesTypes };
-export { apiActionsTypes, userActionsTypes, notificationActionTypes };
+export {
+  articlesType,
+  imagesTypes,
+  apiActionsTypes,
+  userActionsTypes,
+  notificationActionTypes,
+  ratingActionsTypes
+};

src/actions-types/ratingActionsTypes.js

@@ -0,0 +1,4 @@
+export const CREATE_RATING_START = 'CREATE_RATING_START';
+export const CREATE_RATING_END = 'CREATE_RATING_END';
+export const CREATE_RATING_SUCCESS = 'CREATE_RATING_SUCCESS';
+export const CREATE_RATING_FAILURE = 'CREATE_RATING_FAILURE';

src/actions/articles/getPublished.js

@@ -0,0 +1,11 @@
+import { articlesType } from '../../actions-types';
+import { apiAction } from '../../helpers';
+
+export const getPublished = () => dispatch => dispatch(apiAction({
+  method: 'get',
+  url: '/articles/published',
+  onStart: articlesType.FETCH_MY_PUBLISHED_ARTICLES_START,
+  onEnd: articlesType.FETCH_MY_PUBLISHED_ARTICLES_END,
+  onSuccess: articlesType.FETCH_MY_PUBLISHED_ARTICLES_SUCCESS,
+  onFailure: articlesType.FETCH_MY_PUBLISHED_ARTICLES_FAILURE
+}));

src/actions/articles/index.js

@@ -5,6 +5,7 @@ import { getAllArticles } from './getAllArticles';
 import { deleteArticle } from './deleteArticle';
 import { publishArticle } from './publishArticle';
 import { unpublishArticle } from './unpublishArticle';
+import { getPublished } from './getPublished';
 
 export {
   createPost,
@@ -13,5 +14,6 @@ export {
   publishArticle,
   unpublishArticle,
   getAllArticles,
-  fetchOneArticle
+  fetchOneArticle,
+  getPublished
 };

src/actions/index.js

@@ -7,8 +7,10 @@ import {
   editPost,
   deleteArticle,
   publishArticle,
-  unpublishArticle
+  unpublishArticle,
+  getPublished
 } from './articles';
+import { createRate } from './rating';
 import { uploadImage } from './images';
 
 export {
@@ -21,5 +23,7 @@ export {
   deleteArticle,
   publishArticle,
   unpublishArticle,
-  uploadImage
+  uploadImage,
+  getPublished,
+  createRate
 };

src/actions/rating/createRate.js

@@ -0,0 +1,12 @@
+import { ratingActionsTypes } from '../../actions-types';
+import { apiAction } from '../../helpers';
+
+export const createRate = (slug, rating) => dispatch => dispatch(apiAction({
+  data: { rating },
+  method: 'post',
+  url: `/rating/${slug}/article`,
+  onStart: ratingActionsTypes.CREATE_RATING_START,
+  onEnd: ratingActionsTypes.CREATE_RATING_END,
+  onSuccess: ratingActionsTypes.CREATE_RATING_SUCCESS,
+  onFailure: ratingActionsTypes.CREATE_RATING_FAILURE
+}));

src/actions/rating/index.js

@@ -0,0 +1,3 @@
+import { createRate } from './createRate';
+
+export { createRate };

src/assets/css/_border.scss

@@ -2,7 +2,6 @@
 .border {
   border: 1px solid;
 }
-
 .b-light {
   border-color: $light;
 }
@@ -29,6 +28,12 @@
 .b-primary {
   border-color: $primary;
 }
+.b-danger {
+  border-color: $danger;
+}
+.b-light-grey {
+  border-color: $light-grey;
+}
 .b-bottom-light-grey {
   border-bottom: 1px solid $light-grey;
 }

src/assets/css/_colors.scss

@@ -7,8 +7,7 @@ $secondary: #1843b8;
 $danger: #d64c4c;
 $success: #1c8a4a;
 $info: #1cbdee;
-$light-grey: #ccc;
-$light-grey: #e6e6e6;
+$light-grey: #cbcbcb;
 $yellow: #f9d342;
 /* background anim colors */
 $anim-palette-1: #ffb426;
@@ -47,6 +46,9 @@ $twitter-color: #50abf1;
 .light-grey {
   background: $light-grey;
 }
+.text-light-grey {
+  color: $light-grey;
+}
 .text-grey {
   color: $grey;
 }