@coorpacademy/app-review 0.1.16 → 0.1.18

package/src/reducers/data/slides.ts

@@ -1,5 +1,4 @@
 import set from 'lodash/fp/set';
-import {ValidateSlide} from '../../actions/ui/slides';
 import {
   ReceivedSlide,
   FetchSlide,
@@ -8,9 +7,9 @@ import {
 } from '../../actions/api/fetch-slide';
 import {SlideFromAPI} from '../../types/common';
 
-export type SlidesAction = FetchSlide | ReceivedSlide | ValidateSlide;
+export type SlidesAction = FetchSlide | ReceivedSlide;
 
-export type SlidesState = Record<string, SlideFromAPI>;
+export type SlidesState = Record<string, SlideFromAPI | null>;
 export const initialState: SlidesState = {};
 
 // eslint-disable-next-line default-param-last

package/src/reducers/data/test/progression.test.ts

@@ -1,42 +1,26 @@
 import test from 'ava';
 import reducer from '../progression';
-import {POST_PROGRESSION_SUCCESS, ReceiveProgression} from '../../../actions/api/post-progression';
-import {ProgressionFromAPI} from '../../../types/common';
+import {POST_PROGRESSION_SUCCESS, ReceivedProgression} from '../../../actions/api/post-progression';
+import {POST_ANSWER_SUCCESS} from '../../../actions/api/post-answer';
+import {postAnswerResponse, postProgressionResponse} from '../../../test/util/services.mock';
 
-test('should have inital value', t => {
-  const state = reducer(undefined, {} as ReceiveProgression);
+test('should have initial value', t => {
+  const state = reducer(undefined, {} as ReceivedProgression);
   t.is(state, null);
 });
 
 test('should set the value of POST_PROGRESSION_SUCCESS action', t => {
-  const progression: ProgressionFromAPI = {
-    _id: '62b1d1087aa12f00253f40ee',
-    content: {
-      ref: '_skill-ref',
-      type: 'skill'
-    },
-    engine: {
-      ref: 'review'
-    },
-    state: {
-      allAnswers: [],
-      isCorrect: true,
-      nextContent: {
-        ref: 'sli_N1XACJobn',
-        type: 'slide'
-      },
-      pendingSlides: [],
-      slides: [],
-      step: {
-        current: 1
-      },
-      stars: 0
-    }
-  };
-
   const state = reducer(null, {
     type: POST_PROGRESSION_SUCCESS,
-    payload: progression
+    payload: postProgressionResponse
+  });
+  t.deepEqual(state, postProgressionResponse);
+});
+
+test('should set the value of POST_ANSWER_SUCCESS action', t => {
+  const state = reducer(null, {
+    type: POST_ANSWER_SUCCESS,
+    payload: postAnswerResponse
   });
-  t.deepEqual(state, progression);
+  t.deepEqual(state, postAnswerResponse);
 });

package/src/reducers/ui/answers.ts

@@ -1,19 +1,15 @@
-import {EditBasicAction, EDIT_BASIC} from '../../actions/ui/answers';
+import {includes, values} from 'lodash/fp';
+import {EditAnswerAction, ANSWER_EDIT} from '../../actions/ui/answers';
 
 export type AnswerState = string[];
+const ANSWER_EDIT_ACTIONS = values(ANSWER_EDIT);
 
 const reducer = (
   // eslint-disable-next-line default-param-last
   state: AnswerState = [],
-  action: EditBasicAction
+  action: EditAnswerAction
 ): AnswerState => {
-  switch (action.type) {
-    case EDIT_BASIC: {
-      return action.payload;
-    }
-    default:
-      return state;
-  }
+  return includes(action.type, ANSWER_EDIT_ACTIONS) ? action.payload : state;
 };
 
 export default reducer;

package/src/reducers/ui/index.ts

@@ -3,15 +3,18 @@ import {combineReducers} from 'redux';
 import currentSlideRef, {CurrentSlideRefState} from './current-slide-ref';
 import navigation, {NavigationState} from './navigation';
 import answers, {AnswerState} from './answers';
+import slide, {UISlideState} from './slide';
 
 export type UIState = {
   currentSlideRef: CurrentSlideRefState;
   navigation: NavigationState;
   answers: AnswerState;
+  slide: UISlideState;
 };
 
 export default combineReducers({
   currentSlideRef,
   navigation,
-  answers
+  answers,
+  slide
 });

package/src/reducers/ui/slide.ts

@@ -0,0 +1,43 @@
+import compact from 'lodash/fp/compact';
+import isEmpty from 'lodash/fp/isEmpty';
+import pipe from 'lodash/fp/pipe';
+import {
+  EditAnswerAction,
+  EDIT_BASIC,
+  EDIT_QCM,
+  EDIT_QCM_DRAG,
+  EDIT_QCM_GRAPHIC,
+  EDIT_SLIDER,
+  EDIT_TEMPLATE
+} from '../../actions/ui/answers';
+import {PostAnswerRequestAction, POST_ANSWER_REQUEST} from '../../actions/api/post-answer';
+
+export type UISlideState = {
+  validateButton: boolean;
+};
+
+export const initialState: UISlideState = {validateButton: false};
+
+const reducer = (
+  // eslint-disable-next-line default-param-last
+  state: UISlideState = initialState,
+  action: PostAnswerRequestAction | EditAnswerAction
+): UISlideState => {
+  switch (action.type) {
+    case EDIT_QCM:
+    case EDIT_QCM_GRAPHIC:
+    case EDIT_QCM_DRAG:
+    case EDIT_TEMPLATE:
+    case EDIT_BASIC:
+    case EDIT_SLIDER: {
+      return pipe(compact, isEmpty)(action.payload) ? initialState : {validateButton: true};
+    }
+    case POST_ANSWER_REQUEST: {
+      return initialState;
+    }
+    default:
+      return state;
+  }
+};
+
+export default reducer;

package/src/reducers/ui/test/answers.test.ts

@@ -1,13 +1,38 @@
 import test from 'ava';
 import reducer from '../answers';
-import {EditBasicAction, EDIT_BASIC} from '../../../actions/ui/answers';
+import {EditAnswerAction, ANSWER_EDIT} from '../../../actions/ui/answers';
 
-test('should have inital value', t => {
-  const state = reducer(undefined, {} as EditBasicAction);
+test('should have initial value', t => {
+  const state = reducer(undefined, {} as EditAnswerAction);
   t.deepEqual(state, []);
 });
 
 test('should set the value of EDIT_BASIC action', t => {
-  const state = reducer([], {type: EDIT_BASIC, payload: ['value']});
+  const state = reducer([], {type: ANSWER_EDIT.basic, payload: ['value']});
   t.deepEqual(state, ['value']);
 });
+
+test('should set the value of EDIT_QCM action', t => {
+  const state = reducer([], {type: ANSWER_EDIT.qcm, payload: ['value1', 'value2']});
+  t.deepEqual(state, ['value1', 'value2']);
+});
+
+test('should set the value of EDIT_QCM_GRAPHIC action', t => {
+  const state = reducer([], {type: ANSWER_EDIT.qcmGraphic, payload: ['True', 'False']});
+  t.deepEqual(state, ['True', 'False']);
+});
+
+test('should set the value of EDIT_QCM_DRAG action', t => {
+  const state = reducer([], {type: ANSWER_EDIT.qcmDrag, payload: ['value1', 'value2']});
+  t.deepEqual(state, ['value1', 'value2']);
+});
+
+test('should set the value of EDIT_SLIDER action', t => {
+  const state = reducer([], {type: ANSWER_EDIT.slider, payload: ['5']});
+  t.deepEqual(state, ['5']);
+});
+
+test('should set the value of EDIT_TEMPLATE action', t => {
+  const state = reducer([], {type: ANSWER_EDIT.template, payload: ['value1', 'value2']});
+  t.deepEqual(state, ['value1', 'value2']);
+});

package/src/reducers/ui/test/current-slide-ref.test.ts

@@ -3,7 +3,7 @@ import reducer from '../current-slide-ref';
 import {SetCurrentSlide, SET_CURRENT_SLIDE} from '../../../actions/ui/slides';
 import {freeTextSlide} from '../../../views/slides/test/fixtures/free-text';
 
-test('should have inital value', t => {
+test('should have initial value', t => {
   const state = reducer(undefined, {} as SetCurrentSlide);
   t.is(state, '');
 });

package/src/reducers/ui/test/navigation.test.ts

@@ -1,19 +1,19 @@
 import test from 'ava';
 import reducer from '../navigation';
-import {NavigateTo, NAVIGATE_TO, NAVIGATE_BACK} from '../../../actions/ui/navigation';
+import {NavigateTo, navigateBack, navigateTo} from '../../../actions/ui/navigation';
 
-test('should have inital value', t => {
+test('should have initial value', t => {
   const state = reducer(undefined, {} as NavigateTo);
   t.deepEqual(state, []);
 });
 
 test('should set the value of NAVIGATE_TO and NAVIGATE_BACK action', t => {
-  const state = reducer([], {type: NAVIGATE_TO, payload: 'loader'});
+  const state = reducer([], navigateTo('loader'));
   t.deepEqual(state, ['loader']);
 
-  const updatedState = reducer(state, {type: NAVIGATE_TO, payload: 'skills'});
+  const updatedState = reducer(state, navigateTo('skills'));
   t.deepEqual(updatedState, ['loader', 'skills']);
 
-  const _updatedState = reducer(updatedState, {type: NAVIGATE_BACK});
+  const _updatedState = reducer(updatedState, navigateBack());
   t.deepEqual(_updatedState, ['loader']);
 });

package/src/reducers/ui/test/slide.test.ts

@@ -0,0 +1,15 @@
+import test from 'ava';
+import reducer, {initialState} from '../slide';
+import {EDIT_BASIC} from '../../../actions/ui/answers';
+import {PostAnswerRequestAction} from '../../../actions/api/post-answer';
+
+test('should use initial state if no answers are found when an EditAnswerAction is received', t => {
+  const state = reducer(undefined, {type: EDIT_BASIC, payload: ['']});
+  t.truthy(state);
+  t.false(state.validateButton);
+});
+
+test('should return state directly when there is no corresponding action handler + have an initial state', t => {
+  const state = reducer(undefined, {type: 'NOPE'} as unknown as PostAnswerRequestAction);
+  t.deepEqual(state, initialState);
+});

package/src/test/util/services.mock.ts

@@ -1,82 +1,103 @@
+import {qcmSlide} from '../../views/slides/test/fixtures/qcm';
+import {qcmGraphicSlide} from '../../views/slides/test/fixtures/qcm-graphic';
 import {freeTextSlide} from '../../views/slides/test/fixtures/free-text';
-import {Services} from '../../types/common';
+import {sliderSlide} from '../../views/slides/test/fixtures/slider';
+import {templateSlide} from '../../views/slides/test/fixtures/template';
+import {ProgressionFromAPI, Services, SlideFromAPI} from '../../types/common';
 
-export const services: Services = {
-  fetchSkills: () => {
-    return Promise.resolve([
-      {
-        skillRef: '_skill-ref',
-        slidesToReview: 2,
-        name: 'skill-test',
-        custom: false
-      },
-      {
-        skillRef: '_skill-ref-2',
-        slidesToReview: 2,
-        name: 'skill-test-2',
-        custom: true
-      }
-    ]);
+const getSlideFixture = (ref: string): SlideFromAPI => {
+  switch (ref) {
+    case qcmSlide.universalRef:
+      return qcmSlide;
+    case qcmGraphicSlide.universalRef:
+      return qcmGraphicSlide;
+    case freeTextSlide.universalRef:
+      return freeTextSlide;
+    case templateSlide.universalRef:
+      return templateSlide;
+    default:
+      return sliderSlide;
+  }
+};
+
+const fetchSkillsResponse = [
+  {
+    skillRef: '_skill-ref',
+    slidesToReview: 2,
+    name: 'skill-test',
+    custom: false
   },
-  fetchSlide: ref => {
-    return Promise.resolve({...freeTextSlide, universalRef: ref, id: ref});
+  {
+    skillRef: '_skill-ref-2',
+    slidesToReview: 2,
+    name: 'skill-test-2',
+    custom: true
+  }
+];
+
+export const postProgressionResponse: ProgressionFromAPI = {
+  _id: '62b1d1087aa12f00253f40ee',
+  content: {
+    ref: '_skill-ref',
+    type: 'skill'
   },
-  postProgression: () => {
-    return Promise.resolve({
-      _id: '62b1d1087aa12f00253f40ee',
-      content: {
-        ref: '_skill-ref',
-        type: 'skill'
-      },
-      engine: {
-        ref: 'review'
-      },
-      state: {
-        allAnswers: [],
-        isCorrect: true,
-        nextContent: {
-          ref: 'sli_N1XACJobn',
-          type: 'slide'
-        },
-        pendingSlides: [],
-        slides: [],
-        step: {
-          current: 1
-        },
-        stars: 0
-      }
-    });
+  engine: {
+    ref: 'review'
+  },
+  state: {
+    allAnswers: [],
+    isCorrect: true,
+    nextContent: {
+      ref: 'sli_VJYjJnJhg',
+      type: 'slide'
+    },
+    pendingSlides: [],
+    slides: [],
+    step: {
+      current: 1
+    },
+    stars: 0
+  }
+};
+
+export const postAnswerResponse: ProgressionFromAPI = {
+  _id: '62b1d1087aa12f00253f40ee',
+  content: {
+    ref: '_skill-ref',
+    type: 'skill'
   },
-  postAnswer: () => {
-    return Promise.resolve({
-      _id: '62b1d1087aa12f00253f40ee',
-      content: {
-        ref: '_skill-ref',
-        type: 'skill'
-      },
-      engine: {
-        ref: 'review'
-      },
-      state: {
-        allAnswers: [
-          {
-            slideRef: 'sli_N1XACJobn',
-            isCorrect: true,
-            answer: ['Le créateur peut fixer un pourcentage pour chaque transaction future']
-          }
-        ],
+  engine: {
+    ref: 'review'
+  },
+  state: {
+    allAnswers: [
+      {
+        slideRef: 'sli_VJYjJnJhg',
         isCorrect: true,
-        nextContent: {
-          ref: 'sli_VkSQroQnx',
-          type: 'slide'
-        },
-        pendingSlides: [],
-        slides: ['sli_N1XACJobn'],
-        step: {
-          current: 2
-        },
-        stars: 4
+        answer: ['Benchmark']
       }
-    });
+    ],
+    isCorrect: true,
+    nextContent: {
+      ref: 'sli_VkSQroQnx',
+      type: 'slide'
+    },
+    content: {
+      ref: 'sli_VJYjJnJhg',
+      type: 'slide'
+    },
+    pendingSlides: [],
+    slides: ['sli_VJYjJnJhg'],
+    step: {
+      current: 2
+    },
+    stars: 4
   }
 };
+
+export const services: Services = {
+  fetchSkills: () => Promise.resolve(fetchSkillsResponse),
+  fetchSlide: ref => Promise.resolve({...getSlideFixture(ref), universalRef: ref, id: ref}),
+  postProgression: () => Promise.resolve(postProgressionResponse),
+  postAnswer: () => Promise.resolve(postAnswerResponse)
+};

package/src/types/common.ts

@@ -1,6 +1,3 @@
-import {SlideIndexes} from '../common';
-import {AnswerUI} from './slides';
-
 // TODO use type from components
 type TemplateContextValues = {
   brandTheme?: unknown;
@@ -172,33 +169,6 @@ export type JWT = {
   host: string;
 };
 
-type SlideUIAnimations = 'unstack' | 'restack';
-
-export type NextUISlide = {
-  questionText?: string;
-  answerUI?: AnswerUI;
-  hidden?: boolean;
-  position?: number;
-  animationType?: SlideUIAnimations;
-  isCorrect?: boolean;
-  endReview?: boolean;
-};
-
-export type UISlide = {
-  questionText?: string;
-  answerUI?: AnswerUI;
-  hidden?: boolean;
-  position: number;
-  animationType?: SlideUIAnimations;
-  isCorrect?: boolean;
-  endReview?: boolean;
-  nextContent?: NextUISlide;
-};
-
-export type FinishedSlides = {
-  [key in SlideIndexes]?: true;
-};
-
 export type WithRequired<T, K extends keyof T> = T & {
   // the "-" is a Mapping Modifier, removes optionality from a prop
   [P in K]-?: T[P];

package/src/views/skills/index.ts

@@ -28,11 +28,7 @@ type SkillsProps = NoSkillsProps & {
 
 export {SkillsProps};
 
-export const mapStateToSkillsProps = (state: StoreState): SkillsProps | null => {
-  if (!state.data.skills) {
-    return null;
-  }
-
+export const mapStateToSkillsProps = (state: StoreState): SkillsProps => {
   return {
     title: '@todo title',
     titleNoSkills: '@todo titleNoSkills',

package/src/views/skills/test/skills.test.ts

@@ -0,0 +1,101 @@
+import test from 'ava';
+import map from 'lodash/fp/map';
+import omit from 'lodash/fp/omit';
+import {StoreState} from '../../../reducers';
+import {mapStateToSkillsProps} from '..';
+
+test('should create initial props when there are no skills on the state', t => {
+  const state: StoreState = {
+    data: {
+      progression: null,
+      skills: [],
+      slides: {},
+      token: '1234'
+    },
+    ui: {
+      currentSlideRef: '',
+      navigation: ['loader', 'skills'],
+      answers: [],
+      slide: {
+        validateButton: false
+      }
+    }
+  };
+
+  const props = mapStateToSkillsProps(state);
+
+  t.deepEqual(props, {
+    title: '@todo title',
+    titleNoSkills: '@todo titleNoSkills',
+    textNoSkills: '@todo textNoSkills',
+    iconSkillAriaLabel: '@todo iconSkillAriaLabel',
+    isLoading: false,
+    isLoadingAriaLabel: '@todo loading',
+    listSkills: []
+  });
+});
+
+test('should create initial props when skills on the state', t => {
+  const state: StoreState = {
+    data: {
+      progression: null,
+      skills: [
+        {
+          skillRef: '_skill-ref',
+          slidesToReview: 2,
+          name: 'skill-test',
+          custom: false
+        },
+        {
+          skillRef: '_skill-ref-2',
+          slidesToReview: 5,
+          name: 'skill-test-2',
+          custom: true
+        }
+      ],
+      slides: {},
+      token: '1234'
+    },
+    ui: {
+      currentSlideRef: '',
+      navigation: ['loader', 'skills'],
+      answers: [],
+      slide: {
+        validateButton: false
+      }
+    }
+  };
+
+  const props = mapStateToSkillsProps(state);
+
+  t.deepEqual(omit('listSkills', props), {
+    title: '@todo title',
+    titleNoSkills: '@todo titleNoSkills',
+    textNoSkills: '@todo textNoSkills',
+    iconSkillAriaLabel: '@todo iconSkillAriaLabel',
+    isLoading: false,
+    isLoadingAriaLabel: '@todo loading'
+  });
+  t.deepEqual(map(omit('onClick'), props.listSkills), [
+    {
+      'aria-label': '',
+      isCustom: false,
+      skillTitle: 'skill-test',
+      skillAriaLabel: '@todo skill aria label',
+      buttonLabel: '@todo button',
+      buttonAriaLabel: '@todo button aria label',
+      reviseLabel: '@todo revise',
+      reviseAriaLabel: '@todo revise aria label'
+    },
+    {
+      'aria-label': '',
+      isCustom: true,
+      skillTitle: 'skill-test-2',
+      skillAriaLabel: '@todo skill aria label',
+      buttonLabel: '@todo button',
+      buttonAriaLabel: '@todo button aria label',
+      reviseLabel: '@todo revise',
+      reviseAriaLabel: '@todo revise aria label'
+    }
+  ]);
+});