@coorpacademy/app-review 0.1.13 → 0.1.15

package/lib/helpers/test/fixtures/qcm-drag.d.ts

@@ -1,4 +1,3 @@
-import { QcmDrag } from '../../../types/slides';
-import { SlideFromAPI } from '../../../types/common';
+import { SlideFromAPI, UISlide } from '../../../types/common';
 export declare const qcmDragSlide: SlideFromAPI;
-export declare const qcmDragUISlide: QcmDrag;
+export declare const qcmDragUISlide: Partial<UISlide>;

package/lib/helpers/test/fixtures/qcm-drag.js

@@ -70,37 +70,43 @@ export var qcmDragSlide = {
     tips: 'sli_419IlQQnf.tips'
 };
 export var qcmDragUISlide = {
-    type: 'qcmDrag',
-    answers: [
-        {
-            title: 'sli_419IlQQnf.choice_4kWwlQXhG',
-            selected: false,
-            order: -1,
-            onClick: noop
-        },
-        {
-            title: 'sli_419IlQQnf.choice_NJxbwgXm2G',
-            selected: false,
-            order: -1,
-            onClick: noop
-        },
-        {
-            title: 'sli_419IlQQnf.choice_41fwgQXnf',
-            selected: false,
-            order: -1,
-            onClick: noop
-        },
-        {
-            title: 'sli_419IlQQnf.choice_VJmweQ7nz',
-            selected: false,
-            order: -1,
-            onClick: noop
-        },
-        {
-            title: 'sli_419IlQQnf.choice_4kDDgXQhz',
-            selected: false,
-            order: -1,
-            onClick: noop
+    questionText: 'sli_419IlQQnf.header',
+    answerUI: {
+        help: 'sli_419IlQQnf.explanation',
+        model: {
+            type: 'qcmDrag',
+            answers: [
+                {
+                    title: 'sli_419IlQQnf.choice_4kWwlQXhG',
+                    selected: false,
+                    order: -1,
+                    onClick: noop
+                },
+                {
+                    title: 'sli_419IlQQnf.choice_NJxbwgXm2G',
+                    selected: false,
+                    order: -1,
+                    onClick: noop
+                },
+                {
+                    title: 'sli_419IlQQnf.choice_41fwgQXnf',
+                    selected: false,
+                    order: -1,
+                    onClick: noop
+                },
+                {
+                    title: 'sli_419IlQQnf.choice_VJmweQ7nz',
+                    selected: false,
+                    order: -1,
+                    onClick: noop
+                },
+                {
+                    title: 'sli_419IlQQnf.choice_4kDDgXQhz',
+                    selected: false,
+                    order: -1,
+                    onClick: noop
+                }
+            ]
         }
-    ]
+    }
 };

package/lib/helpers/test/fixtures/qcm-graphic.d.ts

@@ -1,4 +1,3 @@
-import { QcmGraphic } from '../../../types/slides';
-import { SlideFromAPI } from '../../../types/common';
+import { SlideFromAPI, UISlide } from '../../../types/common';
 export declare const qcmGraphicSlide: SlideFromAPI;
-export declare const qcmGraphicUISlide: QcmGraphic;
+export declare const qcmGraphicUISlide: Partial<UISlide>;

package/lib/helpers/test/fixtures/qcm-graphic.js

@@ -52,19 +52,25 @@ export var qcmGraphicSlide = {
     tips: 'sli_41~RSVclH.tips'
 };
 export var qcmGraphicUISlide = {
-    type: 'qcmGraphic',
-    answers: [
-        {
-            title: 'sli_41~RSVclH.choice_V1gN0r4qgS',
-            image: 'med_4JVRrE5gH.mediaUrl_VkBtUV9gB',
-            selected: false,
-            onClick: noop
-        },
-        {
-            title: 'sli_41~RSVclH.choice_4JlLeLE5lS',
-            image: 'med_Ek8gIEqxB.mediaUrl_EkcFUEclH',
-            selected: false,
-            onClick: noop
+    questionText: 'sli_41~RSVclH.header',
+    answerUI: {
+        help: 'sli_41~RSVclH.explanation',
+        model: {
+            type: 'qcmGraphic',
+            answers: [
+                {
+                    title: 'sli_41~RSVclH.choice_V1gN0r4qgS',
+                    image: 'med_4JVRrE5gH.mediaUrl_VkBtUV9gB',
+                    selected: false,
+                    onClick: noop
+                },
+                {
+                    title: 'sli_41~RSVclH.choice_4JlLeLE5lS',
+                    image: 'med_Ek8gIEqxB.mediaUrl_EkcFUEclH',
+                    selected: false,
+                    onClick: noop
+                }
+            ]
         }
-    ]
+    }
 };

package/lib/helpers/test/fixtures/qcm.d.ts

@@ -1,4 +1,3 @@
-import { Qcm } from '../../../types/slides';
-import { SlideFromAPI } from '../../../types/common';
+import { SlideFromAPI, UISlide } from '../../../types/common';
 export declare const qcmSlide: SlideFromAPI;
-export declare const qcmUISlide: Qcm;
+export declare const qcmUISlide: Partial<UISlide>;

package/lib/helpers/test/fixtures/qcm.js

@@ -69,31 +69,37 @@ export var qcmSlide = {
     id: 'sli_N1XACJobn'
 };
 export var qcmUISlide = {
-    type: 'qcm',
-    answers: [
-        {
-            title: 'Le créateur peut fixer un pourcentage pour chaque transaction future',
-            selected: false,
-            onClick: noop,
-            ariaLabel: 'Le créateur peut fixer un pourcentage pour chaque transaction future'
-        },
-        {
-            title: "Pour chaque transaction il existe un pourcentage fixe déterminé par le droit d'auteur du pays où se tient la vente",
-            selected: false,
-            onClick: noop,
-            ariaLabel: "Pour chaque transaction il existe un pourcentage fixe déterminé par le droit d'auteur du pays où se tient la vente"
-        },
-        {
-            title: "Seule la galerie ou la plateforme peut toucher une commission sur la vente d'un NFT",
-            selected: false,
-            onClick: noop,
-            ariaLabel: "Seule la galerie ou la plateforme peut toucher une commission sur la vente d'un NFT"
-        },
-        {
-            title: "Les NFT payés en ETH ne peuvent pas être soumis au paiement d'une commission",
-            selected: false,
-            onClick: noop,
-            ariaLabel: "Les NFT payés en ETH ne peuvent pas être soumis au paiement d'une commission"
+    questionText: "Après la vente d'un NFT, son créateur peut-il toucher de l'argent ?",
+    answerUI: {
+        help: 'Sélectionnez la bonne réponse.',
+        model: {
+            type: 'qcm',
+            answers: [
+                {
+                    title: 'Le créateur peut fixer un pourcentage pour chaque transaction future',
+                    selected: false,
+                    onClick: noop,
+                    ariaLabel: 'Le créateur peut fixer un pourcentage pour chaque transaction future'
+                },
+                {
+                    title: "Pour chaque transaction il existe un pourcentage fixe déterminé par le droit d'auteur du pays où se tient la vente",
+                    selected: false,
+                    onClick: noop,
+                    ariaLabel: "Pour chaque transaction il existe un pourcentage fixe déterminé par le droit d'auteur du pays où se tient la vente"
+                },
+                {
+                    title: "Seule la galerie ou la plateforme peut toucher une commission sur la vente d'un NFT",
+                    selected: false,
+                    onClick: noop,
+                    ariaLabel: "Seule la galerie ou la plateforme peut toucher une commission sur la vente d'un NFT"
+                },
+                {
+                    title: "Les NFT payés en ETH ne peuvent pas être soumis au paiement d'une commission",
+                    selected: false,
+                    onClick: noop,
+                    ariaLabel: "Les NFT payés en ETH ne peuvent pas être soumis au paiement d'une commission"
+                }
+            ]
         }
-    ]
+    }
 };

package/lib/helpers/test/fixtures/select-template.d.ts

@@ -1,4 +1,3 @@
-import { Template } from '../../../types/slides';
-import { SlideFromAPI } from '../../../types/common';
+import { SlideFromAPI, UISlide } from '../../../types/common';
 export declare const selectTemplateSlide: SlideFromAPI;
-export declare const selectTemplateUISlide: Template;
+export declare const selectTemplateUISlide: Partial<UISlide>;

package/lib/helpers/test/fixtures/select-template.js

@@ -49,40 +49,46 @@ export var selectTemplateSlide = {
     tips: 'sli_410xZQxrZ.tips'
 };
 export var selectTemplateUISlide = {
-    type: 'template',
-    template: 'sli_410xZQxrZ.template',
-    answers: [
-        {
-            type: 'select',
-            name: 'sel36665',
-            onChange: noop,
-            options: [
-                { name: 'Select an answer', value: '', validOption: false, selected: true },
-                {
-                    name: 'sli_410xZQxrZ.choice_4yeA4Z7lr~',
-                    value: 'sli_410xZQxrZ.choice_4yeA4Z7lr~',
-                    validOption: true,
-                    selected: false
-                },
-                {
-                    name: 'sli_410xZQxrZ.choice_VJWCN~mgB~',
-                    value: 'sli_410xZQxrZ.choice_VJWCN~mgB~',
-                    validOption: true,
-                    selected: false
-                },
-                {
-                    name: 'sli_410xZQxrZ.choice_VkaH~XgBb',
-                    value: 'sli_410xZQxrZ.choice_VkaH~XgBb',
-                    validOption: true,
-                    selected: false
-                },
+    questionText: 'sli_410xZQxrZ.header',
+    answerUI: {
+        help: 'sli_410xZQxrZ.explanation',
+        model: {
+            type: 'template',
+            template: 'sli_410xZQxrZ.template',
+            answers: [
                 {
-                    name: 'sli_410xZQxrZ.choice_E1uUWXeBb',
-                    value: 'sli_410xZQxrZ.choice_E1uUWXeBb',
-                    validOption: true,
-                    selected: false
+                    type: 'select',
+                    name: 'sel36665',
+                    onChange: noop,
+                    options: [
+                        { name: 'Select an answer', value: '', validOption: false, selected: true },
+                        {
+                            name: 'sli_410xZQxrZ.choice_4yeA4Z7lr~',
+                            value: 'sli_410xZQxrZ.choice_4yeA4Z7lr~',
+                            validOption: true,
+                            selected: false
+                        },
+                        {
+                            name: 'sli_410xZQxrZ.choice_VJWCN~mgB~',
+                            value: 'sli_410xZQxrZ.choice_VJWCN~mgB~',
+                            validOption: true,
+                            selected: false
+                        },
+                        {
+                            name: 'sli_410xZQxrZ.choice_VkaH~XgBb',
+                            value: 'sli_410xZQxrZ.choice_VkaH~XgBb',
+                            validOption: true,
+                            selected: false
+                        },
+                        {
+                            name: 'sli_410xZQxrZ.choice_E1uUWXeBb',
+                            value: 'sli_410xZQxrZ.choice_E1uUWXeBb',
+                            validOption: true,
+                            selected: false
+                        }
+                    ]
                 }
             ]
         }
-    ]
+    }
 };

package/lib/helpers/test/fixtures/slider.d.ts

@@ -1,4 +1,3 @@
-import { QuestionRange } from '../../../types/slides';
-import { SlideFromAPI } from '../../../types/common';
+import { SlideFromAPI, UISlide } from '../../../types/common';
 export declare const sliderSlide: SlideFromAPI;
-export declare const sliderUISlide: QuestionRange;
+export declare const sliderUISlide: Partial<UISlide>;

package/lib/helpers/test/fixtures/slider.js

@@ -17,11 +17,17 @@ export var sliderSlide = {
     tips: 'sli_41D5AovN~.tips'
 };
 export var sliderUISlide = {
-    type: 'slider',
-    placeholder: 'sli_41D5AovN~.explanation',
-    minLabel: '1 undefined',
-    maxLabel: '10 undefined',
-    title: '0 sli_41D5AovN~.unitLabel',
-    value: -0.1111111111111111,
-    onChange: noop
+    questionText: 'sli_41D5AovN~.header',
+    answerUI: {
+        help: 'sli_41D5AovN~.explanation',
+        model: {
+            type: 'slider',
+            placeholder: 'sli_41D5AovN~.explanation',
+            minLabel: '1 undefined',
+            maxLabel: '10 undefined',
+            title: '0 sli_41D5AovN~.unitLabel',
+            value: -0.1111111111111111,
+            onChange: noop
+        }
+    }
 };

package/lib/helpers/test/fixtures/text-template.d.ts

@@ -1,4 +1,3 @@
-import { Template } from '../../../types/slides';
-import { SlideFromAPI } from '../../../types/common';
+import { SlideFromAPI, UISlide } from '../../../types/common';
 export declare const textTemplateSlide: SlideFromAPI;
-export declare const textTemplateUISlide: Template;
+export declare const textTemplateUISlide: Partial<UISlide>;

package/lib/helpers/test/fixtures/text-template.js

@@ -34,15 +34,21 @@ export var textTemplateSlide = {
     id: 'sli_VJKQonm2g'
 };
 export var textTemplateUISlide = {
-    type: 'template',
-    template: 'Un   {{inp58402}}   model.',
-    answers: [
-        {
-            type: 'text',
-            name: 'inp58402',
-            placeholder: 'Type here',
-            value: undefined,
-            onChange: noop
+    questionText: 'Comment le protégé doit-il percevoir son mentor ?',
+    answerUI: {
+        help: 'Saisissez votre réponse (en anglais).',
+        model: {
+            type: 'template',
+            template: 'Un   {{inp58402}}   model.',
+            answers: [
+                {
+                    type: 'text',
+                    name: 'inp58402',
+                    placeholder: 'Type here',
+                    value: undefined,
+                    onChange: noop
+                }
+            ]
         }
-    ]
+    }
 };

package/lib/index.js

@@ -5,82 +5,22 @@ import { TemplateContext } from '@coorpacademy/components/es/template/app-review
 import isEmpty from 'lodash/fp/isEmpty';
 import get from 'lodash/fp/get';
 import configureStore from './configure-store';
-import { congratsProps, correctionPopinProps } from './fixtures/temp-fixture';
-import { updateSlidesOnNext, updateSlidesOnValidation, validateSlide } from './actions/data/slides';
+import { validateSlide } from './actions/ui/slides';
 import { navigateTo, navigateBack } from './actions/ui/navigation';
 import { storeToken } from './actions/data/token';
-import { updateFinishedSlides } from './actions/ui/finished-slides';
-import { updateReviewStatus } from './actions/ui/review-status';
-import { updateStepItemsOnValidation, updateStepItemsOnNext } from './actions/ui/step-items';
 import { fetchSkills } from './actions/api/fetch-skills';
 import { postProgression } from './actions/api/post-progression';
 import { VIEWS } from './common';
+import { mapStateToSlidesProps } from './views/slides';
+import { mapStateToSkillsProps } from './views/skills';
 var mapDispatchToProps = {
     navigateTo: navigateTo,
     navigateBack: navigateBack,
-    validateSlide: validateSlide,
-    updateSlidesOnValidation: updateSlidesOnValidation,
-    updateSlidesOnNext: updateSlidesOnNext,
-    updateReviewStatus: updateReviewStatus,
-    updateStepItemsOnValidation: updateStepItemsOnValidation,
-    updateStepItemsOnNext: updateStepItemsOnNext,
-    updateFinishedSlides: updateFinishedSlides
+    validateSlide: validateSlide
 };
 var getCurrentViewName = function (storeState) {
     return storeState.ui.navigation[storeState.ui.navigation.length - 1];
 };
-var mapStateToSkillsProps = function (state) {
-    if (!state.data.skills) {
-        return null;
-    }
-    return {
-        title: '@todo title',
-        titleNoSkills: '@todo titleNoSkills',
-        textNoSkills: '@todo textNoSkills',
-        iconSkillAriaLabel: '@todo iconSkillAriaLabel',
-        isLoading: false,
-        isLoadingAriaLabel: '@todo loading',
-        listSkills: state.data.skills.map(function (skill) { return ({
-            'aria-label': '',
-            isCustom: skill.custom,
-            skillTitle: skill.name,
-            skillAriaLabel: '@todo skill aria label',
-            buttonLabel: '@todo button',
-            buttonAriaLabel: '@todo button aria label',
-            reviseLabel: '@todo revise',
-            reviseAriaLabel: '@todo revise aria label',
-            // eslint-disable-next-line no-console
-            onClick: function () { return console.log('@todo plug dispatcher select skill'); }
-        }); })
-    };
-};
-var mapStateToSlidesProps = function (state) {
-    if (!state.data.slides) {
-        return null;
-    }
-    return {
-        headerProps: {
-            mode: '__revision_mode',
-            skillName: '__agility',
-            onQuitClick: function () {
-                // eslint-disable-next-line no-console
-                console.log('onQuitClick');
-            },
-            'aria-label': 'aria-header-wrapper',
-            closeButtonAriaLabel: 'aria-close-button'
-        },
-        slides: state.data.slides,
-        validate: {
-            label: '__validate'
-        },
-        finishedSlides: state.ui.finishedSlides,
-        stepItems: state.ui.stepItems,
-        reviewStatus: state.ui.reviewStatus,
-        correctionPopinProps: correctionPopinProps,
-        congratsProps: congratsProps,
-        progression: state.data.progression
-    };
-};
 var mapStateToProps = function (state) {
     return {
         viewName: getCurrentViewName(state),
@@ -92,7 +32,7 @@ var App = connect(mapStateToProps, mapDispatchToProps)(AppReviewTemplate);
 var AppReview = function (_a) {
     var options = _a.options;
     var _b = useState(null), store = _b[0], setStore = _b[1];
-    var _c = useState(false), isSlideFetched = _c[0], setIsSlideFetched = _c[1];
+    var _c = useState(false), isProgressionCreated = _c[0], setIsProgressionCreated = _c[1];
     useEffect(function () {
         if (store)
             return;
@@ -100,14 +40,13 @@ var AppReview = function (_a) {
         setStore(newStore);
     }, [options, store]);
     useEffect(function () {
-        if (!store || isSlideFetched)
+        if (!store || isProgressionCreated)
             return;
         return store.subscribe(function () {
-            var isSlidePresent = !isEmpty(store.getState().data.slides[0].questionText);
-            return isSlidePresent && setIsSlideFetched(isSlidePresent);
-        }); // using the first slide questionText for now, should only check for a slide's presence
-        // when the refactor is done (slides will be feed one by one on api's side)
-    }, [isSlideFetched, options, store]);
+            var isProgressionPresent = !isEmpty(store.getState().data.progression);
+            return isProgressionPresent && setIsProgressionCreated(isProgressionPresent);
+        });
+    }, [isProgressionCreated, options, store]);
     useEffect(function () {
         var token = get('token', options);
         if (store === null || isEmpty(token))
@@ -119,8 +58,8 @@ var AppReview = function (_a) {
         if (store === null || isEmpty(token))
             return;
         var skillRef = get('skillRef', options);
-        // ThunkAction is not assignable to parameter of type 'AnyAction'
-        // ts problem describre here = https://github.com/reduxjs/redux-thunk/issues/333
+        /* ThunkAction is not assignable to parameter of type 'AnyAction'
+          ts problem is described here = https://github.com/reduxjs/redux-thunk/issues/333 */
         skillRef
             ? store.dispatch(postProgression(skillRef, token))
             : store.dispatch(fetchSkills(token));
@@ -129,16 +68,13 @@ var AppReview = function (_a) {
         if (store === null)
             return;
         var skillRef = options.skillRef;
-        if (skillRef && !isSlideFetched) {
+        if (skillRef && !isProgressionCreated) {
             store.dispatch(navigateTo('loader')); // use loader while posting progression
             return;
         }
-        // TODO: when slides state is refactored (data + mapping),
-        // use loader in case a skillRef is found && no slides from the API
-        // are found
         var initialView = skillRef ? VIEWS.slides : VIEWS.skills;
         store.dispatch(navigateTo(initialView));
-    }, [isSlideFetched, options, store]);
+    }, [isProgressionCreated, options, store]);
     if (!store)
         return null;
     var values = options.templateContext;

package/lib/reducers/data/index.d.ts

@@ -14,5 +14,5 @@ declare const _default: import("redux").Reducer<import("redux").CombinedState<{
     skills: SkillsState;
     slides: SlidesState;
     token: TokenState;
-}>, import("../../actions/data/slides").ValidateSlide | import("../../actions/data/slides").SlidesAction | import("../../actions/api/post-progression").ReceiveProgression | import("../../actions/api/fetch-skills").ReceivedSkills | import("../../actions/data/token").StoreToken>;
+}>, import("../../actions/api/post-progression").ReceiveProgression | import("../../actions/api/fetch-skills").ReceivedSkills | import("./slides").SlidesAction | import("../../actions/data/token").StoreToken>;
 export default _default;

package/lib/reducers/data/progression.d.ts

@@ -1,19 +1,6 @@
-import { ValidateSlide } from '../../actions/data/slides';
+import { ValidateSlide } from '../../actions/ui/slides';
 import { ReceiveProgression } from '../../actions/api/post-progression';
-export declare type ProgressionState = {
-    _id?: string;
-    state: {
-        isCorrect: boolean;
-        nextContent: {
-            ref: 'successExitNode' | string;
-            type: 'success' | 'slide';
-        };
-        pendingSlides: string[];
-        step: {
-            current: number;
-        };
-    };
-    slideNumber?: number;
-} | null;
+import { ProgressionFromAPI } from '../../types/common';
+export declare type ProgressionState = ProgressionFromAPI | null;
 declare const reducer: (state: ProgressionState | undefined, action: ValidateSlide | ReceiveProgression) => ProgressionState;
 export default reducer;

package/lib/reducers/data/progression.js

@@ -1,5 +1,4 @@
-import { getOr } from 'lodash/fp';
-import { VALIDATE_SLIDE } from '../../actions/data/slides';
+import { VALIDATE_SLIDE } from '../../actions/ui/slides';
 import { POST_PROGRESSION_SUCCESS } from '../../actions/api/post-progression';
 var reducer = function (
 // eslint-disable-next-line default-param-last
@@ -7,25 +6,8 @@ state, action) {
     if (state === void 0) { state = null; }
     switch (action.type) {
         case VALIDATE_SLIDE: {
-            var previousSlideNumber = getOr(-1, 'slideNumber', state);
-            // hard coded for now
-            // TODO: fix on VALIDATE ticket
-            return {
-                _id: '1234',
-                // virtual field
-                slideNumber: previousSlideNumber + 1,
-                state: {
-                    pendingSlides: [],
-                    step: {
-                        current: Number.NaN
-                    },
-                    isCorrect: true,
-                    nextContent: {
-                        ref: 'sli_V1gKpYYZ2',
-                        type: 'slide'
-                    }
-                }
-            };
+            // TODO: fix on VALIDATE ticket -> launch a POST PROGRESSION
+            return state;
         }
         case POST_PROGRESSION_SUCCESS: {
             var progression = action.payload;
@@ -35,5 +17,4 @@ state, action) {
             return state;
     }
 };
-// -----------------------------------------------------------------------------
 export default reducer;

package/lib/reducers/data/slides.d.ts

@@ -1,9 +1,8 @@
-import { SlidesAction } from '../../actions/data/slides';
-import { Slide } from '../../types/common';
-export declare type SlidesState = {
-    slideNumbers: number[];
-    [key: number]: Slide;
-};
+import { ValidateSlide } from '../../actions/ui/slides';
+import { ReceivedSlide } from '../../actions/api/fetch-slide';
+import { SlideFromAPI } from '../../types/common';
+export declare type SlidesAction = ReceivedSlide | ValidateSlide;
+export declare type SlidesState = Record<string, SlideFromAPI>;
 export declare const initialState: SlidesState;
 declare const reducer: (state: SlidesState | undefined, action: SlidesAction) => SlidesState;
 export default reducer;