From 2e5495b1967426020fdb66c68d16cdd2c91c38c5 Mon Sep 17 00:00:00 2001
From: Jeff Ohrstrom <johrstrom@osc.edu>
Date: Wed, 4 Sep 2024 14:33:09 -0400
Subject: [PATCH] Uniform alerts (#3769)

Unify alerts to be like Rails flashes instead of modals in an attempt to start to move away from SweetAlert.
---
 apps/dashboard/app/javascript/alert.js        | 33 +++++++++++++++++++
 .../app/javascript/files/sweet_alert.js       |  5 +--
 .../app/views/layouts/application.html.erb    |  2 +-
 apps/dashboard/test/system/files_test.rb      | 20 +++++++++++
 4 files changed, 57 insertions(+), 3 deletions(-)
 create mode 100644 apps/dashboard/app/javascript/alert.js

diff --git a/apps/dashboard/app/javascript/alert.js b/apps/dashboard/app/javascript/alert.js
new file mode 100644
index 0000000000..3817533008
--- /dev/null
+++ b/apps/dashboard/app/javascript/alert.js
@@ -0,0 +1,33 @@
+
+export function alert(message) {
+  const div = alertDiv(message);
+  const main = document.getElementById('main_container');
+  main.prepend(div);
+}
+
+function alertDiv(message) {
+  const span = document.createElement('span');
+  span.innerText = message;
+
+  const div = document.createElement('div');
+  div.classList.add('alert', 'alert-danger', 'alert-dismissible');
+  div.setAttribute('role', 'alert');
+  div.appendChild(span);
+  div.appendChild(closeButton());
+
+  return div;
+}
+
+function closeButton() {
+  const button = document.createElement('button');
+  button.classList.add('btn-close');
+  button.dataset.bsDismiss = 'alert';
+
+  const span = document.createElement('span');
+  span.classList.add('sr-only');
+  span.innerText = 'Close';
+
+  button.appendChild(span);
+
+  return button;
+}
\ No newline at end of file
diff --git a/apps/dashboard/app/javascript/files/sweet_alert.js b/apps/dashboard/app/javascript/files/sweet_alert.js
index b739e1a4d5..13eac0efd3 100644
--- a/apps/dashboard/app/javascript/files/sweet_alert.js
+++ b/apps/dashboard/app/javascript/files/sweet_alert.js
@@ -1,4 +1,5 @@
-import Swal from 'sweetalert2'
+import Swal from 'sweetalert2';
+import { alert } from '../alert';
 import {CONTENTID, EVENTNAME as DATATABLE_EVENTNAME} from './data_table.js';
 
 export {EVENTNAME};
@@ -16,7 +17,7 @@ let sweetAlert = null;
 jQuery(function() {
   sweetAlert = new SweetAlert();
   $(CONTENTID).on(EVENTNAME.showError, function(e,options) {
-    sweetAlert.alertError(options.title, options.message);
+    alert(options.message);
   });
 
   $(CONTENTID).on(EVENTNAME.showPrompt, function(e,options) {
diff --git a/apps/dashboard/app/views/layouts/application.html.erb b/apps/dashboard/app/views/layouts/application.html.erb
index 217710ab26..531b92fe86 100644
--- a/apps/dashboard/app/views/layouts/application.html.erb
+++ b/apps/dashboard/app/views/layouts/application.html.erb
@@ -61,7 +61,7 @@
     </nav>
   </header>
 
-  <div class="<%= local_assigns[:layout_container_class] || 'container-md' %> content mt-4" role="main">
+  <div id="main_container" class="<%= local_assigns[:layout_container_class] || 'container-md' %> content mt-4" role="main">
 
     <%= render "layouts/announcements" %>
 
diff --git a/apps/dashboard/test/system/files_test.rb b/apps/dashboard/test/system/files_test.rb
index a80451be54..d7f4433152 100644
--- a/apps/dashboard/test/system/files_test.rb
+++ b/apps/dashboard/test/system/files_test.rb
@@ -655,4 +655,24 @@ def setup
 
     assert_equal(expected_links, null_links)
   end
+
+  test 'allowlist errors flash' do
+    with_modified_env({ OOD_ALLOWLIST_PATH: Rails.root.to_s }) do
+      visit(files_url(Rails.root))
+
+      alerts = all('.alert')
+      assert(alerts.empty?)
+
+      find('#goto-btn').click
+      find('#swal2-input').set('/etc')
+      find('.swal2-confirm').click
+
+      alerts = all('.alert')
+      refute(alerts.empty?)
+      assert_equal(1, alerts.size)
+
+      alert_text = find('.alert > span').text
+      assert_equal('/etc does not have an ancestor directory specified in ALLOWLIST_PATH', alert_text)
+    end
+  end
 end