small fixups for bc templates (#3289)

Small fixups for batch connect templates - mostly UI related.
OSC · Jan 12, 2024 · 1a2ece0 · 1a2ece0
1 parent d11eb0b
commit 1a2ece0
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 21 deletions.
diff --git a/apps/dashboard/app/javascript/prefill_templates/prefill_submit.js b/apps/dashboard/app/javascript/prefill_templates/prefill_submit.js
@@ -4,14 +4,13 @@ const selectorID = "modal_input_template_name";
 const newNameID = "modal_input_template_new_name";
 
 export function prefillSubmitHandler() {
-  const form = $("#new_batch_connect_session_context");
 
   const chooseTemplateName = $("#chooseTemplateName");
   if (chooseTemplateName.length === 0) {
     return;
   }
 
-  const chooseTemplateNameError = $("#chooseTemplateNameError");
+  const chooseTemplateNameError = $("#batch_connect_session_template_name_error_modal");
   const templateName = $("#batch_connect_session_template_name");
   const saveTemplate = $("#batch_connect_session_save_template");
 
@@ -24,7 +23,7 @@ export function prefillSubmitHandler() {
     }
   });
 
-  $("#chooseTemplateNameConfirm").on("click", function () {
+  $("#batch_connect_session_template_choose_name_button").on("click", function () {
     const name = $(`#${selectorID}`).val() || $(`#${newNameID}`).val();
     if (name === "") {
       chooseTemplateNameError.modal('show');
@@ -36,7 +35,7 @@ export function prefillSubmitHandler() {
     chooseTemplateName.modal('hide');
   });
 
-  saveTemplate.change(function () {
+  saveTemplate.on('change', function () {
     if ($(this).is(':checked')) {
       chooseTemplateName.modal('show');
     } else {
@@ -51,7 +50,7 @@ export function prefillSubmitHandler() {
   chooseTemplateName.on('hidden.bs.modal', function () {
     if (templateName.val() === "") {
       saveTemplate.prop('checked', false);
-      saveTemplate.change();
+      saveTemplate.trigger('change');
     }
   });
 }
diff --git a/apps/dashboard/app/javascript/prefill_templates/prefill_templates.js b/apps/dashboard/app/javascript/prefill_templates/prefill_templates.js
@@ -15,8 +15,8 @@ export function prefillTemplatesHandler() {
     try {
       json = JSON.parse(templateOption.val());
     } catch (error) {
-      $('#formPrefillErrorBody').text(error.message)
-      $('#formPrefillError').modal('show');
+      $('#batch_connect_session_template_form_error_modal').text(error.message)
+      $('#batch_connect_session_template_form_error_modal_body').modal('show');
       return;
     }
 
@@ -57,8 +57,8 @@ export function prefillTemplatesHandler() {
     }
 
     if (errorMsg) {
-      $('#formPrefillErrorBody').html(errorMsg)
-      $('#formPrefillError').modal('show');
+      $('#batch_connect_session_template_form_error_modal_body').html(errorMsg)
+      $('#batch_connect_session_template_form_error_modal').modal('show');
     }
   });
 }
diff --git a/apps/dashboard/app/views/batch_connect/session_contexts/_form.html.erb b/apps/dashboard/app/views/batch_connect/session_contexts/_form.html.erb
@@ -6,12 +6,10 @@
     <%= create_widget(f, attrib, format: @render_format) %>
   <% end %>
 
-  <div class="form-group">
-    <div class="form-check">
-      <input class="form-check-input" name="save_template" type="checkbox" id="batch_connect_session_save_template">
-      <label class="form-check-label" for="batch_connect_session_save_template"><%= t('dashboard.batch_connect_form_save') %></label>
-      <input name="template_name" type="text" id="batch_connect_session_template_name" readonly>
-    </div>
+  <div class="form-group form-check d-flex">
+      <input class="form-check-input align-self-center" name="save_template" type="checkbox" id="batch_connect_session_save_template">
+      <label class="form-check-label align-self-center" for="batch_connect_session_save_template"><%= t('dashboard.batch_connect_form_save') %></label>
+      <input class="ml-auto" name="template_name" type="text" id="batch_connect_session_template_name" aria-label="<%= t('dashboard.batch_connect_form_template_name_label') %>" readonly>
   </div>
 
   <%= f.submit t('dashboard.batch_connect_form_launch'), class: "btn btn-primary btn-block" %>

diff --git a/apps/dashboard/app/views/batch_connect/session_contexts/_prefill_templates.html.erb b/apps/dashboard/app/views/batch_connect/session_contexts/_prefill_templates.html.erb
@@ -10,7 +10,7 @@
   </div>
 <%- end -%>
 
-<div class="modal fade" id="formPrefillError" tabindex="-1" role="dialog" aria-labelledby="formPrefillErrorLabel" aria-hidden="true">
+<div class="modal fade" id="batch_connect_session_template_form_error_modal" tabindex="-1" role="dialog" aria-labelledby="formPrefillErrorLabel" aria-hidden="true">
   <div class="modal-dialog" role="document">
     <div class="modal-content">
       <div class="modal-header">
@@ -19,7 +19,7 @@
           <span aria-hidden="true">&times;</span>
         </button>
       </div>
-      <div class="modal-body" id="formPrefillErrorBody"></div>
+      <div class="modal-body" id="batch_connect_session_template_form_error_modal_body"></div>
     </div>
   </div>
 </div>
@@ -37,20 +37,20 @@
             <option value="<%= name %>"><%= name %></option>
           <% end %>
         </select>
-        <input type="text" class="form-control" id="modal_input_template_new_name" placeholder="<%= t('dashboard.batch_connect_form_type_new_name') %>">
+        <input type="text" class="form-control mt-3" id="modal_input_template_new_name" placeholder="<%= t('dashboard.batch_connect_form_type_new_name') %>">
       </div>
       <div class="modal-footer">
-        <button type="button" class="btn btn-primary" id="chooseTemplateNameConfirm"><%= t('dashboard.save') %></button>
+        <button type="button" class="btn btn-primary" id="batch_connect_session_template_choose_name_button"><%= t('dashboard.save') %></button>
       </div>
     </div>
   </div>
 </div>
 
-<div class="modal fade" id="chooseTemplateNameError" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
+<div class="modal fade" id="batch_connect_session_template_name_error_modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
   <div class="modal-dialog" role="document">
     <div class="modal-content">
       <div class="modal-header">
-        <h5 class="modal-title" id="chooseTemplateNameErrorLabel"><%= t('dashboard.batch_connect_form_type_new_name_error') %></h5>
+        <h5 class="modal-title"><%= t('dashboard.batch_connect_form_type_new_name_error') %></h5>
         <button type="button" class="close" data-dismiss="modal" aria-label="Close">
           <span aria-hidden="true">&times;</span>
         </button>

diff --git a/apps/dashboard/config/locales/en.yml b/apps/dashboard/config/locales/en.yml
@@ -98,6 +98,7 @@ en:
     batch_connect_form_save: "Save as template"
     batch_connect_form_save_new_template: "save as a new template"
     batch_connect_form_select_template: "select a template"
+    batch_connect_form_template_name_label: "template name"
     batch_connect_form_session_data_html: |
       * The %{title} session data for this session can be accessed
         under the %{data_link_tag}.