mirror of
https://github.com/openfoodfoundation/openfoodnetwork
synced 2026-03-19 04:49:15 +00:00
Merge pull request #12361 from dacook/buu/add-turbo
[BUU] Add Turbo for dynamic page loading
This commit is contained in:
@@ -18,11 +18,13 @@ module Admin
|
||||
|
||||
if product_set.save
|
||||
flash[:success] = I18n.t('admin.products_v3.bulk_update.success')
|
||||
redirect_to [:index, { page: @page, per_page: @per_page }]
|
||||
redirect_to [:index,
|
||||
{ page: @page, per_page: @per_page, search_term: @search_term,
|
||||
producer_id: @producer_id, category_id: @category_id }]
|
||||
elsif product_set.errors.present?
|
||||
@error_counts = { saved: product_set.saved_count, invalid: product_set.invalid.count }
|
||||
|
||||
render "index", locals: { producers:, categories:, flash: }
|
||||
render "index", status: :unprocessable_entity, locals: { producers:, categories:, flash: }
|
||||
end
|
||||
end
|
||||
|
||||
|
||||
@@ -1,4 +1,8 @@
|
||||
#products-content
|
||||
%turbo-frame#products-content{ target: "_top", refresh: "morph" }
|
||||
.spinner-overlay{ "data-controller": "loading", "data-products-target": "loading", class: "hidden" }
|
||||
.spinner-container
|
||||
.spinner
|
||||
= t('.loading')
|
||||
.container
|
||||
.sixteen.columns
|
||||
= render partial: 'admin/shared/flashes', locals: { flashes: } if defined? flashes
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
= form_with url: admin_products_path, id: "filters", method: :get, data: { remote: false, "search-target": "form" } do
|
||||
= form_with url: admin_products_path, id: "filters", method: :get, data: { "search-target": "form", 'turbo-frame': "_self" } do
|
||||
= hidden_field_tag :page, nil, class: "page"
|
||||
= hidden_field_tag :per_page, nil, class: "per-page"
|
||||
|
||||
|
||||
@@ -36,8 +36,8 @@
|
||||
.content= product.inherits_properties ? 'YES' : 'NO' #TODO: consider using https://github.com/RST-J/human_attribute_values, else use I18n.t (also below)
|
||||
%td.align-right
|
||||
= render(VerticalEllipsisMenu::Component.new) do
|
||||
= link_to t('admin.products_page.actions.edit'), edit_admin_product_path(product)
|
||||
= link_to t('admin.products_page.actions.clone'), clone_admin_product_path(product)
|
||||
= link_to t('admin.products_page.actions.edit'), edit_admin_product_path(product), 'data-turbo': false
|
||||
= link_to t('admin.products_page.actions.clone'), clone_admin_product_path(product), 'data-turbo': false
|
||||
%a{ "data-controller": "modal-link", "data-action": "click->modal-link#setModalDataSetOnConfirm click->modal-link#open",
|
||||
"data-modal-link-target-value": "product-delete-modal", "class": "delete",
|
||||
"data-modal-link-modal-dataset-value": {'data-current-id': product.id}.to_json }
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
= t(".pagination.total_html", total: pagy.count, from: pagy.from, to: pagy.to)
|
||||
|
||||
- if search_term.present? || producer_id.present? || category_id.present?
|
||||
%a{ href: url_for(page: 1), class: "button disruptive" }
|
||||
%a{ href: url_for(page: 1), class: "button disruptive", 'data-turbo-frame': "_self" }
|
||||
= t(".pagination.clear_search")
|
||||
|
||||
%form.with-dropdown
|
||||
|
||||
@@ -1,12 +1,17 @@
|
||||
= form_with url: bulk_update_admin_products_path, method: :post, id: "products-form",
|
||||
builder: BulkFormBuilder,
|
||||
html: { data: { controller: "bulk-form", 'bulk-form-disable-selector-value': "#sort,#filters",
|
||||
html: { data: { 'turbo-frame': "_self",
|
||||
controller: "bulk-form",
|
||||
'bulk-form-disable-selector-value': "#sort,#filters",
|
||||
'bulk-form-error-value': defined?(@error_counts),
|
||||
} } do |form|
|
||||
= render(partial: "admin/shared/flashes", locals: { flashes: }) if defined? flashes
|
||||
|
||||
= hidden_field_tag :page, @page
|
||||
= hidden_field_tag :per_page, @per_page
|
||||
= hidden_field_tag :search_term, @search_term
|
||||
= hidden_field_tag :producer_id, @producer_id
|
||||
= hidden_field_tag :category_id, @category_id
|
||||
|
||||
%table.products
|
||||
%colgroup
|
||||
@@ -39,7 +44,7 @@
|
||||
-# Y products could not be saved correctly. Please review errors and try again
|
||||
= t('.error_summary.invalid', count: @error_counts[:invalid])
|
||||
.form-buttons
|
||||
%a.button.reset.medium{ href: admin_products_path(page: @page, per_page: @per_page) }
|
||||
%a.button.reset.medium{ href: admin_products_path(page: @page, per_page: @per_page, search_term: @search_term, producer_id: @producer_id, category_id: @category_id), 'data-turbo': "false" }
|
||||
= t('.reset')
|
||||
= form.submit t('.save'), class: "medium"
|
||||
%tr
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
- content_for :body_class do
|
||||
products_v3_page
|
||||
- content_for :page_title do
|
||||
= t('.header.title')
|
||||
- content_for :page_actions do
|
||||
@@ -13,12 +11,7 @@
|
||||
|
||||
= render partial: 'spree/admin/shared/product_sub_menu'
|
||||
|
||||
#products_v3_page{ "data-controller": "products" }
|
||||
.spinner-overlay{ "data-controller": "loading", "data-products-target": "loading", class: "hidden" }
|
||||
.spinner-container
|
||||
.spinner
|
||||
= t('.loading')
|
||||
|
||||
#products_v3_page{ "data-controller": "products", 'data-turbo': true }
|
||||
= render partial: "content", locals: { products: @products, pagy: @pagy, search_term: @search_term,
|
||||
producer_options: producers, producer_id: @producer_id,
|
||||
category_options: categories, category_id: @category_id,
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
// Customisations for the new Bulk Edit Products page only
|
||||
.products_v3_page {
|
||||
// Scoped to containing div, because Turbo messes with body classes
|
||||
#products_v3_page {
|
||||
#content > .row:first-child > .container:first-child {
|
||||
// Allow table to extend to full width of available screen space
|
||||
// TODO: move this to a generic rule, eg body.full-width{}. Then it can be included on any page.
|
||||
|
||||
@@ -6,6 +6,11 @@
|
||||
min-height: 200px;
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
z-index: 2;
|
||||
|
||||
// Show when inside a loading Turbo Frame
|
||||
turbo-frame[aria-busy="true"] > & {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.spinner-container {
|
||||
@@ -28,7 +33,9 @@
|
||||
height: 56px;
|
||||
border-radius: 50%;
|
||||
border: 9px solid $teal;
|
||||
animation: spinner-bulqg1 0.8s infinite linear alternate, spinner-oaa3wk 1.6s infinite linear;
|
||||
animation:
|
||||
spinner-bulqg1 0.8s infinite linear alternate,
|
||||
spinner-oaa3wk 1.6s infinite linear;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -844,6 +844,7 @@ en:
|
||||
index:
|
||||
header:
|
||||
title: Bulk Edit Products
|
||||
content:
|
||||
loading: Loading your products
|
||||
delete_modal:
|
||||
delete_product_modal:
|
||||
|
||||
@@ -58,7 +58,7 @@ describe 'As an admin, I can manage products', feature: :admin_style_v3 do
|
||||
|
||||
select "50", from: "per_page"
|
||||
|
||||
expect(page).to have_content "Showing 1 to 50"
|
||||
expect(page).to have_content "Showing 1 to 50", wait: 10
|
||||
expect_page_to_be 1
|
||||
expect_per_page_to_be 50
|
||||
expect_products_count_to_be 50
|
||||
@@ -130,13 +130,29 @@ describe 'As an admin, I can manage products', feature: :admin_style_v3 do
|
||||
|
||||
# create a product with a different supplier
|
||||
let!(:producer) { create(:supplier_enterprise, name: "Producer 1") }
|
||||
let!(:product_by_supplier) { create(:simple_product, supplier: producer) }
|
||||
let!(:product_by_supplier) { create(:simple_product, name: "Apples", supplier: producer) }
|
||||
|
||||
it "can search for a product" do
|
||||
it "can search for and update a product" do
|
||||
visit admin_products_url
|
||||
|
||||
search_by_producer "Producer 1"
|
||||
|
||||
# expect(page).to have_content "1 product found for your search criteria."
|
||||
expect(page).to have_select "producer_id", selected: "Producer 1", wait: 5
|
||||
expect_products_count_to_be 1
|
||||
|
||||
within row_containing_name("Apples") do
|
||||
fill_in "Name", with: "Pommes"
|
||||
end
|
||||
|
||||
expect {
|
||||
click_button "Save changes"
|
||||
|
||||
expect(page).to have_content "Changes saved"
|
||||
product_by_supplier.reload
|
||||
}.to change { product_by_supplier.name }.to("Pommes")
|
||||
|
||||
# Search is still applied
|
||||
# expect(page).to have_content "1 product found for your search criteria."
|
||||
expect(page).to have_select "producer_id", selected: "Producer 1"
|
||||
expect_products_count_to_be 1
|
||||
@@ -976,13 +992,12 @@ describe 'As an admin, I can manage products', feature: :admin_style_v3 do
|
||||
end
|
||||
|
||||
def search_by_producer(producer)
|
||||
# TODO: use a helper to more reliably select the tom-select component
|
||||
select producer, from: "producer_id"
|
||||
tomselect_select producer, from: "producer_id"
|
||||
click_button "Search"
|
||||
end
|
||||
|
||||
def search_by_category(category)
|
||||
select category, from: "category_id"
|
||||
tomselect_select category, from: "category_id"
|
||||
click_button "Search"
|
||||
end
|
||||
|
||||
|
||||
Reference in New Issue
Block a user