Remove immutable in FiltersPicker and HomePageModalStepper

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

packages/core/upload/admin/src/components/FiltersPicker/FiltersCard/index.js

@@ -16,7 +16,7 @@ import FilterInput from './FilterInput';
 const FiltersCard = ({ onChange }) => {
   const timestamps = useSelectTimestamps();
   const [state, dispatch] = useReducer(reducer, initialState, () => init(initialState, timestamps));
-  const { name, filter, filtersForm, value } = state.toJS();
+  const { name, filter, filtersForm, value } = state;
 
   const type = filtersForm[name].type;
   const filtersOptions = getFilterType(type);

packages/core/upload/admin/src/components/FiltersPicker/FiltersCard/init.js

@@ -1,21 +1,30 @@
 const init = (initialState, timestamps) => {
   const [created_at, updated_at] = timestamps;
 
-  return initialState
+  const filtersForm = Object.keys(initialState.filtersForm).reduce((acc, current) => {
-    .update('name', () => created_at)
+    // The timestamps can be customised so we need to update them
-    .updateIn(['filtersForm'], object => {
+    if (current === 'created_at') {
-      return object.keySeq().reduce((acc, current) => {
+      acc[created_at] = initialState.filtersForm.created_at;
-        if (current === 'created_at' && created_at !== 'created_at') {
-          return acc.set(created_at, object.get('created_at')).remove('created_at');
-        }
 
-        if (current === 'updated_at' && updated_at !== 'updated_at') {
+      return acc;
-          return acc.set(updated_at, object.get('updated_at')).remove('updated_at');
+    }
-        }
 
-        return acc;
+    if (current === 'updated_at') {
-      }, object);
+      acc[updated_at] = initialState.filtersForm.updated_at;
-    });
+
+      return acc;
+    }
+
+    acc[current] = initialState.filtersForm[current];
+
+    return acc;
+  }, {});
+
+  return {
+    ...initialState,
+    name: created_at,
+    filtersForm,
+  };
 };
 
 export default init;

packages/core/upload/admin/src/components/FiltersPicker/FiltersCard/reducer.js

@@ -1,47 +1,46 @@
-import { fromJS } from 'immutable';
+import produce from 'immer';
+import get from 'lodash/get';
+import set from 'lodash/set';
 import { dateToUtcTime } from '@strapi/helper-plugin';
 import moment from 'moment';
 
 import filtersForm from './utils/filtersForm';
 
-const initialState = fromJS({
+const initialState = {
   name: 'created_at',
   filter: '=',
   value: dateToUtcTime(moment()),
   filtersForm,
-});
+};
 
-function reducer(state, action) {
+const reducer = (state, action) =>
-  switch (action.type) {
+  // eslint-disable-next-line consistent-return
-    case 'ON_CHANGE': {
+  produce(state, draftState => {
-      const { name, value, defaultValue } = action;
+    switch (action.type) {
+      case 'ON_CHANGE': {
+        set(draftState, [action.name], action.value);
 
-      if (name === 'name') {
+        if (action.name === 'name') {
-        return state
+          const nextFilter = get(state, ['filtersForm', action.value, 'defaultFilter']);
-          .update(name, () => value)
+          const nextValue = get(state, ['filtersForm', action.value, 'defaultValue']);
-          .update('filter', () => state.getIn(['filtersForm', value, 'defaultFilter']))
+
-          .update(
+          draftState.filter = nextFilter;
-            'value',
+          draftState.value = action.defaultValue || nextValue;
-            () => defaultValue || state.getIn(['filtersForm', value, 'defaultValue'])
+        }
-          );
+
+        break;
       }
+      case 'RESET_FORM': {
+        draftState.name = Object.keys(filtersForm)[0];
+        draftState.filter = '=';
+        draftState.filtersForm = filtersForm;
 
-      return state.update(name, () => value);
+        break;
+      }
+      default:
+        return draftState;
     }
-    case 'RESET_FORM':
+  });
-      return initialState
-        .set(
-          'name',
-          state
-            .get('filtersForm')
-            .keySeq()
-            .first()
-        )
-        .update('filtersForm', () => state.get('filtersForm'));
-    default:
-      return state;
-  }
-}
 
 export default reducer;
 export { initialState };

packages/core/upload/admin/src/components/FiltersPicker/FiltersCard/tests/init.test.js

@@ -1,9 +1,8 @@
-import { fromJS } from 'immutable';
 import init from '../init';
 
 describe('UPLOAD | components | FiltersPicker | FilersCard | init', () => {
   it('should set the initialState correctly with the retrieved timestamps', () => {
-    const state = fromJS({
+    const state = {
       name: 'created_at',
       filter: '=',
       value: 'test',
@@ -29,11 +28,11 @@ describe('UPLOAD | components | FiltersPicker | FilersCard | init', () => {
           defaultValue: 'image',
         },
       },
-    });
+    };
 
     const timestamps = ['createdAtCustom', 'updatedAtCustom'];
 
-    const expected = fromJS({
+    const expected = {
       name: 'createdAtCustom',
       filter: '=',
       value: 'test',
@@ -59,7 +58,7 @@ describe('UPLOAD | components | FiltersPicker | FilersCard | init', () => {
           defaultValue: 'image',
         },
       },
-    });
+    };
 
     expect(init(state, timestamps)).toEqual(expected);
   });

packages/core/upload/admin/src/components/FiltersPicker/FiltersCard/tests/reducer.test.js

@@ -1,9 +1,17 @@
 import reducer, { initialState } from '../reducer';
 
 describe('Upload | components | FiltersCard | reducer', () => {
-  it('should return the state with the default value', () => {
+  let state;
-    const state = initialState;
 
+  beforeEach(() => {
+    state = initialState;
+  });
+
+  it('should return the initialState', () => {
+    expect(reducer(state, {})).toEqual(state);
+  });
+
+  it('should return the state with the default value', () => {
     const action = {
       type: 'ON_CHANGE',
       name: 'name',
@@ -11,14 +19,17 @@ describe('Upload | components | FiltersCard | reducer', () => {
     };
 
     const actual = reducer(state, action);
-    const expected = state.set('name', 'size').set('value', '0KB');
+    const expected = {
+      ...state,
+      name: 'size',
+      value: '0KB',
+    };
+    // const expected = state.set('name', 'size').set('value', '0KB');
 
     expect(actual).toEqual(expected);
   });
 
   it('should return the state with the updated value', () => {
-    const state = initialState;
-
     const action = {
       type: 'ON_CHANGE',
       name: 'filter',
@@ -26,13 +37,14 @@ describe('Upload | components | FiltersCard | reducer', () => {
     };
 
     const actual = reducer(state, action);
-    const expected = state.set('filter', '>');
+
+    const expected = { ...state, filter: '>' };
 
     expect(actual).toEqual(expected);
   });
 
   it('should return the initialState on reset', () => {
-    const state = initialState.set('filter', '>');
+    state = { ...state, filter: '>' };
 
     const action = {
       type: 'RESET_FORM',

packages/core/upload/admin/src/components/HomePageModalStepper/index.js

@@ -20,7 +20,6 @@ import { getFilesToDownload, getTrad, getYupError, urlSchema } from '../../utils
 import { useAppContext } from '../../hooks';
 import ModalHeader from '../ModalHeader';
 import stepper from './stepper';
-import init from './init';
 import reducer, { initialState } from './reducer';
 
 const HomePageModalStepper = ({
@@ -41,8 +40,11 @@ const HomePageModalStepper = ({
   const [formErrors, setFormErrors] = useState(null);
   const [shouldRefetch, setShouldRefetch] = useState(false);
   const [displayNextButton, setDisplayNextButton] = useState(false);
-  const [reducerState, dispatch] = useReducer(reducer, initialState, init);
+  const [{ currentStep, fileToEdit, filesToDownload, filesToUpload }, dispatch] = useReducer(
-  const { currentStep, fileToEdit, filesToDownload, filesToUpload } = reducerState.toJS();
+    reducer,
+    initialState
+  );
+
   const { Component, components, headerBreadcrumbs, next, prev, withBackButton } = stepper[
     currentStep
   ];

packages/core/upload/admin/src/components/HomePageModalStepper/init.js

@@ -1,5 +0,0 @@
-const init = initialState => {
-  return initialState;
-};
-
-export default init;

packages/core/upload/admin/src/components/HomePageModalStepper/reducer.js

@@ -1,132 +1,169 @@
-import { fromJS } from 'immutable';
+import produce from 'immer';
-
+import set from 'lodash/set';
 import { createNewFilesToDownloadArray, createNewFilesToUploadArray } from '../../utils';
 
-const initialState = fromJS({
+const initialState = {
   currentStep: 'browse',
   filesToUpload: [],
   filesToDownload: [],
   fileToEdit: null,
-});
+};
 
-const reducer = (state, action) => {
+const reducer = (state, action) =>
-  switch (action.type) {
+  // eslint-disable-next-line consistent-return
-    case 'ADD_FILES_TO_UPLOAD':
+  produce(state, draftState => {
-      return state
+    switch (action.type) {
-        .update('filesToUpload', list =>
+      case 'ADD_FILES_TO_UPLOAD': {
-          list
+        draftState.filesToUpload = [
-            .concat(fromJS(createNewFilesToUploadArray(action.filesToUpload)))
+          ...state.filesToUpload,
-            .map((data, index) => data.set('originalIndex', index))
+          ...createNewFilesToUploadArray(action.filesToUpload),
-        )
+        ].map((data, index) => ({ ...data, originalIndex: index }));
-        .update('currentStep', () => action.nextStep);
+
-    case 'ADD_URLS_TO_FILES_TO_UPLOAD':
+        draftState.currentStep = action.nextStep;
-      return state
+
-        .update('filesToUpload', list =>
+        break;
-          list
+      }
-            .concat(
+      case 'ADD_URLS_TO_FILES_TO_UPLOAD': {
-              fromJS(createNewFilesToDownloadArray(state.get('filesToDownload'), list.toJS()))
+        draftState.currentStep = action.nextStep;
-            )
+
-            .map((data, index) => data.set('originalIndex', index))
+        draftState.filesToUpload = [
-        )
+          ...state.filesToUpload,
-        .update('currentStep', () => action.nextStep)
+          ...createNewFilesToDownloadArray(state.filesToDownload, state.filesToUpload),
-        .update('filesToDownload', () => fromJS([]));
+        ].map((data, index) => ({ ...data, originalIndex: index }));
-    case 'CLEAN_FILES_ERROR':
+
-      return state.update('filesToUpload', list =>
+        draftState.filesToDownload = [];
-        list.map(data => {
+
-          if (data.get('tempId')) {
+        break;
+      }
+      case 'CLEAN_FILES_ERROR': {
+        draftState.filesToUpload = state.filesToUpload.map(data => {
+          if (data.tempId) {
             return data;
           }
 
-          return data.set('hasError', false).set('errorMessage', null);
+          return { ...data, hasError: false, errorMessage: null };
-        })
+        });
-      );
+
-    case 'FILE_DOWNLOADED':
+        break;
-      return state.updateIn(['filesToUpload'], list => {
+      }
-        return list.map(file => {
+      case 'FILE_DOWNLOADED': {
-          if (file.get('tempId') === action.fileTempId) {
+        draftState.filesToUpload = state.filesToUpload.map(file => {
-            return file.update('isDownloading', () => false).update('file', () => action.blob);
+          if (file.tempId === action.fileTempId) {
+            return { ...file, isDownloading: false, file: action.blob };
           }
 
           return file;
         });
-      });
-    case 'GO_TO':
-      return state.update('currentStep', () => action.to);
-    case 'INIT_FILE_TO_EDIT':
-      return state.update('fileToEdit', () => fromJS(action.fileToEdit));
-    case 'ON_ABORT_UPLOAD':
-      return state.updateIn(['fileToEdit', 'isUploading'], () => false);
-    case 'ON_CHANGE_URLS_TO_DOWNLOAD':
-      return state.updateIn(['filesToDownload'], () => fromJS(action.value));
-    case 'ON_CHANGE':
-      return state.updateIn(['fileToEdit', ...action.keys.split('.')], () => action.value);
-    case 'ON_SUBMIT_EDIT_NEW_FILE': {
-      const originalIndex = state.getIn(['fileToEdit', 'originalIndex']);
 
-      return state
+        break;
-        .updateIn(['filesToUpload', originalIndex], () => state.get('fileToEdit'))
+      }
-        .update('fileToEdit', () => null);
+      case 'GO_TO': {
-    }
+        draftState.currentStep = action.to;
-    case 'ON_SUBMIT_EDIT_EXISTING_FILE':
+        break;
-      return state.updateIn(['fileToEdit', 'isUploading'], () => true);
+      }
-    case 'REMOVE_FILE_TO_UPLOAD':
+      case 'INIT_FILE_TO_EDIT': {
-      return state.update('filesToUpload', list => {
+        draftState.fileToEdit = action.fileToEdit;
-        return list.filter(data => data.get('originalIndex') !== action.fileIndex);
+        break;
-      });
+      }
-    case 'RESET_FILE_TO_EDIT':
+      case 'ON_ABORT_UPLOAD': {
-      return state.update('fileToEdit', () => null);
+        draftState.fileToEdit.isUploading = false;
-    case 'RESET_PROPS':
+        break;
-      return initialState;
+      }
-    case 'SET_CROP_RESULT': {
+      case 'ON_CHANGE': {
-      return state.updateIn(['fileToEdit', 'file'], () => fromJS(action.blob));
+        set(draftState, ['fileToEdit', ...action.keys.split('.')], action.value);
-    }
+        break;
-    case 'SET_FILE_ERROR':
+      }
-      return state.update('filesToUpload', list => {
+      case 'ON_CHANGE_URLS_TO_DOWNLOAD': {
-        return list.map(data => {
+        draftState.filesToDownload = action.value;
-          if (data.get('originalIndex') === action.fileIndex) {
+        break;
-            return data
+      }
-              .set('isUploading', false)
+      case 'ON_SUBMIT_EDIT_EXISTING_FILE': {
-              .set('hasError', true)
+        draftState.fileToEdit.isUploading = true;
-              .set('errorMessage', action.errorMessage);
+        break;
-          }
+      }
+      case 'ON_SUBMIT_EDIT_NEW_FILE': {
+        const originalIndex = state.fileToEdit.originalIndex;
 
-          return data;
+        draftState.filesToUpload[originalIndex] = state.fileToEdit;
-        });
+        draftState.fileToEdit = null;
-      });
+        break;
-    case 'SET_FILE_TO_DOWNLOAD_ERROR':
+      }
-      return state.update('filesToUpload', list => {
+      case 'REMOVE_FILE_TO_UPLOAD': {
-        return list.map(file => {
+        draftState.filesToUpload = state.filesToUpload.filter(
-          if (file.get('tempId') === action.fileTempId) {
+          ({ originalIndex }) => originalIndex !== action.fileIndex
-            return file
+        );
-              .update('isDownloading', () => false)
+
-              .update('hasError', () => true)
+        break;
-              .update('errorMessage', () => file.get('fileOriginalName'));
+      }
+      case 'RESET_FILE_TO_EDIT': {
+        draftState.fileToEdit = null;
+        break;
+      }
+      case 'RESET_PROPS': {
+        return initialState;
+      }
+      case 'SET_CROP_RESULT': {
+        draftState.fileToEdit.file = action.blob;
+        break;
+      }
+      case 'SET_FILE_ERROR': {
+        draftState.filesToUpload = state.filesToUpload.map(file => {
+          if (file.originalIndex === action.fileIndex) {
+            return {
+              ...file,
+              isUploading: false,
+              hasError: true,
+              errorMessage: action.errorMessage,
+            };
           }
 
           return file;
         });
-      });
-    case 'SET_FILE_TO_EDIT':
-      return state.update('fileToEdit', () => state.getIn(['filesToUpload', action.fileIndex]));
-    case 'SET_FILE_TO_EDIT_ERROR':
-      return state
-        .updateIn(['fileToEdit', 'hasError'], () => true)
-        .updateIn(['fileToEdit', 'errorMessage'], () => action.errorMessage)
-        .updateIn(['fileToEdit', 'isUploading'], () => false);
-    case 'SET_FILES_UPLOADING_STATE':
-      return state.update('filesToUpload', list =>
-        list.map(data =>
-          data
-            .set('isUploading', true)
-            .set('hasError', false)
-            .set('errorMessage', null)
-        )
-      );
 
-    default:
+        break;
-      return state;
+      }
-  }
+      case 'SET_FILE_TO_DOWNLOAD_ERROR': {
-};
+        draftState.filesToUpload = state.filesToUpload.map(file => {
+          if (file.tempId === action.fileTempId) {
+            return {
+              ...file,
+              isDownloading: false,
+              hasError: true,
+              errorMessage: file.fileOriginalName,
+            };
+          }
+
+          return file;
+        });
+
+        break;
+      }
+      case 'SET_FILE_TO_EDIT': {
+        draftState.fileToEdit = state.filesToUpload[action.fileIndex];
+        break;
+      }
+      case 'SET_FILE_TO_EDIT_ERROR': {
+        draftState.fileToEdit.hasError = true;
+        draftState.fileToEdit.errorMessage = action.errorMessage;
+        draftState.fileToEdit.isUploading = false;
+
+        break;
+      }
+      case 'SET_FILES_UPLOADING_STATE': {
+        draftState.filesToUpload = state.filesToUpload.map(file => ({
+          ...file,
+          isUploading: true,
+          hasError: false,
+          errorMessage: null,
+        }));
+
+        break;
+      }
+
+      default:
+        return draftState;
+    }
+  });
 
 export default reducer;
 export { initialState };

packages/core/upload/admin/src/components/HomePageModalStepper/tests/reducer.test.js

@@ -1,5 +1,4 @@
-import { fromJS } from 'immutable';
+import reducer, { initialState } from '../reducer';
-import reducer from '../reducer';
 
 describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
   describe('default action', () => {
@@ -7,11 +6,12 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
       const action = {
         type: 'TEST',
       };
-      const initialState = fromJS({
+      const state = initialState;
-        test: true,
+      // const initialState = fromJS({
-      });
+      //   test: true,
+      // });
 
-      expect(reducer(initialState, action)).toEqual(initialState);
+      expect(reducer(state, action)).toEqual(initialState);
     });
   });
 
@@ -25,11 +25,13 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
         },
         nextStep: 'test',
       };
-      const state = fromJS({
+
+      const state = {
         currentStep: 'browse',
         filesToUpload: [],
-      });
+      };
-      const expected = fromJS({
+
+      const expected = {
         currentStep: 'test',
         filesToUpload: [
           {
@@ -63,7 +65,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             tempId: null,
           },
         ],
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -77,7 +79,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
         },
         nextStep: 'test',
       };
-      const state = fromJS({
+      const state = {
         currentStep: 'browse',
         filesToUpload: [
           {
@@ -96,8 +98,9 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             tempId: null,
           },
         ],
-      });
+      };
-      const expected = fromJS({
+
+      const expected = {
         currentStep: 'test',
         filesToUpload: [
           {
@@ -146,7 +149,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             tempId: null,
           },
         ],
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -157,7 +160,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
         filesToUpload: {},
         nextStep: 'test',
       };
-      const state = fromJS({
+      const state = {
         currentStep: 'browse',
         filesToUpload: [
           {
@@ -170,8 +173,8 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             tempId: null,
           },
         ],
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         currentStep: 'test',
         filesToUpload: [
           {
@@ -184,7 +187,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             tempId: null,
           },
         ],
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -196,11 +199,11 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
         type: 'ADD_URLS_TO_FILES_TO_UPLOAD',
         nextStep: 'test',
       };
-      const state = fromJS({
+      const state = {
         currentStep: 'browse',
         filesToUpload: [],
         filesToDownload: ['http://www.un.com/photo-1', 'http://www.deux.com/photo-2'],
-      });
+      };
       const firstURL = new URL('http://www.un.com/photo-1');
       const firstURLName = decodeURIComponent(
         firstURL.pathname.substring(firstURL.pathname.lastIndexOf('/') + 1)
@@ -209,7 +212,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
       const secondURLName = decodeURIComponent(
         secondURL.pathname.substring(secondURL.pathname.lastIndexOf('/') + 1)
       );
-      const expected = fromJS({
+      const expected = {
         currentStep: 'test',
         filesToDownload: [],
         filesToUpload: [
@@ -246,22 +249,22 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             tempId: 2,
           },
         ],
-      });
+      };
 
       const received = reducer(state, action);
 
-      expect(received.get('currentStep')).toEqual(expected.get('currentStep'));
+      expect(received.currentStep).toEqual(expected.currentStep);
-      expect(received.get('filesToDownload')).toEqual(expected.get('filesToDownload'));
+      expect(received.filesToDownload).toEqual(expected.filesToDownload);
-      expect(received.get('filesToUpload').toJS()).toEqual(
+      expect(received.filesToUpload).toEqual(
         expect.arrayContaining([
-          expect.objectContaining(expected.getIn(['filesToUpload', '0']).toJS()),
+          expect.objectContaining(expected.filesToUpload[0]),
-          expect.objectContaining(expected.getIn(['filesToUpload', '1']).toJS()),
+          expect.objectContaining(expected.filesToUpload[1]),
         ])
       );
     });
 
     it('should add the files to the (not empty) filesToUpload array and update the current step', () => {
-      const state = fromJS({
+      const state = {
         currentStep: 'browse',
         filesToDownload: ['http://www.trois.com/photo-3', 'http://www.quatre.com/photo-4'],
         filesToUpload: [
@@ -297,7 +300,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             tempId: 2,
           },
         ],
-      });
+      };
       const action = {
         type: 'ADD_URLS_TO_FILES_TO_UPLOAD',
         nextStep: 'test',
@@ -310,7 +313,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
       const secondURLName = decodeURIComponent(
         secondURL.pathname.substring(secondURL.pathname.lastIndexOf('/') + 1)
       );
-      const expected = fromJS({
+      const expected = {
         currentStep: 'test',
         filesToDownload: [],
         filesToUpload: [
@@ -378,18 +381,18 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             tempId: 4,
           },
         ],
-      });
+      };
 
       const received = reducer(state, action);
 
-      expect(received.get('currentStep')).toEqual(expected.get('currentStep'));
+      expect(received.currentStep).toEqual(expected.currentStep);
-      expect(received.get('filesToDownload')).toEqual(expected.get('filesToDownload'));
+      expect(received.filesToDownload).toEqual(expected.filesToDownload);
-      expect(received.get('filesToUpload').toJS()).toEqual(
+      expect(received.filesToUpload).toEqual(
         expect.arrayContaining([
-          expect.objectContaining(expected.getIn(['filesToUpload', '0']).toJS()),
+          expect.objectContaining(expected.filesToUpload[0]),
-          expect.objectContaining(expected.getIn(['filesToUpload', '1']).toJS()),
+          expect.objectContaining(expected.filesToUpload[1]),
-          expect.objectContaining(expected.getIn(['filesToUpload', '2']).toJS()),
+          expect.objectContaining(expected.filesToUpload[2]),
-          expect.objectContaining(expected.getIn(['filesToUpload', '3']).toJS()),
+          expect.objectContaining(expected.filesToUpload[[3]]),
         ])
       );
     });
@@ -400,10 +403,10 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
       const action = {
         type: 'CLEAN_FILES_ERROR',
       };
-      const state = fromJS({
+      const state = {
         currentStep: 'test',
         filesToUpload: [],
-      });
+      };
 
       expect(reducer(state, action)).toEqual(state);
     });
@@ -412,7 +415,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
       const action = {
         type: 'CLEAN_FILES_ERROR',
       };
-      const state = fromJS({
+      const state = {
         currentStep: 'test',
         filesToUpload: [
           {
@@ -440,9 +443,9 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             originalIndex: 2,
           },
         ],
-      });
+      };
 
-      const expected = fromJS({
+      const expected = {
         currentStep: 'test',
         filesToUpload: [
           {
@@ -470,7 +473,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             originalIndex: 2,
           },
         ],
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -479,7 +482,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
       const action = {
         type: 'CLEAN_FILES_ERROR',
       };
-      const state = fromJS({
+      const state = {
         currentStep: 'test',
         filesToUpload: [
           {
@@ -508,9 +511,9 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             originalIndex: 2,
           },
         ],
-      });
+      };
 
-      const expected = fromJS({
+      const expected = {
         currentStep: 'test',
         filesToUpload: [
           {
@@ -539,7 +542,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             originalIndex: 2,
           },
         ],
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -547,7 +550,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
 
   describe('FILE_DOWLOADED', () => {
     it('should update the corresponding file', () => {
-      const state = fromJS({
+      const state = {
         currentStep: 'browse',
         filesToDownload: [],
         filesToUpload: [
@@ -581,7 +584,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             tempId: 2,
           },
         ],
-      });
+      };
 
       const action = {
         type: 'FILE_DOWNLOADED',
@@ -589,7 +592,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
         blob: 'test',
       };
 
-      const expected = fromJS({
+      const expected = {
         currentStep: 'browse',
         filesToDownload: [],
         filesToUpload: [
@@ -623,7 +626,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             tempId: 2,
           },
         ],
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -635,12 +638,12 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
         type: 'GO_TO',
         to: 'test',
       };
-      const state = fromJS({
+      const state = {
         currentStep: 'browse',
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         currentStep: 'test',
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -654,16 +657,16 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
           test: 'test',
         },
       };
-      const state = fromJS({
+      const state = {
         fileToEdit: null,
         currentStep: 'test',
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         fileToEdit: {
           test: 'test',
         },
         currentStep: 'test',
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -674,20 +677,20 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
       const action = {
         type: 'ON_ABORT_UPLOAD',
       };
-      const state = fromJS({
+      const state = {
         fileToEdit: {
           test: 'test',
           isUploading: true,
         },
         currentStep: 'test',
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         fileToEdit: {
           test: 'test',
           isUploading: false,
         },
         currentStep: 'test',
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -700,20 +703,20 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
         keys: 'test',
         value: 'test 1',
       };
-      const state = fromJS({
+      const state = {
         fileToEdit: {
           test: 'test',
           isUploading: true,
         },
         currentStep: 'test',
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         fileToEdit: {
           test: 'test 1',
           isUploading: true,
         },
         currentStep: 'test',
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -726,14 +729,14 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
         keys: 'test',
         value: ['test 1', 'test 2'],
       };
-      const state = fromJS({
+      const state = {
         filesToDownload: [],
         currentStep: 'test',
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         filesToDownload: ['test 1', 'test 2'],
         currentStep: 'test',
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -744,20 +747,20 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
       const action = {
         type: 'ON_SUBMIT_EDIT_EXISTING_FILE',
       };
-      const state = fromJS({
+      const state = {
         fileToEdit: {
           test: 'test',
           isUploading: false,
         },
         currentStep: 'test',
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         fileToEdit: {
           test: 'test',
           isUploading: true,
         },
         currentStep: 'test',
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -768,7 +771,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
       const action = {
         type: 'ON_SUBMIT_EDIT_NEW_FILE',
       };
-      const state = fromJS({
+      const state = {
         currentStep: 'edit-new',
         filesToUpload: [
           {
@@ -797,8 +800,8 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             otherTest: true,
           },
         },
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         currentStep: 'edit-new',
         filesToUpload: [
           {
@@ -822,7 +825,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
           },
         ],
         fileToEdit: null,
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -834,7 +837,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
         type: 'REMOVE_FILE_TO_UPLOAD',
         fileIndex: 1,
       };
-      const state = fromJS({
+      const state = {
         currentStep: 'test',
         filesToUpload: [
           {
@@ -862,8 +865,8 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             originalIndex: 2,
           },
         ],
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         currentStep: 'test',
         filesToUpload: [
           {
@@ -884,23 +887,23 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             originalIndex: 2,
           },
         ],
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
   });
 
-  describe('RESET_FILE_TO_UPLOAD', () => {
+  describe('RESET_FILE_TO_EDIT', () => {
     it('should set the fileToEdit key to null', () => {
       const action = {
         type: 'RESET_FILE_TO_EDIT',
       };
-      const state = fromJS({
+      const state = {
         fileToEdit: 'test',
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         fileToEdit: null,
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -910,12 +913,12 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
     it('should return the initialState', () => {
       const action = { type: 'RESET_PROPS' };
       const state = { test: true };
-      const expected = fromJS({
+      const expected = {
         currentStep: 'browse',
         filesToUpload: [],
         filesToDownload: [],
         fileToEdit: null,
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -929,20 +932,20 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
           test: true,
         },
       };
-      const state = fromJS({
+      const state = {
         fileToEdit: {
           originalIndex: 1,
           file: null,
         },
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         fileToEdit: {
           originalIndex: 1,
           file: {
             test: true,
           },
         },
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -950,7 +953,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
 
   describe('SET_FILE_TO_DOWNLOAD_ERROR', () => {
     it('should update the specified file error', () => {
-      const state = fromJS({
+      const state = {
         currentStep: 'browse',
         filesToDownload: [],
         filesToUpload: [
@@ -986,14 +989,14 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             tempId: 2,
           },
         ],
-      });
+      };
 
       const action = {
         type: 'SET_FILE_TO_DOWNLOAD_ERROR',
         fileTempId: 2,
       };
 
-      const expected = fromJS({
+      const expected = {
         currentStep: 'browse',
         filesToDownload: [],
         filesToUpload: [
@@ -1029,7 +1032,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             tempId: 2,
           },
         ],
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -1042,7 +1045,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
         fileIndex: 1,
         errorMessage: 'size limit exceeded',
       };
-      const state = fromJS({
+      const state = {
         currentStep: 'test',
         filesToUpload: [
           {
@@ -1070,9 +1073,9 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             originalIndex: 2,
           },
         ],
-      });
+      };
 
-      const expected = fromJS({
+      const expected = {
         currentStep: 'test',
         filesToUpload: [
           {
@@ -1100,7 +1103,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             originalIndex: 2,
           },
         ],
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -1112,7 +1115,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
         type: 'SET_FILE_TO_EDIT',
         fileIndex: 1,
       };
-      const state = fromJS({
+      const state = {
         fileToEdit: null,
         filesToUpload: [
           {
@@ -1134,8 +1137,8 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             },
           },
         ],
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         fileToEdit: {
           originalIndex: 1,
           file: {
@@ -1162,7 +1165,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             },
           },
         ],
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -1174,7 +1177,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
         type: 'SET_FILE_TO_EDIT_ERROR',
         errorMessage: 'Bad request',
       };
-      const state = fromJS({
+      const state = {
         fileToEdit: {
           originalIndex: 1,
           file: {
@@ -1204,8 +1207,8 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             },
           },
         ],
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         fileToEdit: {
           originalIndex: 1,
           file: {
@@ -1235,7 +1238,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             },
           },
         ],
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });
@@ -1246,7 +1249,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
       const action = {
         type: 'SET_FILES_UPLOADING_STATE',
       };
-      const state = fromJS({
+      const state = {
         currentStep: 'test',
         filesToUpload: [
           {
@@ -1274,8 +1277,8 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             originalIndex: 2,
           },
         ],
-      });
+      };
-      const expected = fromJS({
+      const expected = {
         currentStep: 'test',
         filesToUpload: [
           {
@@ -1303,7 +1306,7 @@ describe('UPLOAD | components | HomePageModalStepper | reducer', () => {
             originalIndex: 2,
           },
         ],
-      });
+      };
 
       expect(reducer(state, action)).toEqual(expected);
     });