Changes in this PR:

- Request feedback (for org admins) - Action dropdown (for plan -> contributors table) - Customisable template tab (templates -> customisable templates) - Guidance and guidance group list Actions dropdown - When Guidance/Comments is single tab in a plan (for users) - Partial fix for conditional questions - Styling for 'Add new notification' button
DMPRoadmap · Dec 11, 2023 · 91c1717 · 91c1717
1 parent 952aad6
commit 91c1717
Show file tree

Hide file tree

Showing 17 changed files with 72 additions and 72 deletions.
diff --git a/app/helpers/customizable_template_link_helper.rb b/app/helpers/customizable_template_link_helper.rb
@@ -13,16 +13,18 @@ def link_to_customizable_template(name, customization, template)
         name = name.blank? ? _('Transfer customisation') : name
         link_to name,
                 org_admin_template_customization_transfers_path(customization.id),
-                data: { method: 'post' }
+                data: { method: 'post' },
+                class: 'nav-link dropdown-item px-3'
       else
         name = name.blank? ? _('Edit customisation') : name
-        link_to name, org_admin_template_path(id: customization.id)
+        link_to name, org_admin_template_path(id: customization.id), class: 'nav-link dropdown-item px-3'
       end
     else
       name = name.blank? ? _('Customise') : name
       link_to name,
               org_admin_template_customizations_path(template.id),
-              'data-method': 'post'
+              'data-method': 'post',
+              class: 'nav-link dropdown-item px-3'
     end
   end
   # rubocop:enable Metrics/AbcSize, Metrics/PerceivedComplexity

diff --git a/app/javascript/src/orgAdmin/conditions/updateConditions.js b/app/javascript/src/orgAdmin/conditions/updateConditions.js
@@ -14,10 +14,10 @@ export default function updateConditions(id) {
     }
   }
 
-  // set up selectpicker select boxes for condition options
+  // set up form-select select boxes for condition options
   const setSelectPicker = () => {
-    $('.selectpicker.narrow').selectpicker({ width: 120 });
-    $('.selectpicker.regular').selectpicker({ width: 150 });
+    // $('.form-select.narrow').selectpicker({ width: 120 });
+    // $('.form-select.regular').selectpicker({ width: 150 });
   };
 
   // test if a webhook is selected and set up if so
@@ -78,7 +78,7 @@ export default function updateConditions(id) {
   // webhook form
   const webhookForm = (webhooks = false, selectObject = false) => {
     if (selectObject === false) {
-      $('.selectpicker.action-type').each((idx, selectObject2) => {
+      $('.form-select.action-type').each((idx, selectObject2) => {
         webhookSelected(selectObject2, webhooks[idx]);
       });
     } else {
@@ -109,7 +109,7 @@ export default function updateConditions(id) {
       addDiv.html(e.detail[0].add_link);
       conditionList.attr('data-loaded', 'false');
       setSelectPicker();
-      const selectObject = conditionList.find('.selectpicker.action-type').last();
+      const selectObject = conditionList.find('.form-select.action-type').last();
       webhookForm(undefined, selectObject);
     }
   });

diff --git a/app/javascript/src/utils/requiredField.js b/app/javascript/src/utils/requiredField.js
@@ -5,7 +5,6 @@ const asterisk = `<span class="red" title="${getConstant('REQUIRED_FIELD_TEXT')}
 
 export const addAsterisk = (el) => {
   const target = $(el);
-  console.log('Target Element:', target);
   if (isObject(target)) {
     // If the element is part of a Fieldset then place the asterisk before the <fieldset><legend>
     if (target.closest('fieldset').length > 0 && target.closest('fieldset').find('legend').length > 0) {

diff --git a/app/views/org_admin/conditions/_add.html.erb b/app/views/org_admin/conditions/_add.html.erb
@@ -1,5 +1,5 @@
 <div class="row">
-  <div class="col-md-12">
+  <div class="col-md-12 mt-2">
     <%= link_to _('Add condition'), new_org_admin_question_condition_path(question_id: question.id, condition_no: condition_no), remote: true, class: "add-condition" %> 
   </div>
 </div>
diff --git a/app/views/org_admin/conditions/_container.html.erb b/app/views/org_admin/conditions/_container.html.erb
@@ -1,13 +1,13 @@
 <div id="condition-container">
-  <div class="condition-list" data-loaded="false">
+  <div class="condition-list" data-bs-loaded="false">
     <div class="row">
-      <div class="col-md-3 bold">
-        <%= label(:text, _('Option'), class: "form-label")%>
+      <div class="col-md-3 mb-2 bold">
+        <%= label(:text, _('Option'), class: "control-label")%>
       </div>
-      <div class="col-md-3">
-        <%= label(:text, _('Action'), class: "form-label") %>
+      <div class="col-md-3 mb-2">
+        <%= label(:text, _('Action'), class: "control-label") %>
       </div>
-      <div class="col-md-3 bold">
+      <div class="col-md-3 mb-2 bold">
         <%= _('Remove')%>
       </div>
       <div class="col-md-3">

diff --git a/app/views/org_admin/conditions/_form.html.erb b/app/views/org_admin/conditions/_form.html.erb
@@ -1,4 +1,4 @@
-<div class="row condition-partial">
+<div class="row condition-partial mb-3">
   <%
    action_type_arr = [["removes", :remove], ["adds notification", :add_webhook]]
    name_start = "conditions[]condition_" + condition_no.to_s
@@ -10,16 +10,16 @@
       grouped_options_for_select(remove_question_collection)
     multiple = (question.question_format.multiselectbox? || question.question_format.checkbox?)
   %>
-  <div class="col-md-3">
+  <div class="col-md-3 pe-2">
     <%= select_tag(:question_option, options_from_collection_for_select(question.question_options.sort_by(&:number), "id", "text",
-        condition_exists ? condition[:question_option_id] : question.question_options.sort_by(&:number)[0]), {class: 'selectpicker regular', 'data-style': 'bg-white px-4 py-3', multiple: multiple, name: name_start + "[question_option][]"}) %>
+        condition_exists ? condition[:question_option_id] : question.question_options.sort_by(&:number)[0]), {class: 'form-select regular', 'data-bs-style': 'dropdown-toggle bg-white px-4 py-3', name: name_start + "[question_option][]"}) %>
   </div>
-  <div class="col-md-3">
-    <%= select_tag(:action_type, options_for_select(action_type_arr, type_default), {name: name_start + "[action_type]", class: 'action-type selectpicker narrow', 'data-style': 'bg-white px-4 py-3'}) %>
+  <div class="col-md-3 pe-2">
+    <%= select_tag(:action_type, options_for_select(action_type_arr, type_default), {name: name_start + "[action_type]", class: 'action-type form-select narrow', 'data-bs-style': 'dropdown-toggle bg-white px-4 py-3'}) %>
   </div>
-  <div class="col-md-3">
+  <div class="col-md-3 pe-2">
     <div class="remove-dropdown">
-      <%= select_tag(:remove_question_id, remove_question_group, {name: name_start + "[remove_question_id][]", class: 'selectpicker regular', multiple: true, 'data-style': 'bg-white px-4 py-3'}) %>
+      <%= select_tag(:remove_question_id, remove_question_group, {name: name_start + "[remove_question_id][]", class: 'form-select regular', multiple: true, 'data-bs-style': 'dropdown-toggle bg-white px-4 py-3'}) %>
     </div>
     <div class="webhook-replacement display-off my-auto text-center">
       <%= link_to _('Edit email'), '#' %>

diff --git a/app/views/org_admin/conditions/_webhook_form.html.erb b/app/views/org_admin/conditions/_webhook_form.html.erb
@@ -1,6 +1,6 @@
 <div class="modal fade" id= "<%= condition_no %>modalContactForm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
   aria-hidden="true">
-  <div class="modal-dialog" role="document">
+  <div class="modal-dialog">
     <div class="modal-content">
       <div class="modal-header text-center">
         <h4 class="modal-title w-100 font-weight-bold"><%= _('Send email') %></h4>

diff --git a/app/views/org_admin/phases/preview.html.erb b/app/views/org_admin/phases/preview.html.erb
@@ -34,8 +34,8 @@
 <div class="row">
   <div class="col-md-12">
     <ul class="nav nav-tabs" role="tablist">
-      <li role="presentation" class="active">
-        <%= link_to _('Write plan'), '#', class: 'preview-tab' %>
+      <li role="presentation" class=" nav-item active">
+        <%= link_to _('Write plan'), '#', class: 'nav-link preview-tab' %>
       </li>
     </ul>
 

diff --git a/app/views/org_admin/question_options/_option_fields.html.erb b/app/views/org_admin/question_options/_option_fields.html.erb
@@ -1,11 +1,11 @@
 <div class="row">
-  <div class="col-md-3 bold">
+  <div class="col-md-3 bold mb-2">
     <%= _('Order')%>
   </div>
-  <div class="col-md-3">
+  <div class="col-md-3 mb-2">
     <%= f.label(:text, _('Text'), class: "form-label") %>
   </div>
-  <div class="col-md-3 bold">
+  <div class="col-md-3 bold mb-2">
     <%= _('Default')%>
   </div>
   <div class="col-md-3">
@@ -20,18 +20,18 @@
   <%= f.fields_for :question_options, options_q do |op| %>
     <% i = i + 1 %>
     <% options_q.number = i %>
-    <div class="row" data-attribute="question_option">
-      <div class="col-md-3">
+    <div class="row mb-2" data-attribute="question_option">
+      <div class="col-md-3 pe-2">
         <%= op.number_field :number, min: 1, class: 'form-control', readonly: true %>
       </div>
-      <div class="col-md-3">
+      <div class="col-md-3 pe-2">
         <% if i == 1 %>
           <%= op.text_field :text, as: :string, class: 'form-control', spellcheck: true, 'aria-required': true %>
         <% else %>
           <%= op.text_field :text, as: :string, class: 'form-control', spellcheck: true %>
         <% end %>
       </div>
-      <div class="col-md-3">
+      <div class="col-md-3 pe-2">
         <%= op.check_box :is_default %>
       </div>
       <% if i > 1 %>
@@ -44,7 +44,7 @@
   <% end %>
 <% end %>
 <div class="row">
-  <div class="col-md-12">
+  <div class="col-md-12 mt-2">
     <a href="#" class="new_question_option"><%= _('Add option') %></a>
   </div>
 </div>
diff --git a/app/views/paginable/contributors/_index.html.erb b/app/views/paginable/contributors/_index.html.erb
@@ -50,12 +50,14 @@
                 <%= _('Actions') %><span class="caret"></span>
               </button>
               <ul class="dropdown-menu" aria-labelledby="contributor-<%= contributor.id %>-actions">
-                <li><%= link_to _('Edit'),
-                        edit_plan_contributor_path(plan_id: @plan.id, id: contributor) %></li>
-                <li><%= link_to _('Remove'),
+                <li class="nav-item"><%= link_to _('Edit'),
+                        edit_plan_contributor_path(plan_id: @plan.id, id: contributor),
+                        class: 'dropdown-item nav-link px-3' %></li>
+                <li class="nav-item"><%= link_to _('Remove'),
                                 plan_contributor_path(@plan.id, contributor),
                                 data: { confirm: _("You are about to delete '%{contributor_name}'. Are you sure?") % { contributor_name: contributor.name } },
-                                method: :delete %>
+                                method: :delete,
+                                class: 'dropdown-item nav-link px-3' %>
                 </li>
               </ul>
             </div>

diff --git a/app/views/paginable/guidance_groups/_index.html.erb b/app/views/paginable/guidance_groups/_index.html.erb
@@ -46,14 +46,14 @@
                 <%= _('Actions') %><span class="caret"></span>
               </button>
               <ul class="dropdown-menu" aria-labelledby="guidance_group-<%= guidance_gr.id %>-actions">
-                <li><%= link_to _('Edit'), admin_edit_guidance_group_path(guidance_gr) %></li>
+                <li class="nav-item"><%= link_to _('Edit'), admin_edit_guidance_group_path(guidance_gr), class:'nav-link dropdown-item px-3' %></li>
                 <% if guidance_gr.published? %>
-                    <li><%= link_to _('Unpublish'),  admin_update_unpublish_guidance_group_path(guidance_gr), method: :put %></li>
+                    <li class="nav-item"><%= link_to _('Unpublish'),  admin_update_unpublish_guidance_group_path(guidance_gr), method: :put, class:'nav-link dropdown-item px-3' %></li>
                 <% else %>
-                    <li><%= link_to _('Publish'),  admin_update_publish_guidance_group_path(guidance_gr), method: :put %></li>
+                    <li class="nav-item"><%= link_to _('Publish'),  admin_update_publish_guidance_group_path(guidance_gr), method: :put, class:'nav-link dropdown-item px-3' %></li>
                 <% end %>
                 <% if allow_delete %>
-                  <li><%= link_to _('Remove'), admin_destroy_guidance_group_path(guidance_gr), data: {confirm: _("You are about to delete '%{guidance_group_name}'. This will affect guidance. Are you sure?") % { :guidance_group_name => guidance_gr.name }}, method: :delete %></li>
+                  <li class="nav-item"><%= link_to _('Remove'), admin_destroy_guidance_group_path(guidance_gr), data: {confirm: _("You are about to delete '%{guidance_group_name}'. This will affect guidance. Are you sure?") % { :guidance_group_name => guidance_gr.name }}, method: :delete, class:'nav-link dropdown-item px-3' %></li>
                 <% end %>
               </ul>
             </div>

diff --git a/app/views/paginable/guidances/_index.html.erb b/app/views/paginable/guidances/_index.html.erb
@@ -51,15 +51,15 @@
                   <%= _('Actions') %><span class="caret"></span>
                 </button>
                 <ul class="dropdown-menu" aria-labelledby="guidance-<%= guidance.id %>-actions">
-                  <li><%= link_to _('Edit'), admin_edit_guidance_path(guidance) %></li>
+                  <li class="nav-item"><%= link_to _('Edit'), admin_edit_guidance_path(guidance), class:'nav-link dropdown-item px-3' %></li>
                   <!-- If the guidance has never been published or it has changed -->
                   <% if guidance.published? %>
-                    <li><%= link_to _('Unpublish'), admin_unpublish_guidance_path(guidance), method: :put %></li>
+                    <li class="nav-item"><%= link_to _('Unpublish'), admin_unpublish_guidance_path(guidance), method: :put, class:'nav-link dropdown-item px-3' %></li>
                   <% else %>
-                    <li><%= link_to _('Publish'), admin_publish_guidance_path(guidance), method: :put %></li>
+                    <li class="nav-item"><%= link_to _('Publish'), admin_publish_guidance_path(guidance), method: :put, class:'nav-link dropdown-item px-3' %></li>
                   <% end %>
-                  <li><%= link_to _('Remove'), admin_destroy_guidance_path(guidance),
-                  data: {confirm: _("You are about to delete '%{guidance_summary}'. Are you sure?") % { :guidance_summary => truncate(sanitize(guidance.text,tags: %w(br a)), length: 20 , omission: _('... (continued)'))} }, method: :delete %>
+                  <li class="nav-item"><%= link_to _('Remove'), admin_destroy_guidance_path(guidance),
+                  data: {confirm: _("You are about to delete '%{guidance_summary}'. Are you sure?") % { :guidance_summary => truncate(sanitize(guidance.text,tags: %w(br a)), length: 20 , omission: _('... (continued)'))} }, method: :delete, class:'nav-link dropdown-item px-3' %>
                   </li>
                 </ul>
               </div>

diff --git a/app/views/paginable/templates/_customisable.html.erb b/app/views/paginable/templates/_customisable.html.erb
@@ -25,14 +25,14 @@
             <% if customization.upgrade_customization? %>
               <% tooltip = _("Select 'Transfer customisation' in the Actions menu to review your customisation(s) and make any necessary changes. When you are done, you must return to the Actions menu and publish your customisation(s).") %>
               <%= _('Original funder template has changed!') %><em class="sr-only"><%= tooltip %></em>
-              &nbsp;&nbsp;<i class="fas fa-copy red" aria-hidden="true" data-toggle="tooltip" title="<%= tooltip %>"></i>
+              &nbsp;&nbsp;<i class="fas fa-copy red" aria-hidden="true" data-bs-toggle="tooltip" title="<%= tooltip %>"></i>
             <% else %>
               <% if customization.published? %>
                 <%= _('Published') %>
               <% elsif customization.draft? %>
                 <% tooltip = _('You have unpublished changes! Select "Publish changes" in the Actions menu when you are ready to make them available to users.') %>
                 <%= _('Published') %> <em class="sr-only"><%= tooltip %></em>
-              &nbsp;&nbsp;<i class="fas fa-pen-to-square red" aria-hidden="true" data-toggle="tooltip" title="<%= tooltip %>"></i>
+              &nbsp;&nbsp;<i class="fas fa-pen-to-square red" aria-hidden="true" data-bs-toggle="tooltip" title="<%= tooltip %>"></i>
               <% else %>
                 <%= _('Unpublished') %>
               <% end %>
@@ -51,7 +51,7 @@
               <%= _('Actions') %><span class="caret"></span>
             </button>
             <ul class="dropdown-menu">
-              <li><%= link_to_customizable_template "", customization, template, 'nav-link dropdown-item px-3' %></li>
+              <li><%= link_to_customizable_template "", customization, template %></li>
               <% if customization.present? && customization.created_at >= template.created_at %>
                 <li><%= link_to _('History'), history_org_admin_template_path(customization.id), class: 'nav-link dropdown-item px-3' %></li>
                 <% if customization.draft? || customization.published? %>

diff --git a/app/views/phases/_guidances_notes.html.erb b/app/views/phases/_guidances_notes.html.erb
@@ -13,7 +13,7 @@
     <% end %>
     <% if plan.present? %>
       <li role="presentation" class="nav-item">
-        <a class="nav-link<%= 'active' if !guidances_active %>" href="#notes-<%= question.id %>" aria-controls="notes-<%= question.id %>" role="tab" data-bs-toggle="pill">
+        <a class="nav-link <%= 'active' if !guidances_active %>" href="#notes-<%= question.id %>" aria-controls="notes-<%= question.id %>" role="tab" data-bs-toggle="pill">
           <span id="notes-title-<%= question.id %>">
             <%= render partial: '/notes/title', locals: { answer: answer } %>
           </span>

diff --git a/app/views/plans/new.html.erb b/app/views/plans/new.html.erb
@@ -22,7 +22,7 @@
       <!-- Plan name section -->
       <h2 id="project-title"><span class="red" title="<%= required_project_title_tooltip %>">*<em class="sr-only"><%= required_project_title_tooltip %></em> </span><%= _('What research project are you planning?') %></h2>
       <div class="row">
-        <div class="form-control mb-3 col-md-6">
+        <div class="form-control mb-3 col-md-8">
           <em class="sr-only"><%= project_title_tooltip %></em>
           <%= f.text_field(:title, class: 'form-control', 'aria-labelledby': 'project-title', 'aria-required': 'true', 'aria-label': 'project-title',
                 'data-toggle': 'tooltip',
@@ -31,8 +31,8 @@
                 title: project_title_tooltip ) %>
         </div>
         <div class="form-control mb-3 col-md-6">
-          <div class="form-check">
-            <%= label_tag :is_test, class:'form-check-label' do %>
+          <div class="checkbox">
+            <%= label_tag(:is_test) do %>
               <%= check_box_tag(:is_test, "1", false) %>
               <%= _('mock project for testing, practice, or educational purposes') %>
             <% end %>
@@ -60,11 +60,11 @@
                         } %>
           <% end %>
         </div>
-        <div class="col-md-1 text-center"><strong>- <%= _('or') %> -</strong></div>
-        <div class="form-control mb-3 col-md-5">
+        <div class="col-md-3 text-center"><strong>- <%= _('or') %> -</strong></div>
+        <div class="form-control mb-3 col-md-3">
           <div class="form-check">
             <% primary_research_org_message = _('No research organisation associated with this plan or my research organisation is not listed') %>
-            <%= label_tag :plan_no_org, class:'form-check-label' do %>
+            <%= label_tag(:plan_no_org) do %>
               <%= check_box_tag(:plan_no_org, "0", false, class: "toggle-autocomplete") %>
               <%= primary_research_org_message %>
             <% end %>
@@ -89,11 +89,11 @@
                         } %>
           <% end %>
         </div>
-        <div class="col-md-1"><strong>- <%= _('or') %> -</strong></div>
-        <div class="form-control mb-3 col-md-5">
+        <div class="col-md-3 text-center"><strong>- <%= _('or') %> -</strong></div>
+        <div class="form-control mb-3 col-md-3">
           <div class="form-check">
             <% primary_funding_message = _('No funder associated with this plan or my funder is not listed') %>
-            <%= label_tag :plan_no_funder, class:'form-check-label' do %>
+            <%= label_tag(:plan_no_funder) do %>
               <%= check_box_tag(:plan_no_funder, "0", false, class: "toggle-autocomplete") %>
               <%= primary_funding_message %>
             <% end %>

diff --git a/app/views/super_admin/notifications/index.html.erb b/app/views/super_admin/notifications/index.html.erb
@@ -1,14 +1,15 @@
 <% title _('Notifications') %>
 <div class="row">
-  <div class="col-xs-12">
+  <div class="col-sm-9">
     <h1 class="fontsize-h2"><%= _('Notifications') %></h1>
   </div>
+      <div class="col-sm-3">
+      <%= link_to _('+ Add New Notification'), new_super_admin_notification_path, class: 'btn btn-default float-end', role: 'button' %>
+    </div>
 </div>
+
 <div class="row">
   <div class="col-xs-12">
-    <div class="float-end">
-      <%= link_to _('+ Add New Notification'), new_super_admin_notification_path, class: 'btn btn-secondary', role: 'button' %>
-    </div>
     <div class="table-responsive">
       <%= paginable_renderise(
         partial: '/paginable/notifications/index',