Remove files from redux and fix bug on new submissions

packages/component-wizard/src/components/Files.js

@@ -3,12 +3,14 @@ import { get } from 'lodash'
 import PropTypes from 'prop-types'
 import { connect } from 'react-redux'
 import { withRouter } from 'react-router-dom'
+import { change as changeForm } from 'redux-form'
 import {
   compose,
-  withHandlers,
-  getContext,
   lifecycle,
+  withState,
+  getContext,
   withContext,
+  withHandlers,
 } from 'recompose'
 import { SortableList } from 'pubsweet-components-faraday/src/components'
 
@@ -17,10 +19,7 @@ import FileSection from './FileSection'
 import {
   uploadFile,
   deleteFile,
-  getFiles,
   getRequestStatus,
-  setAllFiles,
-  moveFiles,
   getSignedUrl,
 } from '../redux/files'
 
@@ -84,20 +83,27 @@ export default compose(
   connect(
     state => ({
       isFetching: getRequestStatus(state),
-      files: getFiles(state),
     }),
     {
+      changeForm,
       uploadFile,
       deleteFile,
-      setAllFiles,
-      moveFiles,
       getSignedUrl,
     },
   ),
+  withState('files', 'setFiles', {
+    manuscripts: [],
+    coverLetter: [],
+    supplementary: [],
+  }),
   lifecycle({
     componentDidMount() {
-      const { version, setAllFiles } = this.props
-      setAllFiles(version.files)
+      const { version: { files }, setFiles } = this.props
+      setFiles(prev => ({
+        manuscripts: get(files, 'manuscripts') || [],
+        coverLetter: get(files, 'coverLetter') || [],
+        supplementary: get(files, 'supplementary') || [],
+      }))
     },
   }),
   withHandlers({
@@ -107,10 +113,15 @@ export default compose(
         window.open(signedUrl)
       })
     },
-    dropSortableFile: ({ files, setAllFiles }) => () => {
-      setAllFiles(files)
+    dropSortableFile: ({ files, setFiles, changeForm }) => () => {
+      setFiles(files)
+      changeForm('wizard', 'files', files)
     },
-    changeList: ({ files, setAllFiles }) => (fromListId, toListId, id) => {
+    changeList: ({ files, setFiles, changeForm }) => (
+      fromListId,
+      toListId,
+      id,
+    ) => {
       const swappedFile = files[fromListId].find(f => f.id === id)
 
       const fromFiles = files[fromListId].filter(f => f.id !== id)
@@ -121,26 +132,38 @@ export default compose(
         [toListId]: toFiles,
         [fromListId]: fromFiles,
       }
-      setAllFiles(newFiles)
+      setFiles(newFiles)
+      changeForm('wizard', 'files', files)
     },
-    addFile: ({ files, uploadFile, setAllFiles, version }) => type => file => {
+    addFile: ({
+      files,
+      uploadFile,
+      setFiles,
+      changeForm,
+      version,
+    }) => type => file => {
       uploadFile(file, type, version.id).then(fileResponse => {
         const newFiles = {
           ...files,
           [type]: [...files[type], fileResponse],
         }
-        setAllFiles(newFiles)
+        setFiles(newFiles)
+        changeForm('wizard', 'files', newFiles)
       })
     },
-    moveItem: ({ moveFiles, files }) => type => (dragIndex, hoverIndex) => {
+    moveItem: ({ moveFiles, files, setFiles }) => type => (
+      dragIndex,
+      hoverIndex,
+    ) => {
       const newFiles = {
         ...files,
         [type]: SortableList.moveItem(files[type], dragIndex, hoverIndex),
       }
-      moveFiles(newFiles)
+      setFiles(newFiles)
     },
     removeFile: ({
-      setAllFiles,
+      setFiles,
+      changeForm,
       files,
       deleteFile,
       version,
@@ -151,7 +174,8 @@ export default compose(
         ...files,
         [type]: files[type].filter(f => f.id !== id),
       }
-      setAllFiles(newFiles, type)
+      setFiles(newFiles, type)
+      changeForm('wizard', 'files', files)
     },
   }),
   withContext(

packages/component-wizard/src/components/WizardPage.js

 import PropTypes from 'prop-types'
 import { connect } from 'react-redux'
-import { bindActionCreators } from 'redux'
 import { actions } from 'pubsweet-client'
+import { bindActionCreators } from 'redux'
 import { withJournal } from 'xpub-journal'
 import { ConnectPage } from 'xpub-connect'
-import { selectCollection, selectFragment } from 'xpub-selectors'
-import { compose, withHandlers, withState, withContext } from 'recompose'
-import HTML5Backend from 'react-dnd-html5-backend'
 import { DragDropContext } from 'react-dnd'
+import HTML5Backend from 'react-dnd-html5-backend'
+import { selectCollection, selectFragment } from 'xpub-selectors'
+import {
+  compose,
+  withHandlers,
+  withState,
+  withContext,
+  toClass,
+} from 'recompose'
 
 import Wizard from './Wizard'
 
@@ -81,4 +87,5 @@ export default compose(
     }),
   ),
   DragDropContext(HTML5Backend),
+  toClass,
 )(Wizard)

packages/component-wizard/src/redux/files.js

 import request, { remove, get } from 'pubsweet-client/src/helpers/api'
-import { change as changeForm } from 'redux-form'
 
 const initialState = {
   isFetching: {
@@ -8,11 +7,6 @@ const initialState = {
     coverLetter: false,
   },
   error: null,
-  files: {
-    manuscripts: [],
-    supplementary: [],
-    coverLetter: [],
-  },
 }
 // constants
 const UPLOAD_REQUEST = 'files/UPLOAD_REQUEST'
@@ -23,23 +17,7 @@ const REMOVE_REQUEST = 'files/REMOVE_REQUEST'
 const REMOVE_FAILURE = 'files/REMOVE_FAILURE'
 const REMOVE_SUCCESS = 'files/REMOVE_SUCCESS'
 
-const SET_ALL_FILES = 'files/SET_ALL_FILES'
-
 // action creators
-const _setAllFiles = files => ({
-  type: SET_ALL_FILES,
-  files,
-})
-
-export const setAllFiles = files => dispatch => {
-  dispatch(changeForm('wizard', 'files', files))
-  dispatch(_setAllFiles(files))
-}
-
-export const moveFiles = files => dispatch => {
-  dispatch(_setAllFiles(files))
-}
-
 const uploadRequest = type => ({
   type: UPLOAD_REQUEST,
   fileType: type,
@@ -83,7 +61,6 @@ const removeSuccess = () => ({
 })
 
 // selectors
-export const getFiles = state => state.files.files
 export const getRequestStatus = state => state.files.isFetching
 
 // thunked actions
@@ -112,11 +89,6 @@ export const getSignedUrl = fileId => dispatch => get(`/aws/${fileId}`)
 // reducer
 export default (state = initialState, action) => {
   switch (action.type) {
-    case SET_ALL_FILES:
-      return {
-        ...state,
-        files: action.files,
-      }
     case UPLOAD_REQUEST:
       return {
         ...state,

packages/components-faraday/src/components/SortableList/SortableList.js

@@ -132,5 +132,4 @@ SortableList.moveItem = (items, dragIndex, hoverIndex) => {
   ]
 }
 
-// export default DragDropContext(HTML5Backend)(SortableList)
 export default SortableList