🌸🥗✨ Marketplace: Tidy up managing TaxRates (#1338)

* 🌸🥗🛠️✨ `Marketplace`: Tidy up managing `TaxRate`s

- #1137
- #1187

OK this is a bit bigger than it probably should be but I came in like a
wreeeckiin' ball and:

- 🛠️ `Components`: `ApplicationComponent` exposes `policy` and `current_person`
- 🛠️ `Components`: Component Specs have `polymorphic_path`
- 🥗 `Marketplace`: Tested `TaxRate`, `TaxRateComponent` and `TaxRatesController`
- 🌸 `Marketplace`: `TaxRate#edit`, `TaxRate#update`, and
  `TaxRate#destroy` via TurboStreams
- 🌸 `Marketplace`: `TaxRate#index` and `TaxRate#show` are prettier

* ✍️ `Marketplace`: Wordsmith `TaxRate#edit` and `TaxRate#destroy` buttons

- #1137

This makes it so the text of the button is "Edit" and the label for the
button is the fuller text which includes the kind of thing being edited.

* `Marketplace`: Drop the controller changes

- #1347

Pulled out to their own PR

app/furniture/marketplace/locales/en.yml

@@ -63,6 +63,10 @@ en:
         link_to: "Tax Rates"
       new:
         link_to: Add Tax Rate
+      edit:
+        link_to: Edit Tax Rate '%{name}'
+      destroy:
+        link_to: Remove Tax Rate '%{name}'
     cart_products:
       cart_product:
         remove: Remove from Cart

app/furniture/marketplace/tax_rate_component.html.erb

@@ -1,6 +1,15 @@
 
-<%= render CardComponent.new(classes: "py-2") do %>
-  <%= link_to tax_rate.location(:edit) do %>
-    <%= tax_rate.label %>: <%= number_to_percentage(tax_rate.tax_rate, precision: 1) %>
-  <%- end %>
+<%= render CardComponent.new(dom_id: dom_id(tax_rate), classes: "flex flex-col justify-between gap-y-2 w-full") do %>
+  <header class="flex font-bold">
+    <%= label %>
+  </header>
+
+  <div class="italic">
+    <%= rate  %>
+  </div>
+
+  <div class="flex flex-row justify-between">
+    <%= render edit_button if edit_button? %>
+    <%= render destroy_button if destroy_button?  %>
+  </div>
 <%- end %>

app/furniture/marketplace/tax_rate_component.rb

@@ -1,11 +1,42 @@
 class Marketplace
   class TaxRateComponent < ApplicationComponent
     attr_accessor :tax_rate
+    delegate :label, to: :tax_rate
 
     def initialize(tax_rate:, data: {}, classes: "")
       super(data: data, classes: classes)
 
       self.tax_rate = tax_rate
     end
+
+    def rate
+      number_to_percentage(tax_rate.tax_rate, precision: 2)
+    end
+
+    def edit_button
+      return unless edit_button?
+
+      ButtonComponent.new label: "#{t("icons.edit")} #{t("edit.link_to")}",
+        title: t("marketplace.tax_rates.edit.link_to", name: tax_rate.label),
+        href: tax_rate.location(:edit), turbo_stream: true,
+        method: :get
+    end
+
+    def edit_button?
+      tax_rate.persisted? && policy(tax_rate).edit?
+    end
+
+    def destroy_button
+      return unless destroy_button?
+
+      ButtonComponent.new label: "#{t("icons.destroy")} #{t("destroy.link_to")}",
+        title: t("marketplace.tax_rates.destroy.link_to", name: tax_rate.label),
+        href: tax_rate.location, turbo_stream: true,
+        method: :delete
+    end
+
+    def destroy_button?
+      tax_rate.persisted? && policy(tax_rate).destroy? && tax_rate.products.blank?
+    end
   end
 end

app/furniture/marketplace/tax_rates/_form.html.erb

@@ -1,6 +1,8 @@
-<%= form_with(model: tax_rate.location) do |tax_rate_form| %>
-  <%= render "text_field", attribute: :label, form: tax_rate_form %>
-  <%= render "number_field", attribute: :tax_rate, form: tax_rate_form, required: true, step: 0.01, min: 0, max: 100 %>
+<%= render CardComponent.new(dom_id: dom_id(tax_rate)) do %>
+  <%= form_with(model: tax_rate.location) do |tax_rate_form| %>
+    <%= render "text_field", attribute: :label, form: tax_rate_form %>
+    <%= render "number_field", attribute: :tax_rate, form: tax_rate_form, required: true, step: 0.01, min: 0.01, max: 100 %>
 
-  <%= tax_rate_form.submit %>
+    <%= tax_rate_form.submit %>
+  <%- end %>
 <%- end %>

app/furniture/marketplace/tax_rates/index.html.erb

@@ -1,11 +1,12 @@
 <%- breadcrumb(:marketplace_tax_rates, marketplace) %>
 
-<section class="max-w-2xl self-stretch mx-auto">
+<section class="mt-3">
   <main>
-    <div class="mt-3 grid grid-cols-1 gap-5 sm:gap-6 sm:grid-cols-2 lg:grid-cols-4">
+    <div class="grid grid-cols-1 gap-3 sm:gap-5 sm:grid-cols-3">
       <%= render Marketplace::TaxRateComponent.with_collection(tax_rates) %>
     </div>
   </main>
+
   <footer class="text-center">
     <%= link_to(t("marketplace.tax_rates.new.link_to"), marketplace.location(:new, child: :tax_rate)) %>
   </footer>

spec/components/previews/marketplace/tax_rate_component_preview.rb

@@ -1,7 +1,9 @@
 class Marketplace
   class TaxRateComponentPreview < ViewComponent::Preview
-    def card
-      render(TaxRateComponent.new(tax_rate: TaxRate.all.sample))
+    # @param label
+    # @param tax_rate
+    def card(label: "Sales Tax", tax_rate: 8.5)
+      render(TaxRateComponent.new(tax_rate: TaxRate.new(label: label, tax_rate: tax_rate)))
     end
   end
 end

spec/factories/furniture/marketplace.rb

@@ -128,6 +128,7 @@
   factory :marketplace_tax_rate, class: "Marketplace::TaxRate" do
     label { "#{Faker::TvShows::RuPaul.queen} Tax" }
     tax_rate { (1..45).to_a.sample }
+    marketplace { association(:marketplace) }
   end
 
   factory :marketplace_delivery_area, class: "Marketplace::DeliveryArea" do

spec/furniture/marketplace/tax_rate_component_spec.rb

@@ -0,0 +1,24 @@
+require "rails_helper"
+
+RSpec.describe Marketplace::TaxRateComponent, type: :component do
+  let(:component) { described_class.new(tax_rate: tax_rate) }
+  let(:tax_rate) { create(:marketplace_tax_rate) }
+
+  describe "#render" do
+    subject(:output) { render_inline(component) }
+
+    it { is_expected.to have_content(tax_rate.label) }
+    it { is_expected.to have_content(component.helpers.number_to_percentage(tax_rate.tax_rate, precision: 2)) }
+
+    context "when current person is null" do
+      it { is_expected.not_to have_selector("a") }
+    end
+
+    context "when current person is a space member" do
+      before { component.current_person = create(:membership, space: tax_rate.space).member }
+
+      it { is_expected.to have_link(href: polymorphic_path(tax_rate.location(:edit))) }
+      it { is_expected.to have_selector("a[data-method='delete'][data-turbo-stream=true][href='#{polymorphic_path(tax_rate.location)}']") }
+    end
+  end
+end