diff --git a/app/reflexes/products_reflex.rb b/app/reflexes/products_reflex.rb index 74a0b49873..4c8aabc0d2 100644 --- a/app/reflexes/products_reflex.rb +++ b/app/reflexes/products_reflex.rb @@ -49,18 +49,6 @@ class ProductsReflex < ApplicationReflex fetch_and_render_products_with_flash end - def edit_image - id = current_id_from_element(element) - product = product_finder(id).find_product - image = product.image - - image = Spree::Image.new(viewable: product) if product.image.blank? - - morph "#modal-component", - render(partial: "admin/products_v3/edit_image", - locals: { product:, image:, return_url: url }) - end - private def init_filters_params diff --git a/app/views/admin/products_v3/_edit_image.html.haml b/app/views/admin/products_v3/_edit_image.html.haml deleted file mode 100644 index 57fccaac76..0000000000 --- a/app/views/admin/products_v3/_edit_image.html.haml +++ /dev/null @@ -1,17 +0,0 @@ -= render ModalComponent.new id: "#modal_edit_product_image_#{image.id}", instant: true, close_button: false, modal_class: :fit do - %h2= t(".title") - - -# Display image in the same way it appears in the shopfront popup - %p= image_tag image.persisted? ? image.url(:large) : Spree::Image.default_image_url(:large), width: 433, height: 433 - - -# Submit to controller, because StimulusReflex doesn't support file uploads - = form_for [:admin, product, image], - html: { multipart: true }, data: { controller: "form" } do |f| - %input{ type: :hidden, name: :return_url, value: return_url} - = f.hidden_field :viewable_id, value: product.id - - .modal-actions.justify-end - %input{ class: "secondary relaxed", type: 'button', value: t('.close'), "data-action": "click->modal#close" } - -# label.button provides a handy shortcut to open the file selector on click. Unfortunately this trick isn't keyboard accessible though.. - = f.label :attachment, t(".upload"), class: "button primary relaxed icon-upload-alt" - = f.file_field :attachment, accept: "image/*", style: "display: none", "data-action": "change->form#submit" diff --git a/app/views/admin/products_v3/_product_row.html.haml b/app/views/admin/products_v3/_product_row.html.haml index f82ef26933..5cd0cc8db1 100644 --- a/app/views/admin/products_v3/_product_row.html.haml +++ b/app/views/admin/products_v3/_product_row.html.haml @@ -1,7 +1,8 @@ -%td.with-image - %a.image-field{ href: admin_product_images_path(product), data: { controller: "modal", reflex: "click->products#edit_image", "current-id": product.id} } - = image_tag product.image&.url(:mini) || Spree::Image.default_image_url(:mini), width: 40, height: 40 - .button.secondary.mini= t('admin.products_page.image.edit') +%td.with-image{ id: "image-#{product.id}" } + - if product.image.present? # todo: handle blank img + %a.image-field{ href: edit_admin_product_image_path(product.id, product.image.id), 'data-turbo-stream': true } + = image_tag product.image&.url(:mini) || Spree::Image.default_image_url(:mini), width: 40, height: 40 + .button.secondary.mini= t('admin.products_page.image.edit') %td.field.align-left.header.naked_inputs = f.hidden_field :id = f.text_field :name, 'aria-label': t('admin.products_page.columns.name') diff --git a/app/views/admin/products_v3/index.html.haml b/app/views/admin/products_v3/index.html.haml index 5087feddc2..668a8527a4 100644 --- a/app/views/admin/products_v3/index.html.haml +++ b/app/views/admin/products_v3/index.html.haml @@ -19,4 +19,4 @@ - %w[product variant].each do |object_type| = render partial: 'delete_modal', locals: { object_type: } #modal-component - + #edit_image_modal diff --git a/app/views/spree/admin/images/edit.turbo_stream.haml b/app/views/spree/admin/images/edit.turbo_stream.haml new file mode 100644 index 0000000000..4cadb68988 --- /dev/null +++ b/app/views/spree/admin/images/edit.turbo_stream.haml @@ -0,0 +1,18 @@ += turbo_stream.update "edit_image_modal" do + = render ModalComponent.new id: "#modal_edit_product_image", instant: true, close_button: false, modal_class: :fit do + %h2= t(".title") + + -# Display image in the same way it appears in the shopfront popup + %p= image_tag @image.persisted? ? @image.url(:large) : Spree::Image.default_image_url(:large), width: 433, height: 433 + + -# Submit to controller + = form_for [:admin, @product, @image], + html: { multipart: true }, data: { controller: "form" } do |f| + %input{ type: :hidden, name: :return_url, value: request.referer } + = f.hidden_field :viewable_id, value: @product.id + + .modal-actions.justify-end + %input{ class: "secondary relaxed", type: 'button', value: t('.close'), "data-action": "click->modal#close" } + -# label.button provides a handy shortcut to open the file selector on click. Unfortunately this trick isn't keyboard accessible though.. + = f.label :attachment, t(".upload"), class: "button primary relaxed icon-upload-alt" + = f.file_field :attachment, accept: "image/*", style: "display: none", "data-action": "change->form#submit" diff --git a/config/locales/en.yml b/config/locales/en.yml index b6d63a5632..a705c300b8 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -899,10 +899,6 @@ en: new_variant: New variant bulk_update: success: Changes saved - edit_image: - title: Edit product photo - close: Back - upload: Upload photo delete_product: success: Successfully deleted the product error: Unable to delete the product @@ -4148,6 +4144,11 @@ See the %{link} to find out more about %{sitename}'s features and to start using must_be_int: "must be an integer" admin: + images: + edit: + title: Edit product photo + close: Back + upload: Upload photo mail_methods: send_testmail: "Send test email" testmail: