Added confirmation when uploading scans for a template with no divisions (#7993)

Author: danielrafailov1

Changelog.md

@@ -7,6 +7,7 @@
 ### 🚨 Breaking changes
 
 ### ✨ New features and improvements
+- Added a confirm dialog to the Upload Scans form that appears when no template divisions are assigned to the selected exam template (#7993)
 - Migrated `MarkingSchemesTable` component to React Table V8 (#7985)
 - Removed Graders Subcomponent and added a Graders column in the Assignment Grades tab (#7967)
 - Added GET and PATCH /overall_comment API routes (#7963)

app/views/exam_templates/_boot.js.erb

@@ -246,3 +246,32 @@ function set_crop_selection(crop_target, form, id, jcrop_api) {
 function _round_down_to_nearest_hundred(num) {
   return Math.floor(num / 100) * 100;
 }
+
+/**
+ * Adds a submit event listener to the upload scans form.
+ * The event listener checks the template divisions count of the template that was selected from the form dropdown
+ * and shows a confirmation dialog on submission of the form if the selected template has no divisions assigned to it.
+ * This function runs after the form is injected in view_logs.js.erb.
+ * @param {Array} examTemplateData contains exam template ids and matching template division counts.
+ * @returns {void}
+ */
+function init_upload_scans_form(examTemplateData) {
+  const uploadScansForm = document.getElementById('upload_scans_form');
+  const dropdown = document.getElementById('exam_template_dropdown');
+
+  if (!uploadScansForm || !dropdown) {
+    return;
+  }
+
+  uploadScansForm.addEventListener('submit', (e) => {
+    const selectedExamTemplate = examTemplateData.find(template => String(template.exam_template_id) === dropdown.value);
+
+    if (selectedExamTemplate && selectedExamTemplate.template_division_count === 0) {
+      const proceed = confirm(I18n.t('exam_templates.upload_scans.confirmation_dialog'));
+      if (!proceed) {
+        e.preventDefault();
+        e.stopPropagation();
+      }
+    }
+  }, true);
+}

app/views/exam_templates/_split_form.html.erb

@@ -1,12 +1,14 @@
-<%= form_with url: split_course_assignment_exam_templates_path(@current_course),
+<%= form_with id: 'upload_scans_form',
+              url: split_course_assignment_exam_templates_path(@current_course),
               method: :patch,
               authenticity_token: true,
               multipart: true do |f| %>
   <div class="inline-labels">
     <%= f.label :exam_template_id, ExamTemplate.model_name.human %>
     <%= f.select :exam_template_id,
                  options_from_collection_for_select(@exam_templates, 'id', 'name'),
-                 required: true %>
+                 {required: true},
+                 {id: 'exam_template_dropdown'} %>
     <%= f.label :pdf_to_split, t('exam_templates.upload_scans.instruction') %>
     <%= f.file_field :pdf_to_split, required: true, accept: 'application/pdf' %>
   </div>

app/views/exam_templates/view_logs.js.erb

@@ -3,3 +3,12 @@ document.getElementById('editing_pane_menu').innerHTML =
 
 makeExamScanLogTable(document.getElementById('exam_scan_log_table'),
   {course_id: <%= @current_course.id %>, assignment_id: <%= @assignment.id %>});
+
+<% exam_template_data = @exam_templates.map{
+  |exam_template|
+    { exam_template_id: exam_template.id, template_division_count: exam_template.template_divisions.size }
+} %>
+
+let examTemplateData = <%= exam_template_data.to_json.html_safe %>;
+
+init_upload_scans_form(examTemplateData);

config/locales/views/exam_templates/en.yml

@@ -98,6 +98,7 @@ en:
       instruction: Replace template file
       success: Exam Template has been successfully updated
     upload_scans:
+      confirmation_dialog: The selected exam template has no template divisions assigned to it. Are you sure you would like to proceed?
       failure: Scans failed to upload
       instruction: Papers to upload (.pdf)
       invalid: Invalid file type

spec/controllers/exam_templates_controller_spec.rb

@@ -342,9 +342,19 @@
     end
 
     describe '#view_logs' do
-      before { get_as user, :view_logs, params: { assignment_id: exam_template.assignment.id, course_id: course.id } }
+      render_views
+      before do
+ get_as user, :view_logs, format: 'js', params: { assignment_id: exam_template.assignment.id, course_id: course.id }
+      end
 
       it('should respond with 200') { expect(response).to have_http_status :ok }
+
+      it 'passes template division data to init_upload_scans_form' do
+        expect(response.body).to include('upload_scans_form')
+        expect(response.body).to include('template_division_count')
+        expect(response.body).to include('init_upload_scans_form(examTemplateData)')
+        expect(response.body).to include(exam_template.id.to_s)
+      end
     end
 
     describe '#download_generate' do