Add attachments in a service portal

In the Consumer Service Portal (Service Portal), consumers can add attachments to claims and policies. Adding an attachment is a multistage process that begins with using the multifileupload servlet to upload the file to the server and ends by including an attachment reference from the claim or policy to the file.

Adding an attachment to a loss event.: To add an attachment to a loss event, the portal calls the POST /multifileupload API to upload the attachment to the server and then the portal retrieves the name from the response. Finally, the portal provides the document’s file name when it calls the POST /claimevents endpoint to submit the claim.
Adding an attachment to an existing claim: To add an attachment to a claim, the portal calls the POST /multifileupload API to upload the attachment to the server and then the portal retrieves the name from the response. Finally, the portal calls the POST /claims/systemId/documents endpoint to add a attachment reference to the claim.

Add an attachment to a policy: To add an attachment to a policy the portal calls the POST /multifileupload API to upload the attachment to the server and then the portal retrieves the name from the response. Finally, the portal calls the POST /policies/systemId/documents endpoint to add a attachment reference to the policy.

Example code

In the following example code, the uploadFiles method uploads the file to the server, and then the attachFiles method adds the attachment to a claim.

import { API, MULTI_PART_API } from '../api';
import {
  setErrors as policySetErrors,
  setTotalUploads,
  setCurrentUploads,
  setSubmittingRow as policySetSubmittingRow,
} from '../../components/features/dashboard/policies/policyReducer';

import { setErrors as claimSetErrors } from '../../components/features/dashboard/claims/claimsReducer';

const attachFiles = async (filenames, containerType, id, dispatch, notify) => {
  let resource;
  let templateId;
  let memo;
  if (containerType === 'Policy') {
    resource = 'policies';
    templateId = 'XPolicyAttachment0002';
    memo = 'Policy Documents attached by the Consumer Portal';
  } else if (containerType === 'Claim') {
    resource = 'claims';
    templateId = 'XLossNoticeAttachment0002';
    memo = 'Claim Documents attached by the Consumer Portal';
  } else {
    // return if no container type provided
    return;
  }
  // const promises = [];
  dispatch(setTotalUploads(filenames.length));
  dispatch(setCurrentUploads(1));
  for (let i = 0; i < filenames.length; i++) {
    await API.post(`${resource}/${id}/documents`, {
      fileName: filenames[i],
      templateId,
      description: filenames[i],
      memo,
    })
      .then(response => {
        console.log(response);
        notify(`Success, unable to upload ${filenames[i]}`, {
          variant: 'success',
          anchorOrigin: {
            horizontal: 'center',
            vertical: 'top',
          },
        });
        dispatch(setCurrentUploads(i + 1));
      })
      .catch(err => {
        console.log(err);
        notify(`error, unable to upload ${filenames[i]}`, {
          variant: 'error',
          anchorOrigin: {
            horizontal: 'center',
            vertical: 'top',
          },
        });
        dispatch(setCurrentUploads(i + 1));
      })
      .finally(() => {});
  }
  dispatch(policySetSubmittingRow(null));
  dispatch(setCurrentUploads(null));
  dispatch(setTotalUploads(null));
};

export const uploadFiles = (files, id, containerType, notify) => {
  let fd = new FormData();
  files.map(file => fd.append(file.name, file));

  return async dispatch => {
    return MULTI_PART_API.post('multifileupload', fd)
      .then(response => {
        console.log(response);
        const filenames = [];
        // TODO we may need to read the response from response.data.files later
        response.data.map(data => filenames.push(data.name));
        attachFiles(filenames, containerType, id, dispatch, notify);
      })
      .catch(err => {
        console.log(err);
        if (containerType === 'Policy') {
          dispatch(policySetErrors(err.message));
        } else if (containerType === 'Claim') {
          dispatch(claimSetErrors(err.message));
        }
      });
  };
};

Note: This example might not work for your particular scenario and is only provided as an example.