Introduce new stock_items/edit component

Co-Authored-By: Elia Schito <[email protected]>

admin/app/components/solidus_admin/stock_items/edit/component.html.erb

@@ -0,0 +1,81 @@
+<div
+ data-controller="<%= stimulus_id %>"
+ data-<%= stimulus_id %>-initial-count-on-hand-value="<%= @stock_item.count_on_hand_was || @stock_item.count_on_hand %>"
+ data-action="input-><%= stimulus_id %>#updateCountOnHand"
+>
+ <%= render component("ui/modal").new(title: t(".title"), close_path: solidus_admin.stock_items_path(page: params[:page], q: permitted_query_params)) do |modal| %>
+ <%= form_for @stock_item, url: solidus_admin.stock_item_path(@stock_item), html: { id: form_id } do |f| %>
+ <div class="flex flex-col gap-6 pb-4">
+ <div class="flex gap-4">
+ <%= link_to spree.edit_admin_product_variant_path(
+ @stock_item.variant.product,
+ @stock_item.variant,
+ ), class: 'hover:bg-gray-25 rounded p-1 w-1/2 border border-gray-100' do %>
+ <%= render component("ui/resource_item").new(
+ thumbnail:
+ (
+ @stock_item.variant.images.first ||
+ @stock_item.variant.product.gallery.images.first
+ )&.url(:small),
+ title: @stock_item.variant.name,
+ subtitle:
+ "#{@stock_item.variant.sku}#{@stock_item.variant.options_text.presence&.prepend(" - ")}",
+ ) %>
+ <% end %>
+ <%= link_to spree.edit_admin_stock_location_path(@stock_item.stock_location), class: 'hover:bg-gray-25 rounded p-1 w-1/2 border border-gray-100' do %>
+ <%= render component("ui/resource_item").new(
+ title: @stock_item.stock_location.name,
+ subtitle: "#{Spree::StockLocation.model_name.human} #{@stock_item.stock_location.code}",
+ ) %>
+ <% end %>
+ </div>
+
+ <%= render component("ui/forms/field").text_field(
+ f,
+ :count_on_hand,
+ disabled: true,
+ value: @stock_item.count_on_hand_was || @stock_item.count_on_hand,
+ "data-#{stimulus_id}-target": 'countOnHand',
+ ) %>
+ <%= render component("ui/forms/field").new(
+ label: t(".quantity_adjustment"),
+ hint: t(".quantity_adjustment_hint_html"),
+ ) do %>
+ <%= render component("ui/forms/input").new(
+ value: params[:quantity_adjustment] || 0,
+ name: :quantity_adjustment,
+ type: :number,
+ step: 1,
+ "data-#{stimulus_id}-target": 'quantityAdjustment',
+ ) %>
+ <% end %>
+
+ <%= render component("ui/forms/switch_field").new(
+ name: "#{f.object_name}[backorderable]",
+ label: Spree::StockItem.human_attribute_name(:backorderable),
+ error: f.object.errors[:backorderable],
+ hint: t(".backorderable_hint_html"),
+ checked: f.object.backorderable?,
+ include_hidden: true,
+ ) %>
+ </div>
+ <% end %>
+
+ <% modal.with_actions do %>
+ <%= render component("ui/button").new(
+ tag: :a,
+ scheme: :secondary,
+ text: t(".cancel"),
+ href: solidus_admin.stock_items_path(page: params[:page], q: params[:q]),
+ ) %>
+
+ <%= render component("ui/button").new(
+ tag: :button,
+ text: t(".submit"),
+ form: form_id,
+ ) %>
+ <% end %>
+ <% end %>
+
+ <%= render component("stock_items/index").new(page: @page) %>
+</div>

admin/app/components/solidus_admin/stock_items/edit/component.js

@@ -0,0 +1,17 @@
+import { Controller } from '@hotwired/stimulus'
+
+export default class extends Controller {
+ static values = {
+ initialCountOnHand: Number,
+ }
+
+ static targets = ['countOnHand', 'quantityAdjustment']
+
+ connect() {
+ this.updateCountOnHand()
+ }
+
+ updateCountOnHand() {
+ this.countOnHandTarget.value = parseInt(this.initialCountOnHandValue) + parseInt(this.quantityAdjustmentTarget.value)
+ }
+}

admin/app/components/solidus_admin/stock_items/edit/component.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+class SolidusAdmin::StockItems::Edit::Component < SolidusAdmin::BaseComponent
+ def initialize(stock_item:, page:)
+ @stock_item = stock_item
+ @page = page
+ end
+
+ def title
+ [
+ "#{Spree::StockLocation.model_name.human}: #{@stock_item.stock_location.name}",
+ ].join(' / ')
+ end
+
+ def form_id
+ "#{stimulus_id}-#{dom_id(@stock_item)}"
+ end
+
+ def permitted_query_params
+ return params[:q].permit! if params[:q].respond_to?(:permit)
+ {}
+ end
+end

admin/app/components/solidus_admin/stock_items/edit/component.yml

@@ -0,0 +1,10 @@
+en:
+ submit: "Save"
+ cancel: "Cancel"
+ title: "Edit Stock Levels"
+ quantity_adjustment: "Quantity Adjustment"
+ quantity_adjustment_hint_html: |
+ Enter a positive number to increase the stock level, or a negative number to decrease the stock level.
+ backorderable_hint_html: |
+ Enable to allow customers to place orders even when the product is out of stock.<br>
+ When ordering the product customers will know that the product will be delivered at a later date, once it becomes available again.

admin/app/components/solidus_admin/stock_items/index/component.html.erb

@@ -3,7 +3,8 @@
  <%= page_header_title title %>
  <% end %>
 
- <%= render component('ui/table').new(
+ <%=
+ render component('ui/table').new(
  id: stimulus_id,
  data: {
  class: Spree::StockItem,
@@ -12,10 +13,11 @@
  next: next_page_path,
  columns: columns,
  batch_actions: batch_actions,
+ url: -> { solidus_admin.edit_stock_item_path(_1, page: params[:page], q: permitted_query_params) },
  },
  search: {
  name: :q,
- value: params[:q],
+ value: permitted_query_params,
  url: solidus_admin.stock_items_path,
  searchbar_key: :variant_product_name_or_variant_sku_or_variant_option_values_name_or_variant_option_values_presentation_cont,
  filters: filters,

admin/app/components/solidus_admin/stock_items/index/component.rb

@@ -172,4 +172,9 @@ def count_on_hand_column
  end
  }
  end
+
+ def permitted_query_params
+ return params[:q].permit! if params[:q].respond_to?(:permit)
+ {}
+ end
 end

admin/app/controllers/solidus_admin/stock_items_controller.rb

@@ -19,6 +19,9 @@ def index
  end
 
  def edit
+ respond_to do |format|
+ format.html { render component('stock_items/edit').new(stock_item: @stock_item, page: @page) }
+ end
  end
 
  def update
@@ -29,6 +32,9 @@ def update
  if @stock_item.save
  redirect_to solidus_admin.stock_items_path, status: :see_other
  else
+ respond_to do |format|
+ format.html { render component('stock_items/edit').new(stock_item: @stock_item, page: @page), status: :unprocessable_entity }
+ end
  end
  end