diff --git a/apps/dashboard/Gemfile b/apps/dashboard/Gemfile index 987a507b61..b356097bcc 100644 --- a/apps/dashboard/Gemfile +++ b/apps/dashboard/Gemfile @@ -49,7 +49,7 @@ gem 'dotenv-rails', '~> 2.1' gem 'redcarpet', '~> 3.3' gem 'browser', '~> 2.2' gem 'addressable', '~> 2.4' -gem 'bootstrap_form', '~> 4.0' +gem 'bootstrap_form', '5.0' gem 'mocha', '~> 2.1', group: :test gem 'autoprefixer-rails', '~> 10.2.5' gem 'dotiw' diff --git a/apps/dashboard/Gemfile.lock b/apps/dashboard/Gemfile.lock index 0083fe4863..af3e539959 100644 --- a/apps/dashboard/Gemfile.lock +++ b/apps/dashboard/Gemfile.lock @@ -71,7 +71,7 @@ GEM autoprefixer-rails (10.2.5.1) execjs (> 0) base64 (0.2.0) - bootstrap_form (4.5.0) + bootstrap_form (5.0.0) actionpack (>= 5.2) activemodel (>= 5.2) browser (2.7.1) @@ -118,7 +118,7 @@ GEM http-accept (1.7.0) http-cookie (1.0.5) domain_name (~> 0.5) - i18n (1.14.4) + i18n (1.14.5) concurrent-ruby (~> 1.0) jbuilder (2.11.5) actionview (>= 5.0.0) @@ -147,8 +147,8 @@ GEM mime-types-data (~> 3.2015) mime-types-data (3.2024.0305) mini_mime (1.1.5) - mini_portile2 (2.8.5) - minitest (5.22.3) + mini_portile2 (2.8.6) + minitest (5.23.0) mocha (2.1.0) ruby2_keywords (>= 0.0.5) multi_json (1.15.0) @@ -291,7 +291,7 @@ PLATFORMS DEPENDENCIES addressable (~> 2.4) autoprefixer-rails (~> 10.2.5) - bootstrap_form (~> 4.0) + bootstrap_form (= 5.0) browser (~> 2.2) byebug capybara diff --git a/apps/dashboard/app/assets/stylesheets/_variables.scss b/apps/dashboard/app/assets/stylesheets/_variables.scss index b9243791bb..17c7abfbc3 100644 --- a/apps/dashboard/app/assets/stylesheets/_variables.scss +++ b/apps/dashboard/app/assets/stylesheets/_variables.scss @@ -1,5 +1,5 @@ -// Place all Bootstrap 4 variable overrides in this file. -// Bootstrap 4 SASS variables list: https://github.com/twbs/bootstrap/blob/v4.6.0/scss/_variables.scss +// Place all Bootstrap 5 variable overrides in this file. +// Bootstrap 5 SASS variables list: https://github.com/twbs/bootstrap/blob/v5.0.2/scss/_variables.scss // Miscellaneous $enable-responsive-font-sizes: "true"; @@ -10,11 +10,16 @@ $blue: rgb(51, 122, 183); $green: #5cb85c; $body-color: rgb(51, 51, 51); -// see https://getbootstrap.com/docs/4.0/getting-started/theming/#modify-map +// see https://getbootstrap.com/docs/5.0/customize/sass/#modify-map $theme-colors: ( "primary": $blue, "success": $green, - "danger": #d9534f + "danger": #d9534f, + "secondary": #6c757d, + "info": #0dcaf0, + "warning": #ffc107, + "light": #f8f9fa, + "dark": #212529 ); // NOTE: bootstrap 3 info color was not teal but #5bc0de @@ -60,6 +65,9 @@ $navbar-nav-link-padding-x: 0.75rem; // breadcrumbs are purely visual for accessibility $breadcrumb-divider: ''; +$breadcrumb-bg: #e9ecef; +$breadcrumb-padding-y: 0.75rem; +$breadcrumb-padding-x: 1rem; // files get copied during 'yarn build' in esbuild.config.js -$fa-font-path: "../builds"; +$fa-font-path: "../builds"; \ No newline at end of file diff --git a/apps/dashboard/app/assets/stylesheets/application.scss b/apps/dashboard/app/assets/stylesheets/application.scss index 4d37e6d0b7..a022ebd674 100644 --- a/apps/dashboard/app/assets/stylesheets/application.scss +++ b/apps/dashboard/app/assets/stylesheets/application.scss @@ -123,7 +123,7 @@ pre.motd-monospaced { **/ pre:not(#editor) { - @extend .bg-light; + @extend .bg-light !optional; @extend .p-2; @extend .rounded; } diff --git a/apps/dashboard/app/assets/stylesheets/custom.scss b/apps/dashboard/app/assets/stylesheets/custom.scss index 68624f22dd..2bf302c4ad 100644 --- a/apps/dashboard/app/assets/stylesheets/custom.scss +++ b/apps/dashboard/app/assets/stylesheets/custom.scss @@ -6,6 +6,12 @@ } } +.breadcrumb-item { + a { + text-decoration: none !important; + } +} + .card-header h3 { font-size: 16px; font-weight: bold; diff --git a/apps/dashboard/app/assets/stylesheets/data_tables.scss b/apps/dashboard/app/assets/stylesheets/data_tables.scss index 16258f4111..54c1ae1fa8 100644 --- a/apps/dashboard/app/assets/stylesheets/data_tables.scss +++ b/apps/dashboard/app/assets/stylesheets/data_tables.scss @@ -27,4 +27,8 @@ table.dataTable th[aria-sort="ascending"] span::after { color: currentcolor; font-size: 100%; top: 0; +} + +table.dataTable td a { + text-decoration: none; } \ No newline at end of file diff --git a/apps/dashboard/app/helpers/batch_connect/session_contexts_helper.rb b/apps/dashboard/app/helpers/batch_connect/session_contexts_helper.rb index 180aeffb4a..daf23edc33 100644 --- a/apps/dashboard/app/helpers/batch_connect/session_contexts_helper.rb +++ b/apps/dashboard/app/helpers/batch_connect/session_contexts_helper.rb @@ -41,7 +41,7 @@ def create_widget(form, attrib, format: nil, hide_excludable: true, hide_fixed: end def resolution_field(form, id, opts = {}) - content_tag(:div, id: "#{id}_group", class: "form-group") do + content_tag(:div, id: "#{id}_group", class: "mb3") do concat form.label(id, opts[:label]) concat form.hidden_field(id, id: "#{id}_field") concat( diff --git a/apps/dashboard/app/helpers/batch_connect/sessions_helper.rb b/apps/dashboard/app/helpers/batch_connect/sessions_helper.rb index 3e822243ba..5d51415876 100644 --- a/apps/dashboard/app/helpers/batch_connect/sessions_helper.rb +++ b/apps/dashboard/app/helpers/batch_connect/sessions_helper.rb @@ -136,7 +136,7 @@ def delete(session) button_to( batch_connect_session_path(session.id), method: :delete, - class: "btn btn-danger float-right btn-delete", + class: "btn btn-danger float-end btn-delete", title: title, 'aria-label': title, data: { confirm: t('dashboard.batch_connect_sessions_delete_confirm'), toggle: "tooltip", placement: "bottom"} @@ -150,7 +150,7 @@ def cancel(session) button_to( batch_connect_cancel_session_path(session.id), method: :post, - class: "btn btn-danger float-right btn-cancel", + class: "btn btn-danger float-end btn-cancel", title: title, 'aria-label': title, data: { confirm: t('dashboard.batch_connect_sessions_cancel_confirm'), toggle: "tooltip", placement: "bottom" } diff --git a/apps/dashboard/app/javascript/active_jobs.js b/apps/dashboard/app/javascript/active_jobs.js index 6b65a644cc..91387b98ba 100644 --- a/apps/dashboard/app/javascript/active_jobs.js +++ b/apps/dashboard/app/javascript/active_jobs.js @@ -222,7 +222,7 @@ function create_datatable(options){ }, { data: "walltime_used", - className: "text-right", + className: "text-end", "autoWidth": true, render: function (data, type, _row, _meta) { if(type === 'display' || type === 'filter') { diff --git a/apps/dashboard/app/javascript/application.js b/apps/dashboard/app/javascript/application.js index 416528b65a..6a1db6e4c3 100644 --- a/apps/dashboard/app/javascript/application.js +++ b/apps/dashboard/app/javascript/application.js @@ -23,10 +23,10 @@ import 'datatables.net-plugins/api/processing().mjs'; import Rails from '@rails/ujs'; -// Import popper.js for Bootstrap 4 -import Popper from 'popper.js'; +// Import @popperjs/core for Bootstrap 5 +import { createPopper } from '@popperjs/core'; -// Import Bootstrap 4 +// Import Bootstrap 5 import 'bootstrap/dist/js/bootstrap'; // FIXME: confim modals don't work in esbuild. diff --git a/apps/dashboard/app/javascript/dynamic_forms.js b/apps/dashboard/app/javascript/dynamic_forms.js index 90890aaa1c..c550054713 100644 --- a/apps/dashboard/app/javascript/dynamic_forms.js +++ b/apps/dashboard/app/javascript/dynamic_forms.js @@ -416,9 +416,17 @@ function updateVisibility(event, changeId) { const val = valueFromEvent(event); const id = event.target['id']; let changeElement = undefined; + $(`#${changeId}`).parents().each(function(_i, parent) { - if(parent.classList.contains('form-group')) { - changeElement = $(parent); + var classListValues = parent.classList.values(); + for (const val of classListValues) { + // TODO: Using 'mb-3' here because 'form-group' was removed + // from Bootstrap 5 and replaced with 'mb-3' - however, this + // is a grid class which could (??) apply to parent elements + // in unpredictable parts of the chain - test for & resolve + if (val.match('mb-3')) { + changeElement = $(parent); + } } }); diff --git a/apps/dashboard/app/javascript/files/data_table.js b/apps/dashboard/app/javascript/files/data_table.js index dda7f291a3..38df5f6659 100644 --- a/apps/dashboard/app/javascript/files/data_table.js +++ b/apps/dashboard/app/javascript/files/data_table.js @@ -205,7 +205,7 @@ class DataTable { // // put breadcrmbs below filter!!! dom: "<'row'<'col-sm-12'f>>" + // normally <'row'<'col-sm-6'l><'col-sm-6'f>> but we disabled pagination so l is not needed (dropdown for selecting # rows) - "<'row'<'col-sm-12'<'dt-status-bar'<'datatables-status float-right'><'transfers-status'>>>>" + + "<'row'<'col-sm-12'<'dt-status-bar'<'datatables-status float-end'><'transfers-status'>>>>" + "<'row'<'col-sm-12'tr>>", // normally this is <'row'<'col-sm-5'i><'col-sm-7'p>> but we disabled pagination so have info take whole row columns: [ { diff --git a/apps/dashboard/app/javascript/path_selector/path_selector_data_table.js b/apps/dashboard/app/javascript/path_selector/path_selector_data_table.js index 1811918d01..cc9d550c44 100644 --- a/apps/dashboard/app/javascript/path_selector/path_selector_data_table.js +++ b/apps/dashboard/app/javascript/path_selector/path_selector_data_table.js @@ -56,7 +56,7 @@ export class PathSelectorTable { // // put breadcrumbs below filter!!! dom: "<'row'<'col-sm-12'f>>" + // normally <'row'<'col-sm-6'l><'col-sm-6'f>> but we disabled pagination so l is not needed (dropdown for selecting # rows) - "<'row'<'col-sm-12'<'dt-status-bar'<'datatables-status float-right'><'transfers-status'>>>>" + + "<'row'<'col-sm-12'<'dt-status-bar'<'datatables-status float-end'><'transfers-status'>>>>" + "<'row'<'col-sm-12'tr>>", // normally this is <'row'<'col-sm-5'i><'col-sm-7'p>> but we disabled pagination so have info take whole row columns: [ { diff --git a/apps/dashboard/app/javascript/products_show.js b/apps/dashboard/app/javascript/products_show.js index 773b110c8c..a4c2c8e44e 100644 --- a/apps/dashboard/app/javascript/products_show.js +++ b/apps/dashboard/app/javascript/products_show.js @@ -4,7 +4,7 @@ const id = 'product_cli_modal'; const spinnerId = `${id}_spinner`; const headerId = `${id}_header`; const buttonId = `${id}_button`; -const closeButton = ``; +const closeButton = ``; jQuery(function(){ $('[data-toggle="cli"]').on('click', (event) => updateModal(event)); @@ -43,7 +43,7 @@ function updateModal(event){ xhr.onloadend = function() { $(`#${spinnerId}`).replaceWith(` - + `); if (this.status != 200) { $(`#${id} .product-cli-body`).html(`${header}A fatal error has occurred`); diff --git a/apps/dashboard/app/javascript/projects.js b/apps/dashboard/app/javascript/projects.js index 28f1966f60..62bafb6172 100644 --- a/apps/dashboard/app/javascript/projects.js +++ b/apps/dashboard/app/javascript/projects.js @@ -7,7 +7,7 @@ jQuery(function() { pollForJobInfo(ele); }); - $("[data-toggle='project']").each((_index, ele) => { + $("[data-bs-toggle='project']").each((_index, ele) => { updateProjectSize(ele); }); }); @@ -50,7 +50,7 @@ function pollForJobInfo(element) { function jobInfoDiv(jobId, state, stateTitle='', stateDescription='') { return `
- ${jobId} + ${jobId} ${state.toUpperCase()} ${stateDescription}
`; diff --git a/apps/dashboard/app/views/active_jobs/_extended_panel.html.erb b/apps/dashboard/app/views/active_jobs/_extended_panel.html.erb index 52024f7420..33b5ee7302 100644 --- a/apps/dashboard/app/views/active_jobs/_extended_panel.html.erb +++ b/apps/dashboard/app/views/active_jobs/_extended_panel.html.erb @@ -3,13 +3,13 @@ <%= data.error %> <% else %> -
+
<%# FIXME: ul/li with css %> <%= data.status %> - <%= data.jobname %> - <%= data.pbsid %> + <%= data.jobname %> + <%= data.pbsid %>
diff --git a/apps/dashboard/app/views/active_jobs/_job_details_node_view.html.erb b/apps/dashboard/app/views/active_jobs/_job_details_node_view.html.erb index 55d5b1ff09..d78d857430 100755 --- a/apps/dashboard/app/views/active_jobs/_job_details_node_view.html.erb +++ b/apps/dashboard/app/views/active_jobs/_job_details_node_view.html.erb @@ -1,9 +1,9 @@ <% if has_ganglia(data.cluster) || has_grafana(data.cluster) %> -
+
<% if has_ganglia(data.cluster) %> -
Node: <%= node %> Job: <%= data.pbsid %>
+
Node: <%= node %> Job: <%= data.pbsid %>
<%= link_to image_tag( build_ganglia_link(data.cluster, data.starttime, 'cpu_report', node, 'small'), class:"img-responsive col-lg-auto col-md-auto col-sm-auto col-xs-auto" ), build_ganglia_link(data.cluster, data.starttime, 'cpu_report', node, 'large'), data: { lightbox: "cpu-report", title: "CPU Report " + node } %> @@ -14,8 +14,8 @@ <% elsif has_grafana(data.cluster) %>
Node: <%= node %> - Job: <%= data.pbsid %> - + Job: <%= data.pbsid %> + Detailed Metrics diff --git a/apps/dashboard/app/views/active_jobs/index.html.erb b/apps/dashboard/app/views/active_jobs/index.html.erb index 19f556f002..5fe1e60755 100644 --- a/apps/dashboard/app/views/active_jobs/index.html.erb +++ b/apps/dashboard/app/views/active_jobs/index.html.erb @@ -1,8 +1,8 @@
-
+
-
    @@ -16,7 +16,7 @@
-
    diff --git a/apps/dashboard/app/views/apps/_app_group_rows.html.erb b/apps/dashboard/app/views/apps/_app_group_rows.html.erb index 87b490d240..d384168b7c 100644 --- a/apps/dashboard/app/views/apps/_app_group_rows.html.erb +++ b/apps/dashboard/app/views/apps/_app_group_rows.html.erb @@ -7,15 +7,15 @@ Files <% end %> -
- <%= tag.div app.caption, class: "text-muted float-right" if caption_app?(app) %> + <%= tag.div app.caption, class: "text-muted float-end" if caption_app?(app) %> <%= app.category %> <%= app.subcategory %> @@ -28,7 +28,7 @@ <%= render partial: "link", locals: { link: link } %> - <%= tag.div link.caption, class: "text-muted float-right" if caption_app?(app) %> + <%= tag.div link.caption, class: "text-muted float-end" if caption_app?(app) %> <%= app.category %> <%= app.subcategory %> diff --git a/apps/dashboard/app/views/batch_connect/session_contexts/_file_attachments.html.erb b/apps/dashboard/app/views/batch_connect/session_contexts/_file_attachments.html.erb index a068933751..c2a9ed7198 100644 --- a/apps/dashboard/app/views/batch_connect/session_contexts/_file_attachments.html.erb +++ b/apps/dashboard/app/views/batch_connect/session_contexts/_file_attachments.html.erb @@ -1,7 +1,7 @@ <% has_error = !form.object.errors[attrib.id].empty? %>
-

">Click the box to attach a file. Screenshots or other files can help troubleshoot your problem.

+

">Click the box to attach a file. Screenshots or other files can help troubleshoot your problem.

<% if has_error %>

<%= form.object.errors[attrib.id].join(", ") %>

@@ -9,5 +9,5 @@ <% end %>
-

Add attachment

+

Add attachment

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 index ba77f6435c..f092818bc8 100644 --- a/apps/dashboard/app/views/batch_connect/session_contexts/_form.html.erb +++ b/apps/dashboard/app/views/batch_connect/session_contexts/_form.html.erb @@ -7,14 +7,14 @@ <% end %> <%- if Configuration.bc_saved_settings? -%> -
+
>
-
- - <%= f.submit t('dashboard.batch_connect_form_save_submit'), id: 'batch_connect_session_save_template_submit', class: "ml-auto btn btn-primary", formaction: batch_connect_save_settings_path(token: @app.token), disabled: @template_name ? false : true %> +
+ + <%= f.submit t('dashboard.batch_connect_form_save_submit'), id: 'batch_connect_session_save_template_submit', class: "ms-auto btn btn-primary", formaction: batch_connect_save_settings_path(token: @app.token), disabled: @template_name ? false : true %>
<%- end -%> diff --git a/apps/dashboard/app/views/batch_connect/session_contexts/_path_selector.html.erb b/apps/dashboard/app/views/batch_connect/session_contexts/_path_selector.html.erb index e65b144f94..96598d350a 100644 --- a/apps/dashboard/app/views/batch_connect/session_contexts/_path_selector.html.erb +++ b/apps/dashboard/app/views/batch_connect/session_contexts/_path_selector.html.erb @@ -19,7 +19,7 @@ <%= form.text_field(attrib.id, class: 'form-control', **options) %> - diff --git a/apps/dashboard/app/views/batch_connect/sessions/card/_card_body.html.erb b/apps/dashboard/app/views/batch_connect/sessions/card/_card_body.html.erb index 0d13278eac..94ef42aad5 100644 --- a/apps/dashboard/app/views/batch_connect/sessions/card/_card_body.html.erb +++ b/apps/dashboard/app/views/batch_connect/sessions/card/_card_body.html.erb @@ -1,6 +1,6 @@
-
<%= cancel_or_delete(session) %>
+
<%= cancel_or_delete(session) %>
<%= render_card_partial('host', session) %> <%= render_card_partial('created', session) %> <%= render_card_partial('session_time', session) %> diff --git a/apps/dashboard/app/views/batch_connect/sessions/card/_card_header.html.erb b/apps/dashboard/app/views/batch_connect/sessions/card/_card_header.html.erb index b6820ee17a..191aac125f 100644 --- a/apps/dashboard/app/views/batch_connect/sessions/card/_card_header.html.erb +++ b/apps/dashboard/app/views/batch_connect/sessions/card/_card_header.html.erb @@ -12,7 +12,7 @@ <%= session.title %> (<%= session.job_id %>) -
+
<%- if session.starting? || session.running? -%> <%= pluralize(num_nodes, "node") %> | diff --git a/apps/dashboard/app/views/batch_connect/sessions/connections/_novnc.html.erb b/apps/dashboard/app/views/batch_connect/sessions/connections/_novnc.html.erb index d6554b36fe..1300dc2e2f 100644 --- a/apps/dashboard/app/views/batch_connect/sessions/connections/_novnc.html.erb +++ b/apps/dashboard/app/views/batch_connect/sessions/connections/_novnc.html.erb @@ -22,5 +22,5 @@ <% end -%> <%= f.submit( t('dashboard.batch_connect_sessions_novnc_launch', app_title: app_title), class: 'btn btn-primary', :formtarget => "_blank") %> - <%= link_to t('dashboard.batch_connect_sessions_novnc_view_only'), novnc_link(connect, view_only: true), class: 'btn btn-light float-right border border-dark', target: '_blank' %> + <%= link_to t('dashboard.batch_connect_sessions_novnc_view_only'), novnc_link(connect, view_only: true), class: 'btn btn-light float-end border border-dark', target: '_blank' %> <% end %> diff --git a/apps/dashboard/app/views/batch_connect/settings/show.html.erb b/apps/dashboard/app/views/batch_connect/settings/show.html.erb index 8efabd13b9..15e1edebe6 100644 --- a/apps/dashboard/app/views/batch_connect/settings/show.html.erb +++ b/apps/dashboard/app/views/batch_connect/settings/show.html.erb @@ -36,7 +36,7 @@ locals: {
-
+
<%= title = t('dashboard.bc_saved_settings.edit_title', settings_name: @settings.name) link_to( @@ -80,7 +80,7 @@ locals: {

<%= @settings.app.title %>

-
+
<% title = t('dashboard.bc_saved_settings.delete_title', settings_name: @settings.name) %> diff --git a/apps/dashboard/app/views/batch_connect/shared/_saved_settings_menu.html.erb b/apps/dashboard/app/views/batch_connect/shared/_saved_settings_menu.html.erb index fbd09f49b3..41fa52171b 100644 --- a/apps/dashboard/app/views/batch_connect/shared/_saved_settings_menu.html.erb +++ b/apps/dashboard/app/views/batch_connect/shared/_saved_settings_menu.html.erb @@ -13,7 +13,7 @@ link = app.link %>

- " aria-expanded="true" aria-controls="<%= "saved-settings-#{index}" %>"> + " aria-expanded="true" aria-controls="<%= "saved-settings-#{index}" %>"> <%= icon_tag(link.icon_uri) unless link.icon_uri.to_s.blank? %> <%= app.title %> diff --git a/apps/dashboard/app/views/files/_breadcrumb.html.erb b/apps/dashboard/app/views/files/_breadcrumb.html.erb index 25bc4eb31f..980ab92f98 100644 --- a/apps/dashboard/app/views/files/_breadcrumb.html.erb +++ b/apps/dashboard/app/views/files/_breadcrumb.html.erb @@ -1,6 +1,6 @@ <% if file_counter == 0 %>

  • - +
    • <% end %> @@ -9,10 +9,10 @@
  • <%= path_segment_with_slash(@filesystem, file.basename.to_s, file_counter, file_count) %>
    • -
  • +
    • -
  • +
    • <% else %> diff --git a/apps/dashboard/app/views/files/_copy_move_popup.html.erb b/apps/dashboard/app/views/files/_copy_move_popup.html.erb index e1038a0da2..d826def386 100755 --- a/apps/dashboard/app/views/files/_copy_move_popup.html.erb +++ b/apps/dashboard/app/views/files/_copy_move_popup.html.erb @@ -15,7 +15,7 @@ {{/each}}
    - +
    {{/if}} diff --git a/apps/dashboard/app/views/files/_default_label_error_messages.html.erb b/apps/dashboard/app/views/files/_default_label_error_messages.html.erb index b7a9a34fb6..f05b10aed3 100755 --- a/apps/dashboard/app/views/files/_default_label_error_messages.html.erb +++ b/apps/dashboard/app/views/files/_default_label_error_messages.html.erb @@ -7,7 +7,7 @@ {{#if error_summary}}