Extract a products/stock component

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

@@ -103,22 +103,7 @@ def status_column
   def stock_column
     {
       header: :stock,
-      data: ->(product) do
-        stock_info =
-          case (on_hand = product.total_on_hand)
-          when Float::INFINITY
-            content_tag :span, t('.stock.in_stock', on_hand: t('.stock.infinity')), class: 'text-forest'
-          when 1..Float::INFINITY
-            content_tag :span, t('.stock.in_stock', on_hand: on_hand), class: 'text-forest'
-          else
-            content_tag :span, t('.stock.in_stock', on_hand: on_hand), class: 'text-red-500'
-          end
-
-        variant_info =
-          t('.for_variants', count: product.variants.count)
-
-        content_tag :div, safe_join([stock_info, variant_info], ' ')
-      end
+      data: ->(product) { component('products/stock').from_product(product) }
     }
   end
 

admin/app/components/solidus_admin/products/index/component.yml

@@ -1,10 +1,6 @@
 en:
   product_image: 'Image'
   add_product: 'Add Product'
-  stock:
-    infinity: '∞'
-    in_stock: '%{on_hand} in stock'
-  for_variants: 'for %{count} variants'
   batch_actions:
     delete: 'Delete'
     discontinue: 'Discontinue'

admin/app/components/solidus_admin/products/stock/component.rb

@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+class SolidusAdmin::Products::Stock::Component < SolidusAdmin::BaseComponent
+  def self.from_product(product)
+    new(
+      on_hand: product.total_on_hand,
+      variants_count: product.variants.count,
+    )
+  end
+
+  def initialize(on_hand:, variants_count:)
+    @on_hand = on_hand
+    @variants_count = variants_count
+  end
+
+  def call
+    stock_info =
+      case @on_hand
+      when Float::INFINITY
+        tag.span t('.stock.in_stock', on_hand: t('.stock.infinity')), class: 'text-forest'
+      when 1..Float::INFINITY
+        tag.span t('.stock.in_stock', on_hand: @on_hand), class: 'text-forest'
+      else
+        tag.span t('.stock.in_stock', on_hand: @on_hand), class: 'text-red-500'
+      end
+
+    variant_info = t('.for_variants', count: @variants_count)
+
+    tag.div safe_join([stock_info, variant_info], ' ')
+  end
+end

admin/app/components/solidus_admin/products/stock/component.yml

@@ -0,0 +1,5 @@
+en:
+  stock:
+    infinity: '∞'
+    in_stock: '%{on_hand} in stock'
+  for_variants: 'for %{count} variants'

admin/spec/components/previews/solidus_admin/products/stock/component_preview.rb

@@ -0,0 +1,10 @@
+# frozen_string_literal: true
+
+# @component "products/stock"
+class SolidusAdmin::Products::Stock::ComponentPreview < ViewComponent::Preview
+  include SolidusAdmin::Preview
+
+  def overview
+    render_with_template
+  end
+end

admin/spec/components/previews/solidus_admin/products/stock/component_preview/overview.html.erb

@@ -0,0 +1,31 @@
+<div class="mb-8">
+  <h6 class="text-gray-500 mb-3 mt-0">
+    In Stock
+  </h6>
+
+  <%= render current_component.new(on_hand: 32, variants_count: 12) %>
+</div>
+
+<div class="mb-8">
+  <h6 class="text-gray-500 mb-3 mt-0">
+    Infinite stock
+  </h6>
+
+  <%= render current_component.new(on_hand: Float::INFINITY, variants_count: 12) %>
+</div>
+
+<div class="mb-8">
+  <h6 class="text-gray-500 mb-3 mt-0">
+    Out of stock
+  </h6>
+
+  <%= render current_component.new(on_hand: 0, variants_count: 12) %>
+</div>
+
+<div class="mb-8">
+  <h6 class="text-gray-500 mb-3 mt-0">
+    Negative stock
+  </h6>
+
+  <%= render current_component.new(on_hand: -10, variants_count: 12) %>
+</div>

admin/spec/components/solidus_admin/products/stock/component_spec.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+require "spec_helper"
+
+RSpec.describe SolidusAdmin::Products::Stock::Component, type: :component do
+  it "renders the overview preview" do
+    render_preview(:overview)
+  end
+end