diff --git a/app/views/admin/column_preferences/_form.html.haml b/app/views/admin/column_preferences/_form.html.haml index 88ccd1a981..6296444b02 100644 --- a/app/views/admin/column_preferences/_form.html.haml +++ b/app/views/admin/column_preferences/_form.html.haml @@ -3,12 +3,21 @@ html: { 'data-controller': "column-preferences" } do |f| = hidden_field_tag :action_name, action - - ColumnPreference.for(spree_current_user, action).each_with_index do |column_preference, index| - = f.fields_for("column_preferences", column_preference, index:) do |cp_form| - = cp_form.hidden_field :id - = cp_form.hidden_field :column_name - %label - = cp_form.check_box :visible, 'data-column-name': column_preference.column_name - = t("admin.products_page.columns." + column_preference.column_name) + / DC: this makes my Chrome DevTools crash when inspecting the
element. If problem continues, we need to use a different method. + %details.ofn-drop-down.ofn-drop-down-v2.right{ 'data-controller': "dropdown" } + %summary.ofn-drop-down-label + = t('admin.columns') + %span.icon-caret - = f.submit t('admin.column_save_as_default') + .menu + .menu_items + - ColumnPreference.for(spree_current_user, action).each_with_index do |column_preference, index| + = f.fields_for("column_preferences", column_preference, index:) do |cp_form| + = cp_form.hidden_field :id + = cp_form.hidden_field :column_name + %label.menu_item + = cp_form.check_box :visible, 'data-column-name': column_preference.column_name + %span= t("admin.products_page.columns." + column_preference.column_name) + + .actions + = f.submit t('admin.column_save_as_default'), class: "secondary fullwidth" diff --git a/app/webpacker/controllers/dropdown_controller.js b/app/webpacker/controllers/dropdown_controller.js index 844289e12c..701fdf27a7 100644 --- a/app/webpacker/controllers/dropdown_controller.js +++ b/app/webpacker/controllers/dropdown_controller.js @@ -1,5 +1,6 @@ import { Controller } from "stimulus"; +// Close a
element when click outside export default class extends Controller { connect() { diff --git a/app/webpacker/css/admin_v3/components/dropdown.scss b/app/webpacker/css/admin_v3/components/dropdown.scss index a0b3d745a1..32ed4ec4f1 100644 --- a/app/webpacker/css/admin_v3/components/dropdown.scss +++ b/app/webpacker/css/admin_v3/components/dropdown.scss @@ -111,7 +111,7 @@ top: 100%; left: 0px; padding: 5px 0px; - border: 1px solid #adadad; + border-radius: $border-radius; background-color: #ffffff; box-shadow: 1px 3px 10px #888888; z-index: 100; @@ -280,6 +280,16 @@ } } } + + .actions { + margin-top: 5px; + margin-right: 15px; // Compensate for scrollbar on menu_items + padding: 2px 10px; + + &:hover { + background-color: inherit; + } + } } .ofn-drop-down.ofn-drop-down-v2 { diff --git a/spec/support/request/admin_helper.rb b/spec/support/request/admin_helper.rb index 60e0fcdbd4..eb06f34b12 100644 --- a/spec/support/request/admin_helper.rb +++ b/spec/support/request/admin_helper.rb @@ -3,10 +3,10 @@ module AdminHelper def toggle_columns(*labels) # open dropdown - # case insensitive search for "Columns" text - find("div#columns-dropdown", text: /columns/i).click + columns_dropdown = ofn_drop_down("Columns") + columns_dropdown.click - within "div#columns-dropdown" do + within columns_dropdown do labels.each do |label| # Convert label to case-insensitive regexp if not one already label = /#{label}/i unless label.is_a?(Regexp) @@ -16,6 +16,10 @@ module AdminHelper end # close dropdown - find("div#columns-dropdown", text: /columns/i).click + columns_dropdown.click + end + + def ofn_drop_down(label) + find(".ofn-drop-down", text: /#{label}/i) end end diff --git a/spec/system/admin/products_v3/products_spec.rb b/spec/system/admin/products_v3/products_spec.rb index 076393006b..5d76e3e522 100644 --- a/spec/system/admin/products_v3/products_spec.rb +++ b/spec/system/admin/products_v3/products_spec.rb @@ -3,6 +3,7 @@ require "system_helper" RSpec.describe 'As an enterprise user, I can manage my products', feature: :admin_style_v3 do + include AdminHelper include WebHelper include AuthenticationHelper include FileHelper @@ -38,26 +39,37 @@ RSpec.describe 'As an enterprise user, I can manage my products', feature: :admi end it "hides column and remembers saved preference" do + # Name shows by default + expect(page).to have_checked_field "Name" expect(page).to have_selector "th", text: "Name" + expect_other_columns_visible + + # Name is hidden + ofn_drop_down("Columns").click + within ofn_drop_down("Columns") do + uncheck "Name" + end + # expect(page).not_to have_selector "th", text: "Name" # column is not visible, but capybara doesn't understand yet. + expect_other_columns_visible + + # Preference saved + click_on "Save as default" + expect(page).to have_content "Column preferences saved" + refresh + + # Preference remembered + ofn_drop_down("Columns").click + within ofn_drop_down("Columns") do + expect(page).to have_unchecked_field "Name" + end + # expect(page).not_to have_selector "th", text: "Name" + expect_other_columns_visible + end + + def expect_other_columns_visible expect(page).to have_selector "th", text: "Producer" expect(page).to have_selector "th", text: "Price" expect(page).to have_selector "th", text: "On Hand" - - uncheck "Name" - - expect(page).not_to have_selector "th", text: "Name" - expect(page).to have_selector "th", text: "Producer" - expect(page).to have_selector "th", text: "Price" - expect(page).to have_selector "th", text: "On Hand" - - click_on "Save as default" - refresh - expect(page).to have_unchecked_field "Name" - - expect(page).not_to have_selector "th", text: "Name" - expect(page).to have_selector "th", text: "Producer" - expect(page).to have_selector "th", text: "Price" - expect(page).to have_selector "th", text: "On Hand" end end