Add tests

Signed-off-by: soupette <cyril.lpz@gmail.com>

packages/strapi-plugin-users-permissions/admin/src/containers/Providers/index.js

@@ -8,6 +8,7 @@ import pluginPermissions from '../../permissions';
 import { getRequestURL, getTrad } from '../../utils';
 import ListBaselineAlignment from '../../components/ListBaselineAlignment';
 import ListRow from '../../components/ListRow';
+import createProvidersArray from './utils/createProvidersArray';
 import reducer, { initialState } from './reducer';
 
 const ProvidersPage = () => {
@@ -20,7 +21,8 @@ const ProvidersPage = () => {
     isLoading: isLoadingForPermissions,
     allowedActions: { canUpdate },
   } = useUserPermissions(updatePermissions);
-  const [{ isLoading, providers }, dispatch] = useReducer(reducer, initialState);
+  const [{ isLoading, modifiedData }, dispatch] = useReducer(reducer, initialState);
+  const providers = useMemo(() => createProvidersArray(modifiedData), [modifiedData]);
   const enabledProvidersCount = useMemo(
     () => providers.filter(provider => provider.enabled).length,
     [providers]
@@ -59,12 +61,12 @@ const ProvidersPage = () => {
 
         const data = await request(getRequestURL('providers'), { method: 'GET' });
 
-        console.log({ data });
-
         dispatch({
           type: 'GET_DATA_SUCCEEDED',
           data,
         });
+
+        console.log({ data });
       } catch (err) {
         dispatch({
           type: 'GET_DATA_ERROR',

packages/strapi-plugin-users-permissions/admin/src/containers/Providers/reducer.js

@@ -3,8 +3,8 @@ import { sortBy } from 'lodash';
 
 const initialState = {
   isLoading: true,
-  data: {},
+  initialData: {},
-  providers: [],
+  modifiedData: {},
 };
 
 const reducer = (state, action) =>
@@ -13,32 +13,23 @@ const reducer = (state, action) =>
     switch (action.type) {
       case 'GET_DATA': {
         draftState.isLoading = true;
+        draftState.initialData = {};
+        draftState.modifiedData = {};
+
         break;
       }
 
       case 'GET_DATA_SUCCEEDED': {
         draftState.isLoading = false;
-        draftState.data = action.data;
+        draftState.initialData = action.data;
-        draftState.providers = sortBy(
+        draftState.modifiedData = action.data;
-          Object.keys(action.data).reduce((acc, current) => {
-            const { icon: iconName, enabled } = action.data[current];
-            const icon = iconName === 'envelope' ? ['fas', 'envelope'] : ['fab', iconName];
-
-            acc.push({ name: current, icon, enabled });
-
-            return acc;
-          }, []),
-          'name'
-        );
 
         break;
       }
       case 'GET_DATA_ERROR': {
-        drafState.isLoading = true;
+        draftState.isLoading = true;
         break;
       }
-      case 'RESET_PROPS':
-        return initialState;
       default: {
         return draftState;
       }

packages/strapi-plugin-users-permissions/admin/src/containers/Providers/tests/reducer.test.js

@@ -0,0 +1,86 @@
+import produce from 'immer';
+import reducer from '../reducer';
+
+describe('USERS PERMISSIONS | CONTAINERS | Providers | reducer', () => {
+  let state;
+
+  beforeEach(() => {
+    state = {
+      isLoading: true,
+      initialData: {},
+      modifiedData: {},
+    };
+  });
+
+  describe('DEFAULT_ACTION', () => {
+    it('should return the state', () => {
+      const expected = state;
+
+      expect(reducer(state, {})).toEqual(expected);
+    });
+  });
+
+  describe('GET_DATA', () => {
+    it('should set the isLoading key to true', () => {
+      const action = {
+        type: 'GET_DATA',
+      };
+
+      state.isLoading = false;
+      state.initialData = true;
+      state.modifiedData = true;
+
+      const expected = produce(state, draft => {
+        draft.isLoading = true;
+        draft.initialData = {};
+        draft.modifiedData = {};
+      });
+
+      expect(reducer(state, action)).toEqual(expected);
+    });
+  });
+
+  describe('GET_DATA_SUCCEEDED', () => {
+    it('should set the data correctly', () => {
+      const data = {
+        email: { enabled: true, icon: 'envelope' },
+        discord: {
+          callback: '/auth/discord/callback',
+          enabled: false,
+          icon: 'discord',
+          key: '',
+          scope: ['identify', 'email'],
+          secret: '',
+        },
+      };
+      const action = {
+        type: 'GET_DATA_SUCCEEDED',
+        data,
+      };
+
+      const expected = produce(state, draft => {
+        draft.isLoading = false;
+        draft.initialData = data;
+        draft.modifiedData = data;
+      });
+
+      expect(reducer(state, action)).toEqual(expected);
+    });
+  });
+
+  describe('GET_DATA_ERROR', () => {
+    it('should set the isLoading key to false', () => {
+      const action = {
+        type: 'GET_DATA_ERROR',
+      };
+
+      state.isLoading = false;
+
+      const expected = produce(state, draft => {
+        draft.isLoading = true;
+      });
+
+      expect(reducer(state, action)).toEqual(expected);
+    });
+  });
+});

packages/strapi-plugin-users-permissions/admin/src/containers/Providers/utils/createProvidersArray.js

@@ -0,0 +1,17 @@
+import { sortBy } from 'lodash';
+
+const createProvidersArray = data => {
+  return sortBy(
+    Object.keys(data).reduce((acc, current) => {
+      const { icon: iconName, enabled } = data[current];
+      const icon = iconName === 'envelope' ? ['fas', 'envelope'] : ['fab', iconName];
+
+      acc.push({ name: current, icon, enabled });
+
+      return acc;
+    }, []),
+    'name'
+  );
+};
+
+export default createProvidersArray;

packages/strapi-plugin-users-permissions/admin/src/containers/Providers/utils/tests/createProvidersArray.test.js

@@ -0,0 +1,32 @@
+import createProvidersArray from '../createProvidersArray';
+
+describe('USERS PERMISSIONS | CONTAINERS | Providers | utils | createProvidersArray', () => {
+  it('should format the data correctly', () => {
+    const data = {
+      email: { enabled: true, icon: 'envelope' },
+      discord: {
+        callback: '/auth/discord/callback',
+        enabled: false,
+        icon: 'discord',
+        key: '',
+        scope: ['identify', 'email'],
+        secret: '',
+      },
+    };
+
+    const expected = [
+      {
+        name: 'discord',
+        icon: ['fab', 'discord'],
+        enabled: false,
+      },
+      {
+        name: 'email',
+        icon: ['fas', 'envelope'],
+        enabled: true,
+      },
+    ];
+
+    expect(createProvidersArray(data)).toEqual(expected);
+  });
+});