Github issue#2204, Attachments/File Upload for phase specification question is not working

- Work around to enable attachments for products. Need proper implementation in upcoming releases.

Author: Vikas Agarwal

src/projects/actions/projectAttachment.js

@@ -2,9 +2,9 @@ import {
   addProjectAttachment as addProjectAttachmentAPI,
   removeProjectAttachment as removeProjectAttachmentAPI,
   updateProjectAttachment as updateProjectAttachmentAPI,
-  addProductAttachment as addProductAttachmentAPI,
-  removeProductAttachment as removeProductAttachmentAPI,
-  updateProductAttachment as updateProductAttachmentAPI,
+  // addProductAttachment as addProductAttachmentAPI,
+  // removeProductAttachment as removeProductAttachmentAPI,
+  // updateProductAttachment as updateProductAttachmentAPI,
 } from '../../api/projectAttachments'
 
 import {
@@ -47,7 +47,7 @@ export function addProductAttachment(projectId, phaseId, productId, attachment)
   return (dispatch) => {
     return dispatch({
       type: ADD_PRODUCT_ATTACHMENT,
-      payload: addProductAttachmentAPI(projectId, phaseId, productId, attachment)
+      payload: addProjectAttachmentAPI(projectId, attachment)
         .then((uploadedAttachment) => ({
           phaseId,
           productId,
@@ -61,7 +61,7 @@ export function updateProductAttachment(projectId, phaseId, productId, attachmen
   return (dispatch) => {
     return dispatch({
       type: UPDATE_PRODUCT_ATTACHMENT,
-      payload: updateProductAttachmentAPI(projectId, phaseId, productId, attachmentId, attachment)
+      payload: updateProjectAttachmentAPI(projectId, attachmentId, attachment)
         .then((uploadedAttachment) => ({
           phaseId,
           productId,
@@ -75,7 +75,7 @@ export function removeProductAttachment(projectId, phaseId, productId, attachmen
   return (dispatch) => {
     return dispatch({
       type: REMOVE_PRODUCT_ATTACHMENT,
-      payload: removeProductAttachmentAPI(projectId, phaseId, productId, attachmentId)
+      payload: removeProjectAttachmentAPI(projectId, attachmentId)
         .then((removedAttachmentId) => ({
           phaseId,
           productId,

src/projects/detail/components/FileListContainer.jsx

@@ -36,6 +36,7 @@ class FileListContainer extends Component {
   render() {
     const {
       files,
+      category,
       allMembers,
       attachmentsStorePath,
       canManageAttachments,
@@ -56,7 +57,7 @@ class FileListContainer extends Component {
     return (
       <div>
         <FileList files={files} onDelete={removeAttachment} onSave={updateAttachment} canModify={canManageAttachments}/>
-        <AddFiles successHandler={this.processUploadedFiles} storePath={attachmentsStorePath} category={'appDefinition'} />
+        <AddFiles successHandler={this.processUploadedFiles} storePath={attachmentsStorePath} category={category} />
       </div>
     )
   }

src/projects/detail/components/SpecSection.jsx

@@ -158,10 +158,16 @@ const SpecSection = props => {
     case 'files': {
       const projectLatest = isProjectDirty ? dirtyProject : project
       const files = _.get(projectLatest, props.fieldName, [])
+      // NOTE using category to differentiate between project and product attachments is a workaround to give ability
+      // to upload attachments for products. We need to come up with a better way to handle this.
+      // defaults to appDefinition to be backward compatible
+      let category = _.get(props, 'category', 'appDefinition')
+      category = 'product' === category ? `${category}#${projectLatest.id}` : category
       return (
         <FileListContainer
           project={projectLatest}
           files={files}
+          category={category}
           addAttachment={addAttachment}
           updateAttachment={updateAttachment}
           removeAttachment={removeAttachment}

src/projects/reducers/project.js

@@ -191,12 +191,30 @@ export const projectState = function (state=initialState, action) {
       isLoadingPhases: true
     })
 
-  case LOAD_PROJECT_PHASES_SUCCESS:
+  case LOAD_PROJECT_PHASES_SUCCESS: {
+    // loops through the phases to update the attachments field in the products of each phase
+    // NOTE it might not be needed after we get a proper implementation for supporting product attachments
+    const phases = _.map(action.payload, p => {
+      p.products = _.map(p.products, prd => {
+        const attachments = []
+        if (state.project.attachments && state.project.attachments.length) {
+          state.project.attachments.forEach(a => {
+            if (a.category === `product#${prd.id}`) {
+              attachments.push(a)
+              // TODO remove `a` from project's attachments
+            }
+          })
+        }
+        return { ...prd, attachments }
+      })
+      return p
+    })
     return update(state, {
-      phases: { $set: action.payload },
+      phases: { $set:phases },
       phasesNonDirty: { $set: action.payload },
       isLoadingPhases: { $set: false}
     })
+  }
 
   // Create & Edit project
   case CREATE_PROJECT_STAGE_PENDING: