Merge pull request #11571 from dacook/buu-editing-fixups

[BUU] editing fixups

app/views/admin/products_v3/_table.html.haml

@@ -63,18 +63,17 @@
             %td.align-right
               = render partial: 'admin/products_v3/components/product_actions', locals: { product: product }
           - product.variants.each do |variant|
-            - prefix = "[products][][variants_attributes][]" # Couldn't convince the formbuilder to generate this for me, so for now we manually add the prefix
-            = form.fields_for(variant) do |variant_form|
+            = form.fields_for("products][][variants_attributes][", variant, index: nil) do |variant_form|
               %tr.condensed
                 %td.align-left
-                  = variant_form.hidden_field :id, name: "#{prefix}[id]"
-                  = variant_form.text_field :display_name, name: "#{prefix}[display_name]", 'aria-label': t('admin.products_page.columns.name'), placeholder: product.name
+                  = variant_form.hidden_field :id
+                  = variant_form.text_field :display_name, 'aria-label': t('admin.products_page.columns.name'), placeholder: product.name
                 %td.align-right
-                  = variant_form.text_field :sku, name: "#{prefix}[sku]", 'aria-label': t('admin.products_page.columns.sku')
+                  = variant_form.text_field :sku, 'aria-label': t('admin.products_page.columns.sku')
                 %td.align-right
                   .line-clamp-1= variant.unit_to_display
                 %td.align-right
-                  = variant_form.text_field :price, name: "#{prefix}[price]", 'aria-label': t('admin.products_page.columns.price'), value: number_to_currency(variant.price, unit: '')&.strip # TODO: add a spec to prove that this formatting is necessary. If so, it should be in a shared form helper for currency inputs
+                  = variant_form.text_field :price, 'aria-label': t('admin.products_page.columns.price'), value: number_to_currency(variant.price, unit: '')&.strip # TODO: add a spec to prove that this formatting is necessary. If so, it should be in a shared form helper for currency inputs
                 %td.align-right
                   .line-clamp-1= variant.on_hand || 0 #TODO: spec for this according to requirements.
                 %td.align-left

app/webpacker/controllers/application_controller.js

@@ -43,7 +43,11 @@ export default class extends Controller {
   }
 
   reflexError(element, reflex, error, reflexId) {
+    // Log to console (it normally only gets logged in dev mode)
+    console.error(reflex + ":\n " + error);
+
     // show error message
+    alert(I18n.t("errors.stimulus_reflex_error"));
   }
 
   reflexForbidden(element, reflex, noop, reflexId) {

app/webpacker/controllers/bulk_form_controller.js

@@ -35,19 +35,16 @@ export default class BulkFormController extends Controller {
 
   toggleModified(e) {
     const element = e.target;
-    const modified = element.value != element.defaultValue;
-    element.classList.toggle("modified", modified);
+    element.classList.toggle("modified", this.#isModified(element));
 
     this.toggleFormModified();
   }
 
   toggleFormModified() {
     // For each record, check if any fields are modified
-    const modifiedRecordCount = Object.keys(this.recordElements).filter((recordId) => {
-      return this.recordElements[recordId].some((element) => {
-        return element.value != element.defaultValue;
-      });
-    }).length;
+    const modifiedRecordCount = Object.values(this.recordElements).filter((elements) =>
+      elements.some(this.#isModified)
+    ).length;
     const formModified = modifiedRecordCount > 0;
 
     // Show actions
@@ -87,4 +84,8 @@ export default class BulkFormController extends Controller {
       });
     }
   }
+
+  #isModified(element) {
+    return element.value != element.defaultValue;
+  }
 }

app/webpacker/css/admin/products_v3.scss

@@ -109,6 +109,10 @@
     // "Naked" inputs. Row hover helps reveal them.
     input {
       border-color: transparent;
+      background-color: $color-tbl-cell-bg;
+      height: auto;
+      font-size: inherit;
+      font-weight: inherit;
 
       &:focus {
         border-color: $color-txt-hover-brd;

config/locales/en.yml

@@ -165,6 +165,14 @@ en:
       message_html: "<p>The change you wanted was rejected. Maybe you tried to change something you don't have access to.
       <br><h3><a href='/' >Return home</a></h3>
       </p>"
+    stimulus_reflex_error: "We're sorry, but something went wrong.
+
+
+      This might be a temporary problem, so please try again or reload the page.
+
+      We record all errors and may be working on a fix.
+
+      If the problem persists or is urgent, please contact us."
   stripe:
     error_code:
       incorrect_number: "The card number is incorrect."