CM-983: added downloading template file for upload (#90)

src/components/dialogs/IndividualsUploadDialog.js

@@ -23,6 +23,7 @@ import WorkflowsPicker from '../../pickers/WorkflowsPicker';
 import { fetchWorkflows } from '../../actions';
 import IndividualsHistoryUploadDialog from './IndividualsHistoryUploadDialog';
 import { EMPTY_STRING, INDIVIDUAL_MODULE_NAME, PYTHON_DEFAULT_IMPORT_WORKFLOW } from '../../constants';
+import downloadTemplate from '../../util/export';
 
 const styles = (theme) => ({
   item: theme.paper.item,
@@ -143,6 +144,10 @@ function IndividualsUploadDialog({
     return `${modulesManager.getRef('individual.route.enrollment')}`;
   }
 
+  const downloadExampleTemplate = () => {
+    downloadTemplate();
+  };
+
   return (
     <>
       <MenuItem>
@@ -261,6 +266,15 @@ function IndividualsUploadDialog({
                 </Button>
               </div>
               <div style={{ float: 'right', paddingRight: '16px' }}>
+                <Button
+                  variant="contained"
+                  color="primary"
+                  onClick={() => downloadExampleTemplate()}
+                  style={{ marginRight: '8px' }}
+                >
+                  {formatMessage(intl, 'individual', 'individual.upload.template')}
+                </Button>
+                <></><></>
                 <Button
                   variant="contained"
                   color="primary"

src/translations/en.json

@@ -56,6 +56,7 @@
       "alert.header": "Error during file upload.",
       "workflowPicker": "Workflow",
       "cancel": "Cancel",
+      "template": "Template",
       "uploadHistoryTable": {
         "workflow": "Workflow",
         "dateCreated": "Date Created",

src/util/export.js

@@ -0,0 +1,22 @@
+import { baseApiUrl } from '@openimis/fe-core';
+
+export default function downloadTemplate() {
+  const url = new URL(
+    `${window.location.origin}${baseApiUrl}/individual/download_template_file/`,
+  );
+
+  fetch(url)
+    .then((response) => response.blob())
+    .then((blob) => {
+      const link = document.createElement('a');
+      link.href = URL.createObjectURL(blob);
+      link.download = 'individual_upload_template.csv';
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+    })
+    .catch((error) => {
+      // eslint-disable-next-line no-console
+      console.error('Export failed, reason: ', error);
+    });
+}