@coorpacademy/app-review 0.0.21-alpha.8 → 0.1.2

package/es/actions/courses.d.ts

@@ -4,4 +4,3 @@ export declare type ReceivedCourse = {
     payload: unknown;
 };
 export declare const receivedCourse: (course: unknown) => ReceivedCourse;
-//# sourceMappingURL=courses.d.ts.map

package/es/actions/{api → data}/is-fetching.d.ts

@@ -3,4 +3,3 @@ export declare type IsFetching = {
     type: typeof IS_FETCHING_TRUE;
 };
 export declare const setIsFetching: () => IsFetching;
-//# sourceMappingURL=is-fetching.d.ts.map

package/{lib/actions/api → es/actions/data}/validate-slide.d.ts

@@ -3,4 +3,3 @@ export declare type ValidateSlide = {
     type: typeof VALIDATE_SLIDE;
 };
 export declare const validateSlide: () => ValidateSlide;
-//# sourceMappingURL=validate-slide.d.ts.map

package/es/actions/finished-slides.d.ts

@@ -5,4 +5,3 @@ export declare type UpdateFinishedSlides = {
     payload: UpdateFinishedSlidesPayload;
 };
 export declare const updateFinishedSlides: (payload: UpdateFinishedSlidesPayload) => UpdateFinishedSlides;
-//# sourceMappingURL=finished-slides.d.ts.map

package/es/actions/index.d.ts

@@ -3,4 +3,3 @@ import { NavigateBack, NavigateTo, StartApp } from './navigation';
 import { StoreToken } from './token';
 import { StoreFirstSlide } from './slides';
 export declare type Action = NavigateBack | NavigateTo | ReceivedCourse | StartApp | StoreFirstSlide | StoreToken;
-//# sourceMappingURL=index.d.ts.map

package/es/actions/navigation.d.ts

