AP-2910: Save attachment categorisation on select

Categorisation would get lost if any already uploaded
files were deleted or a new file uploaded. This was due
to the page being refreshed by the javascript when a
new file is uploaded or existing upload deleted.

This solution implements an immediate update of the attachment's
type/category when a categorisation is selected from the select-list.

app/controllers/v1/attachments_controller.rb

@@ -0,0 +1,20 @@
+module V1
+  class AttachmentsController < ApiController
+     def update
+      return head :not_found unless attachment
+
+      attachment.update!(attachment_type: form_params[:attachment_type])
+      head :ok
+    end
+
+  private
+
+    def attachment
+      @attachment ||= Attachment.find_by(id: form_params[:attachment_id])
+    end
+
+    def form_params
+      params.permit(%i[attachment_id attachment_type])
+    end
+  end
+end

app/controllers/v1/uploaded_evidence_collections_controller.rb

@@ -1,6 +1,7 @@
 module V1
   class UploadedEvidenceCollectionsController < ApiController
     include MalwareScanning
+
     def create
       return head :not_found unless legal_aid_application
 

app/javascript/application.js

@@ -15,6 +15,7 @@ import './src/bank_transactions'
 import './src/checkbox_control'
 import './src/cookie_banner'
 import './src/dropzone'
+import './src/file-upload-categorisation'
 import './src/file-upload-validation'
 import './src/helpers'
 import './src/no_script'

app/javascript/src/dropzone.js

@@ -1,5 +1,6 @@
 import Dropzone from 'dropzone'
 import imgLoading from '../../assets/images/loading-small.gif'
+import { initFileUploadCategorisation } from './file-upload-categorisation'
 
 const screenReaderMessageDelay = 1000 // wait before updating the screenreader message, to avoid interrupting queue
 
@@ -126,6 +127,13 @@ document.addEventListener('DOMContentLoaded', event => {
       xmlHttp.open('GET', url, false) // false for synchronous request
       xmlHttp.send(null)
       fileSection.innerHTML = xmlHttp.responseText
+
+      // reintialise eventhandlers for categorisation select lists
+      const categorisationSelectLists = document.querySelectorAll('select[id^="uploaded-evidence-collection-"]')
+      if (categorisationSelectLists.length) {
+        initFileUploadCategorisation(categorisationSelectLists)
+      }
+
       setTimeout(() => { statusMessage.innerText = 'Your files have been uploaded successfully.' }, screenReaderMessageDelay)
     })
     dropzone.on('error', (file, response) => {

app/javascript/src/file-upload-categorisation.js

@@ -0,0 +1,47 @@
+import axios from 'axios'
+
+async function updateAttachment(attachmentId, attachmentType) {
+  let xhr = new XMLHttpRequest();
+
+  let url = `/v1/attachments/${attachmentId}`
+  // console.log('sending to ' + url)
+
+  const response = await axios({
+    accept: 'application/json',
+    responseType: 'json',
+    method: 'patch',
+    url,
+    data: {
+      attachment_id: attachmentId,
+      attachment_type: attachmentType
+    }
+  })
+
+  return response.data.data
+}
+
+export function initFileUploadCategorisation (categorisationSelectLists) {
+  console.log("found " + categorisationSelectLists.length + " uploaded file select lists")
+
+  categorisationSelectLists.forEach((select) => {
+    select.addEventListener('change', (e) => {
+      /*
+        extract attachment id and name/type from select list
+      */
+      let attachmentId = e.target.name.match(/\[(.*)\]/)[1]
+      let attachmentType = e.target.value
+
+      updateAttachment(attachmentId, attachmentType)
+    })
+  })
+}
+
+document.addEventListener('DOMContentLoaded', event => {
+  const categorisationSelectLists = document.querySelectorAll('select[id^="uploaded-evidence-collection-"]')
+
+  if (categorisationSelectLists.length) {
+    initFileUploadCategorisation(categorisationSelectLists)
+  }
+})
+
+

config/routes.rb

@@ -99,6 +99,7 @@
     resources :statement_of_cases, only: [:create]
     resources :bank_statements, only: [:create]
     resources :uploaded_evidence_collections, only: [:create]
+    resources :attachments, only: [:update]
     resources :providers, only: [:update]
     namespace :partners do
       resources :bank_statements, only: [:create]