From 0f46da07b2bca7e8d0fd248b0e474216e9127056 Mon Sep 17 00:00:00 2001
From: David Cook <david@redcliffs.net>
Date: Wed, 6 Dec 2023 09:58:50 +1100
Subject: [PATCH] Render flashes along with table

It doesn't matter where the flash messages appear in the HTML (thanks to fixed positioning), so why not keep it simple and send them with the main response.

preventDefault in case we are inside a form, so the button doesn't submit it.
---
 app/reflexes/application_reflex.rb                  | 7 -------
 app/reflexes/products_reflex.rb                     | 6 +++---
 app/views/admin/products_v3/_table.html.haml        | 1 +
 app/webpacker/controllers/flash_controller.js       | 3 ++-
 app/webpacker/css/admin_v3/components/messages.scss | 1 +
 5 files changed, 7 insertions(+), 11 deletions(-)

diff --git a/app/reflexes/application_reflex.rb b/app/reflexes/application_reflex.rb
index a19b03b543..42981e5361 100644
--- a/app/reflexes/application_reflex.rb
+++ b/app/reflexes/application_reflex.rb
@@ -24,11 +24,4 @@ class ApplicationReflex < StimulusReflex::Reflex
   def morph_admin_flashes
     morph "#flashes", render(partial: "admin/shared/flashes", locals: { flashes: flash })
   end
-
-  def broadcast_admin_flashes
-    cable_ready.replace(
-      selector: "#flashes",
-      html: render(partial: "admin/shared/flashes", locals: { flashes: flash })
-    ).broadcast
-  end
 end
diff --git a/app/reflexes/products_reflex.rb b/app/reflexes/products_reflex.rb
index c040f76f69..4154a7b61f 100644
--- a/app/reflexes/products_reflex.rb
+++ b/app/reflexes/products_reflex.rb
@@ -43,8 +43,7 @@ class ProductsReflex < ApplicationReflex
       @error_counts = { saved: product_set.saved_count, invalid: product_set.invalid.count }
     end
 
-    render_products_form
-    broadcast_admin_flashes if flash.any?
+    render_products_form_with_flash
   end
 
   private
@@ -85,9 +84,10 @@ class ProductsReflex < ApplicationReflex
     morph :nothing
   end
 
-  def render_products_form
+  def render_products_form_with_flash
     locals = { products: @products }
     locals[:error_counts] = @error_counts if @error_counts.present?
+    locals[:flashes] = flash if flash.any?
 
     cable_ready.replace(
       selector: "#products-form",
diff --git a/app/views/admin/products_v3/_table.html.haml b/app/views/admin/products_v3/_table.html.haml
index 519738169c..0462529857 100644
--- a/app/views/admin/products_v3/_table.html.haml
+++ b/app/views/admin/products_v3/_table.html.haml
@@ -4,6 +4,7 @@
                    'data-controller': "bulk-form", 'data-bulk-form-disable-selector-value': "#sort,#filters",
                    'data-bulk-form-error-value': defined?(error_counts),
                   } do |form|
+  = render(partial: "admin/shared/flashes", locals: { flashes: }) if defined? flashes
   %fieldset.form-actions{ class: ("hidden" unless defined?(error_counts)), 'data-bulk-form-target': "actions" }
     .container
       .status.eleven.columns
diff --git a/app/webpacker/controllers/flash_controller.js b/app/webpacker/controllers/flash_controller.js
index 100d34fa69..84dfe7eaf9 100644
--- a/app/webpacker/controllers/flash_controller.js
+++ b/app/webpacker/controllers/flash_controller.js
@@ -15,11 +15,12 @@ export default class extends Controller {
     }
   }
 
-  close() {
+  close(e) {
     // Fade out
     this.element.classList.remove("animate-show");
     this.element.classList.add("animate-hide-500");
     setTimeout(this.remove.bind(this), 500);
+    e && e.preventDefault(); // Prevent submitting if we're inside a form
   }
 
   remove() {
diff --git a/app/webpacker/css/admin_v3/components/messages.scss b/app/webpacker/css/admin_v3/components/messages.scss
index 4a956cc831..1d574a9a07 100644
--- a/app/webpacker/css/admin_v3/components/messages.scss
+++ b/app/webpacker/css/admin_v3/components/messages.scss
@@ -27,6 +27,7 @@
 
 .flash-container {
   position: fixed;
+  left: 0;
   bottom: 0;
   width: 100%;
   z-index: 1000;