@@ -17,4 +17,3 @@ export declare type StartApp = {
 export declare const navigateTo: (newPath: ViewPath) => NavigateTo;
 export declare const navigateBack: () => NavigateBack;
 export declare const startApp: (options: AppOptions) => StartApp;
-//# sourceMappingURL=navigation.d.ts.map

package/es/actions/review-status.d.ts

@@ -5,4 +5,3 @@ export declare type UpdateReviewStatus = {
     payload: UpdateReviewStatusPayload;
 };
 export declare const updateReviewStatus: (payload: UpdateReviewStatusPayload) => UpdateReviewStatus;
-//# sourceMappingURL=review-status.d.ts.map

package/es/actions/slides.d.ts

@@ -18,4 +18,3 @@ export declare type SlidesAction = StoreFirstSlide | UpdateSlidesOnValidation |
 export declare const storeFirstSlide: (slide: Slide) => StoreFirstSlide;
 export declare const updateSlidesOnValidation: (payload: UpdateSlidesOnValidationPayload) => UpdateSlidesOnValidation;
 export declare const updateSlidesOnNext: (payload: UpdateSlidesOnNextPayload) => UpdateSlidesOnNext;
-//# sourceMappingURL=slides.d.ts.map

package/es/actions/step-items.d.ts

@@ -12,4 +12,3 @@ export declare type UpdateStepItemsOnNext = {
 export declare type StepItemsAction = UpdateStepItemsOnValidation | UpdateStepItemsOnNext;
 export declare const updateStepItemsOnValidation: (payload: UpdateStepItemsOnValidationClickPayload) => UpdateStepItemsOnValidation;
 export declare const updateStepItemsOnNext: (payload: UpdateStepItemsOnNextClickPayload) => UpdateStepItemsOnNext;
-//# sourceMappingURL=step-items.d.ts.map

package/es/actions/token.d.ts

@@ -4,4 +4,3 @@ export declare type StoreToken = {
     payload: string;
 };
 export declare const storeToken: (token: string) => StoreToken;
-//# sourceMappingURL=token.d.ts.map

package/es/common/index.d.ts

@@ -5,4 +5,4 @@ export declare const VIEWS: {
     readonly onboarding: 'onboarding';
     readonly slides: 'slides';
 };
-//# sourceMappingURL=index.d.ts.map
+export declare const slideNumbers: number[];

package/es/common/index.js

@@ -5,3 +5,4 @@ export const VIEWS = {
     onboarding: 'onboarding',
     slides: 'slides'
 };
+export const slideNumbers = [0, 1, 2, 3, 4];

package/es/configure-store.d.ts

@@ -1,6 +1,5 @@
 import { AnyAction, EmptyObject, Store } from 'redux';
 import { StoreState } from './types/store-state';
-export default function configureStore(): Promise<Store<EmptyObject & StoreState, AnyAction> & {
+export default function configureStore(): Store<EmptyObject & StoreState, AnyAction> & {
     dispatch: {};
-}>;
-//# sourceMappingURL=configure-store.d.ts.map
+};

package/es/configure-store.js

@@ -4,15 +4,9 @@ import rootReducer from './reducers';
 import onStartApp from './middlewares/on-start-app';
 const preloadedState = undefined;
 // -----------------------------------------------------------------------------
-export default async function configureStore() {
-    const isExtensionEnabled = typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__;
-    const isProd = process.env.NODE_ENV !== 'production';
-    const { composeWithDevTools } = isProd
-        ? { composeWithDevTools: null }
-        : // eslint-disable-next-line node/no-unsupported-features/es-syntax, import/dynamic-import-chunkname
-            await import('redux-devtools-extension');
-    const _compose = !isProd && isExtensionEnabled
-        ? composeWithDevTools({
+export default function configureStore() {
+    const _compose = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
+        ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({
             name: 'app-review',
             trace: true,
             traceLimit: 25

package/es/fixtures/qcm-slide.d.ts

@@ -0,0 +1,2 @@
+import { Slide } from '../types/slides';
+export declare const slide: Slide;

package/es/fixtures/qcm-slide.js

@@ -0,0 +1,29 @@
+export const slide = {
+    questionText: 'QCM',
+    answerUI: {
+        help: '__help',
+        model: {
+            type: 'qcm',
+            choices: [
+                {
+                    selected: false,
+                    title: 'choix1',
+                    help: '(help choix1)',
+                    ariaLabel: '__ariaLabel1'
+                },
+                {
+                    selected: false,
+                    title: 'choix2',
+                    help: '(help choix2)',
+                    ariaLabel: '__ariaLabel2'
+                },
+                {
+                    selected: false,
+                    title: 'choix3',
+                    help: '(help choix3)',
+                    ariaLabel: '__ariaLabel3'
+                }
+            ]
+        }
+    }
+};

package/es/{temp-fixture.d.ts → fixtures/temp-fixture.d.ts}

@@ -1,4 +1,3 @@
-import { SlidesViewProps } from './types/views';
+import { SlidesViewProps } from '../types/views';
 export declare const correctionPopinProps: SlidesViewProps['correctionPopinProps'];
 export declare const congratsProps: SlidesViewProps['congratsProps'];
-//# sourceMappingURL=temp-fixture.d.ts.map

package/es/helpers/css-register.js

@@ -0,0 +1,2 @@
+import cssRegister from '@coorpacademy/css-modules-require-hook';
+cssRegister();

package/es/index.d.ts

@@ -1,5 +1,4 @@
-/// <reference types="react" />
-import { AppOptions } from './types/common';
+import type { AppOptions } from './types/common';
 declare const AppReview: ({ options }: {
     options: AppOptions;
 }) => JSX.Element;
@@ -9,4 +8,3 @@ declare global {
     }
 }
 export default AppReview;
-//# sourceMappingURL=index.d.ts.map

package/es/index.js

@@ -5,11 +5,11 @@ import configureStore from './configure-store';
 import { navigateTo, navigateBack, startApp } from './actions/navigation';
 import { updateSlidesOnNext, updateSlidesOnValidation } from './actions/slides';
 import { getCurrentViewName } from './reducers/navigation';
-import { congratsProps, correctionPopinProps } from './temp-fixture';
+import { congratsProps, correctionPopinProps } from './fixtures/temp-fixture';
 import { updateFinishedSlides } from './actions/finished-slides';
 import { updateReviewStatus } from './actions/review-status';
 import { updateStepItemsOnValidation, updateStepItemsOnNext } from './actions/step-items';
-import { validateSlide } from './actions/api/validate-slide';
+import { validateSlide } from './actions/data/validate-slide';
 // -----------------------------------------------------------------------------
 const mapDispatchToProps = {
     navigateTo,
@@ -22,40 +22,56 @@ const mapDispatchToProps = {
     updateStepItemsOnNext,
     updateFinishedSlides
 };
-// StaticProps
-const mapStateToProps = (state) => ({
-    viewName: getCurrentViewName(state),
-    slides: {
-        slides: state.slides,
-        validate: {
-            label: '__validate'
-        },
-        finishedSlides: state.finishedSlides,
-        stepItems: state.stepItems,
-        reviewStatus: state.reviewStatus,
-        correctionPopinProps,
-        congratsProps,
-        slideValidationResult: state.api.entities.slideValidationResult
-    }
-});
+const mapStateToProps = (state) => {
+    return {
+        viewName: getCurrentViewName(state),
+        slides: {
+            headerProps: {
+                mode: '__revision_mode',
+                skillName: '__agility',
+                onQuitClick: () => {
+                    // eslint-disable-next-line no-console
+                    console.log('onQuitClick');
+                },
+                'aria-label': 'aria-header-wrapper',
+                closeButtonAriaLabel: 'aria-close-button'
+            },
+            slides: state.ui.slides,
+            validate: {
+                label: '__validate'
+            },
+            finishedSlides: state.ui.finishedSlides,
+            stepItems: state.ui.stepItems,
+            reviewStatus: state.ui.reviewStatus,
+            correctionPopinProps,
+            congratsProps,
+            slideValidationResult: state.data.slideValidationResult
+        }
+    };
+};
 // Props = StaticProps && Dispatchers
 const App = connect(mapStateToProps, mapDispatchToProps)(AppReviewTemplate);
 // -----------------------------------------------------------------------------
 const AppReview = ({ options }) => {
     const [store, setStore] = useState(null);
+    const [appStarted, setAppStarted] = useState(false);
     useEffect(() => {
-        const _configure = async () => {
-            const _store = await configureStore();
-            _store.dispatch(startApp(options));
-            setStore(_store);
-        };
-        _configure();
-    }, [options]);
-    if (!store)
+        if (store) {
+            store.dispatch(startApp(options));
+            setAppStarted(true);
+        }
+        else {
+            const _configure = async () => {
+                const _store = await configureStore();
+                setStore(_store);
+            };
+            _configure();
+        }
+    }, [options, store]);
+    if (!store || !appStarted)
         return null;
     return (React.createElement(Provider, { store: store },
         React.createElement(App, null)));
 };
-// type Props = {options: AppOptions};
 // -----------------------------------------------------------------------------
 export default AppReview;

package/es/index.test.js

@@ -0,0 +1,52 @@
+import browserEnv from 'browser-env';
+import test from 'ava';
+import React from 'react';
+import { render, fireEvent, act } from '@testing-library/react';
+import { slide } from './fixtures/qcm-slide';
+import AppReview from '.';
+browserEnv({ pretendToBeVisual: true });
+const elementExists = (foundElements) => foundElements && foundElements[0];
+const sleep = (msToSleep) => new Promise(resolve => {
+    setTimeout(resolve, msToSleep);
+});
+const waitForChanges = async (msToWait = 3000) => {
+    await act(async () => {
+        await sleep(msToWait); // wait *just* a little longer than the timeout in the component
+    });
+};
+const LIMIT = 5;
+const clickAllSlides = async (t, container, accumulator = 0) => {
+    if (accumulator === LIMIT)
+        return;
+    // last one needs to wait for more calculations && components updates
+    if (accumulator === 4)
+        await act(async () => {
+            await sleep(1000);
+        });
+    const validateButton = container.querySelectorAll(`[data-name="slide-validate-button-${accumulator}"]`);
+    t.truthy(elementExists(validateButton));
+    await act(async () => {
+        await fireEvent.click(validateButton[0]);
+    });
+    const nextButton = container.querySelectorAll(`[data-name="next-question-button-${accumulator}"]`);
+    t.truthy(elementExists(nextButton));
+    await act(async () => {
+        await fireEvent.click(nextButton[0]);
+    });
+    await clickAllSlides(t, container, accumulator + 1);
+};
+const appOptions = {
+    token: process.env.API_TEST_TOKEN || '',
+    slide
+};
+test('should validate all the slides (all correct scenario)', async (t) => {
+    t.plan(13);
+    const { container } = render(React.createElement(AppReview, { options: appOptions, key: 0 }));
+    await waitForChanges(1000);
+    const wrapper = container.querySelector('[data-name="slides-revision-container"]');
+    t.truthy(wrapper);
+    const stackedSlidesContainer = wrapper.querySelector('[data-name="stacked-slides-container"]');
+    t.truthy(stackedSlidesContainer);
+    await clickAllSlides(t, container);
+    t.pass();
+});

package/es/middlewares/on-start-app.d.ts

@@ -4,4 +4,3 @@ import { Action } from '../actions';
 import { StoreState } from '../types/store-state';
 declare const onStartApp: Middleware<{}, StoreState, Dispatch<Action>>;
 export default onStartApp;
-//# sourceMappingURL=on-start-app.d.ts.map

package/es/middlewares/on-start-app.js

@@ -5,6 +5,8 @@ import { storeToken } from '../actions/token';
 import { storeFirstSlide } from '../actions/slides';
 const onStartApp = ({ dispatch }) => next => (action) => {
     if (action.type === START_APP) {
+        // eslint-disable-next-line no-warning-comments
+        // TODO: fetchProgression + fetchSlide à partir de la progression passée dans les options de l'app
         const { slide } = action.payload;
         if (slide) {
             const { token } = action.payload;

package/es/reducers/courses.d.ts

@@ -3,4 +3,3 @@ export declare type State = Array<unknown>;
 export declare const initialState: State;
 declare const reducer: (state: State, action: ReceivedCourse) => State;
 export default reducer;
-//# sourceMappingURL=courses.d.ts.map

package/es/reducers/data.d.ts

@@ -0,0 +1,7 @@
+import { StoreToken } from '../actions/token';
+import { IsFetching } from '../actions/data/is-fetching';
+import { ValidateSlide } from '../actions/data/validate-slide';
+import { DataState } from '../types/data';
+declare type ApiActions = IsFetching | ValidateSlide | StoreToken;
+declare const data: (state: DataState, action: ApiActions) => DataState;
+export default data;

package/es/reducers/{api.js → data.js}

@@ -1,18 +1,25 @@
 import getOr from 'lodash/fp/getOr';
 import noop from 'lodash/fp/noop';
 import set from 'lodash/fp/set';
-import { IS_FETCHING_TRUE } from '../actions/api/is-fetching';
-import { VALIDATE_SLIDE } from '../actions/api/validate-slide';
+import { STORE_TOKEN } from '../actions/token';
+import { IS_FETCHING_TRUE } from '../actions/data/is-fetching';
+import { VALIDATE_SLIDE } from '../actions/data/validate-slide';
+import { setToken } from './token';
 const defaultState = {
-    entities: { isFetching: true, slideValidationResult: null }
+    isFetching: true,
+    slideValidationResult: null,
+    token: null
 };
 // eslint-disable-next-line default-param-last
-const api = (state = defaultState, action) => {
+const data = (state = defaultState, action) => {
     switch (action.type) {
+        case STORE_TOKEN: {
+            return setToken(action.payload, state);
+        }
         case VALIDATE_SLIDE: {
-            const previousSlideNumber = getOr(-1, 'entities.slideValidationResult.slideNumber', state);
+            const previousSlideNumber = getOr(-1, 'slideValidationResult.slideNumber', state);
             // hard coded for now
-            return set(['entities', 'slideValidationResult'], {
+            return set('slideValidationResult', {
                 slideNumber: previousSlideNumber + 1,
                 result: 'success',
                 // exitNode
@@ -57,7 +64,7 @@ const api = (state = defaultState, action) => {
             }, state);
         }
         case IS_FETCHING_TRUE: {
-            return set('entities.isFetching', true, state);
+            return set('isFetching', true, state);
         }
         // case VALIDATE_SLIDE_FAILURE: {
         //   return set('entities.isFetching', false, state);
@@ -66,4 +73,4 @@ const api = (state = defaultState, action) => {
             return state;
     }
 };
-export default api;
+export default data;

package/es/reducers/finished-slides.d.ts

@@ -2,6 +2,5 @@ import { UpdateFinishedSlides } from '../actions/finished-slides';
 import { FinishedSlides } from '../types/finished-slides';
 export declare type State = FinishedSlides;
 export declare const initialState: State;
-declare const reducer: (state: FinishedSlides, action: UpdateFinishedSlides) => FinishedSlides;
+declare const reducer: (state: State, action: UpdateFinishedSlides) => State;
 export default reducer;
-//# sourceMappingURL=finished-slides.d.ts.map

package/es/reducers/finished-slides.js

@@ -1,17 +1,27 @@
+import forEach from 'lodash/fp/forEach';
 import { UPDATE_FINISHED_SLIDES } from '../actions/finished-slides';
-export const initialState = new Map();
+import { slideNumbers } from '../common';
+const _forEach = forEach.convert({
+    cap: false
+});
+export const initialState = {
+    slideNumbers
+};
 // -----------------------------------------------------------------------------
 // eslint-disable-next-line default-param-last
 const reducer = (state = initialState, action) => {
     switch (action.type) {
         case UPDATE_FINISHED_SLIDES: {
+            const { slideNumbers: _slideNumbers, ...rest } = state;
             const { slideNumber, value } = action.payload;
-            const _state = new Map();
-            // eslint-disable-next-line fp/no-loops
-            for (const [index, previousValue] of state) {
-                _state.set(index, previousValue);
-            }
-            _state.set(slideNumber, value);
+            const _state = {
+                slideNumbers: _slideNumbers
+            };
+            _forEach((finishedSlide, index) => {
+                const previousValue = finishedSlide;
+                _state[index] = previousValue;
+            }, rest);
+            _state[slideNumber] = value;
             return _state;
         }
         default:

package/es/reducers/index.d.ts

@@ -1,17 +1,12 @@
 declare const _default: import("redux").Reducer<import("redux").CombinedState<{
-    api: import("../types/api").ApiState | {
-        entities: {
-            isFetching: boolean;
-            slideValidationResult: any;
-        };
-    };
-    courses: import("./courses").State;
-    finishedSlides: import("../types/finished-slides").FinishedSlides;
-    navigation: import("../types/states").NavigationState;
-    reviewStatus: import("./review-status").State;
-    slides: import("../types/slides").Slides;
-    stepItems: import("../types/step-items").StepItems;
-    token: string;
+    ui: import("redux").CombinedState<{
+        courses: import("./courses").State;
+        finishedSlides: import("../types/finished-slides").FinishedSlides;
+        navigation: import("../types/states").NavigationState;
+        reviewStatus: import("./review-status").State;
+        slides: import("../types/slides").Slides;
+        stepItems: import("../types/step-items").StepItems;
+    }>;
+    data: import("../types/data").DataState;
 }>, import("redux").AnyAction>;
 export default _default;
-//# sourceMappingURL=index.d.ts.map

package/es/reducers/index.js

@@ -1,19 +1,20 @@
 import { combineReducers } from 'redux';
-import api from './api';
+import data from './data';
 import courses from './courses';
 import finishedSlides from './finished-slides';
 import navigation from './navigation';
 import reviewStatus from './review-status';
 import slides from './slides';
 import stepItems from './step-items';
-import token from './token';
-export default combineReducers({
-    api,
+const ui = combineReducers({
     courses,
     finishedSlides,
     navigation,
     reviewStatus,
     slides,
-    stepItems,
-    token
+    stepItems
+});
+export default combineReducers({
+    ui,
+    data
 });

package/es/reducers/navigation.d.ts

@@ -6,4 +6,3 @@ export declare const initialState: State;
 declare const reducer: (state: State, action: NavigateTo | NavigateBack) => State;
 export declare const getCurrentViewName: (appState: StoreState) => ViewPath;
 export default reducer;
-//# sourceMappingURL=navigation.d.ts.map

package/es/reducers/navigation.js

@@ -19,6 +19,6 @@ const reducer = (state = initialState, action) => {
     }
 };
 // -----------------------------------------------------------------------------
-export const getCurrentViewName = (appState) => appState.navigation[appState.navigation.length - 1];
+export const getCurrentViewName = (appState) => appState.ui.navigation[appState.ui.navigation.length - 1];
 // -----------------------------------------------------------------------------
 export default reducer;

package/es/reducers/review-status.d.ts

@@ -3,4 +3,3 @@ export declare type State = 'finished' | 'ongoing';
 export declare const initialState: State;
 declare const reducer: (state: State, action: UpdateReviewStatus) => State;
 export default reducer;
-//# sourceMappingURL=review-status.d.ts.map

package/es/reducers/slides.d.ts

@@ -2,6 +2,5 @@ import { SlidesAction } from '../actions/slides';
 import { Slides } from '../types/slides';
 export declare type State = Slides;
 export declare const initialState: State;
-declare const reducer: (state: Slides, action: SlidesAction) => Slides;
+declare const reducer: (state: State, action: SlidesAction) => State;
 export default reducer;
-//# sourceMappingURL=slides.d.ts.map