[admin] Add a tax categories index page

admin/app/components/solidus_admin/layout/feedback/component.html.erb

@@ -1,11 +1,15 @@
-<span class="max-w-xs text-xs text-right text-gray-600 hidden lg:block">
-  <%= t(".feedback_description") %>
-</span>
-<%= render component("ui/button").new(
-  tag: :a,
-  text: t(".give_feedback"),
-  href: "https://solidus.io/feedback?category=solidus-admin",
-  icon: "feedback-line",
-  scheme: :secondary,
-  target: :_blank,
-) %>
+<%= link_to(
+  "https://solidus.io/feedback?category=solidus-admin",
+  class: 'whitespace-nowrap flex flex-col items-center gap-2 text-gray-500 text-small hover:text-black',
+  target: '_blank',
+) do %>
+
+  <span>
+    <%= render component("ui/badge").new(name: "beta", size: :s, color: :blue) %>
+    <span class="underline"><%= t(".give_feedback") %></span>
+  </span>
+
+  <span class="body-small text-center">
+    <%= t(".feedback_description_html") %>
+  </span>
+<% end %>

admin/app/components/solidus_admin/layout/feedback/component.yml

@@ -2,4 +2,4 @@
 # Use the translation in the example in your template with `t(".hello")`.
 en:
   give_feedback: 'Give feedback'
-  feedback_description: 'We are constantly trying to improve. Please let us know what you think about this admin page.'
+  feedback_description_html: 'We are constantly trying to improve. <br>Please let us know what you think about this admin page.'

admin/app/components/solidus_admin/layout/page_helpers.rb

@@ -2,12 +2,12 @@
 
 module SolidusAdmin::Layout::PageHelpers
   def page(**attrs, &block)
-    tag.div(capture(&block), class: "px-4 relative", "data-controller": stimulus_id, **attrs)
+    tag.div(capture(&block), class: "px-4 relative", "data-controller": stimulus_id, **attrs) +
+      tag.div(render(component("layout/feedback").new), class: "flex justify-center py-10")
   end
 
   def page_header_actions(&block)
     tag.div(safe_join([
-      render(component("layout/feedback").new),
       capture(&block),
     ]), class: "flex gap-2 items-center")
   end

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

@@ -0,0 +1,32 @@
+<%= render component('taxes').new do |layout| %>
+  <% layout.with_actions do %>
+    <%= render component("ui/button").new(
+      tag: :a,
+      text: t('.add'),
+      href: spree.new_admin_tax_category_path,
+      icon: "add-line",
+      class: "align-self-end w-full",
+    ) %>
+  <% end %>
+
+  <%= render component('ui/table').new(
+    id: stimulus_id,
+    data: {
+      class: Spree::TaxCategory,
+      rows: @page.records,
+      url: ->(tax_category) { spree.edit_admin_tax_category_path(tax_category) },
+      prev: prev_page_path,
+      next: next_page_path,
+      columns: columns,
+      batch_actions: batch_actions,
+    },
+    search: {
+      name: :q,
+      value: params[:q],
+      url: solidus_admin.tax_categories_path,
+      searchbar_key: :name_or_description_cont,
+      filters: filters,
+      scopes: scopes,
+    },
+  ) %>
+<% end %>

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

@@ -0,0 +1,58 @@
+# frozen_string_literal: true
+
+class SolidusAdmin::TaxCategories::Index::Component < SolidusAdmin::BaseComponent
+  include SolidusAdmin::Layout::PageHelpers
+
+  def initialize(page:)
+    @page = page
+  end
+
+  def title
+    Spree::TaxCategory.model_name.human.pluralize
+  end
+
+  def prev_page_path
+    solidus_admin.url_for(**request.params, page: @page.number - 1, only_path: true) unless @page.first?
+  end
+
+  def next_page_path
+    solidus_admin.url_for(**request.params, page: @page.next_param, only_path: true) unless @page.last?
+  end
+
+  def batch_actions
+    [
+      {
+        display_name: t('.batch_actions.delete'),
+        action: solidus_admin.tax_categories_path,
+        method: :delete,
+        icon: 'delete-bin-7-line',
+      },
+    ]
+  end
+
+  def filters
+    []
+  end
+
+  def scopes
+    []
+  end
+
+  def columns
+    [
+      :name,
+      :tax_code,
+      :description,
+      {
+        header: :is_default,
+        data: ->(tax_category) {
+          if tax_category.is_default?
+            component('ui/badge').new(name: t('.yes'), color: :green)
+          else
+            component('ui/badge').new(name: t('.no'), color: :graphite_light)
+          end
+        },
+      },
+    ]
+  end
+end

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

@@ -0,0 +1,6 @@
+en:
+  "yes": "Yes"
+  "no": "No"
+  add: 'Add new'
+  batch_actions:
+    delete: 'Delete'

admin/app/components/solidus_admin/taxes/component.html.erb

@@ -0,0 +1,23 @@
+<%= page do %>
+  <%= page_header do %>
+    <%= page_header_title safe_join([
+      tag.div(t(".title")),
+      tag.div(t(".subtitle"), class: "body-small text-gray-500"),
+    ]) %>
+  <% end %>
+
+  <%= page_header do %>
+    <% title = capture do %>
+      <%= render(component('ui/button').new(tag: :a, scheme: :ghost, text: Spree::TaxCategory.model_name.human.pluralize, href: solidus_admin.tax_categories_path, "aria-current": true)) %>
+      <%= render(component('ui/button').new(tag: :a, scheme: :ghost, text: Spree::TaxRate.model_name.human.pluralize, href: spree.admin_tax_rates_path, current: false)) %>
+    <% end %>
+
+    <%= page_header_title title %>
+
+    <%= page_header_actions do %>
+      <%= actions %>
+    <% end %>
+  <% end %>
+
+  <%= content %>
+<% end %>

admin/app/components/solidus_admin/taxes/component.rb

@@ -0,0 +1,6 @@
+# frozen_string_literal: true
+
+class SolidusAdmin::Taxes::Component < SolidusAdmin::BaseComponent
+  include SolidusAdmin::Layout::PageHelpers
+  renders_one :actions
+end

admin/app/components/solidus_admin/taxes/component.yml

@@ -0,0 +1,3 @@
+en:
+  title: "Taxes"
+  subtitle: "Configure tax rates and tax categories for products and shipping in different markets."

admin/app/components/solidus_admin/ui/button/component.rb

@@ -32,31 +32,31 @@ class SolidusAdmin::UI::Button::Component < SolidusAdmin::BaseComponent
     primary: %{
       text-white bg-black
       hover:text-white hover:bg-gray-600
-      active:text-white active:bg-gray-800
+      active:text-white active:bg-gray-800 aria-current:text-white aria-current:bg-gray-800
       focus:text-white focus:bg-gray-700
       disabled:text-gray-400 disabled:bg-gray-100
       aria-disabled:text-gray-400 aria-disabled:bg-gray-100
     },
     secondary: %{
       text-gray-700 bg-white border border-1 border-gray-200
       hover:bg-gray-50
-      active:bg-gray-100
+      active:bg-gray-100            aria-current:bg-gray-100
       focus:bg-gray-50
       disabled:text-gray-300 disabled:bg-white
       aria-disabled:text-gray-300 aria-disabled:bg-white
     },
     danger: %{
       text-red-500 bg-white border border-1 border-red-500
       hover:bg-red-500 hover:border-red-600 hover:text-white
-      active:bg-red-600 active:border-red-700 active:text-white
+      active:bg-red-600 active:border-red-700 active:text-white aria-current:bg-red-600 aria-current:border-red-700 aria-current:text-white
       focus:bg-red-50 focus:bg-red-500 focus:border-red-600 focus:text-white
       disabled:text-red-300 disabled:bg-white disabled:border-red-200
       aria-disabled:text-red-300 aria-disabled:bg-white aria-disabled:border-red-200
     },
     ghost: %{
       text-gray-700 bg-transparent
       hover:bg-gray-50
-      active:bg-gray-100
+      active:bg-gray-100 aria-current:bg-gray-100
       focus:bg-gray-50 focus:ring-gray-300 focus:ring-2
       disabled:text-gray-300 disabled:bg-transparent disabled:border-gray-300
       aria-disabled:text-gray-300 aria-disabled:bg-transparent aria-disabled:border-gray-300

admin/app/components/solidus_admin/ui/table/component.html.erb

@@ -37,13 +37,15 @@
         ) %>
       <% end %>
 
-      <div class="ml-4">
-        <%= render component("ui/button").new(
-          text: t('.cancel'),
-          scheme: :ghost,
-          "data-action": "#{stimulus_id}#cancelSearch",
-        ) %>
-      </div>
+      <% if @search.scopes.any? %>
+        <div class="ml-4">
+          <%= render component("ui/button").new(
+            text: t('.cancel'),
+            scheme: :ghost,
+            "data-action": "#{stimulus_id}#cancelSearch",
+          ) %>
+        </div>
+      <% end %>
     <% end %>
 
     <% if @search.filters.any? %>
@@ -54,28 +56,30 @@
       <% end %>
     <% end %>
 
-    <%= render component("ui/table/toolbar").new("data-#{stimulus_id}-target": "scopesToolbar", hidden: initial_mode != "scopes") do %>
-      <div class="flex-grow">
-        <%= form_with(url: @search.url, method: :get) do %>
-          <% @search.scopes.each do |scope| %>
-            <%= render component("ui/tab").new(
-              tag: :button,
-              type: :submit,
-              text: scope.label,
-              current: scope == @search.current_scope,
-              name: @search.scope_param_name,
-              value: scope.name,
-            ) %>
+    <% if @search.scopes.any? %>
+      <%= render component("ui/table/toolbar").new("data-#{stimulus_id}-target": "scopesToolbar", hidden: initial_mode != "scopes") do %>
+        <div class="flex-grow">
+          <%= form_with(url: @search.url, method: :get) do %>
+            <% @search.scopes.each do |scope| %>
+              <%= render component("ui/tab").new(
+                tag: :button,
+                type: :submit,
+                text: scope.label,
+                current: scope == @search.current_scope,
+                name: @search.scope_param_name,
+                value: scope.name
+              ) %>
+            <% end %>
           <% end %>
-        <% end %>
-      </div>
+        </div>
 
-      <%= render component("ui/button").new(
-        'aria-label': t('.filter'),
-        icon: "filter-3-line",
-        scheme: :secondary,
-        "data-action": "#{stimulus_id}#showSearch",
-      ) %>
+        <%= render component("ui/button").new(
+          "aria-label": t(".filter"),
+          icon: "filter-3-line",
+          scheme: :secondary,
+          "data-action": "#{stimulus_id}#showSearch"
+        ) %>
+      <% end %>
     <% end %>
   </div>
 

admin/app/components/solidus_admin/ui/table/component.js

@@ -64,8 +64,10 @@ export default class extends Controller {
       this.modeValue = "batch"
     } else if (this.searchFieldTarget.value !== '') {
       this.modeValue = "search"
-    } else {
+    } else if (this.hasScopesToolbarTarget) {
       this.modeValue = "scopes"
+    } else {
+      this.modeValue = "search"
     }
 
     this.render()
@@ -76,8 +78,10 @@ export default class extends Controller {
       this.modeValue = "batch"
     } else if (this.searchFieldTarget.value !== '') {
       this.modeValue = "search"
-    } else {
+    } else if (this.hasScopesToolbarTarget) {
       this.modeValue = "scopes"
+    } else {
+      this.modeValue = "search"
     }
 
     this.checkboxTargets.forEach((checkbox) => (checkbox.checked = event.target.checked))
@@ -118,7 +122,8 @@ export default class extends Controller {
     this.batchHeaderTarget.toggleAttribute("hidden", this.modeValue !== "batch")
     this.defaultHeaderTarget.toggleAttribute("hidden", this.modeValue === "batch")
 
-    this.scopesToolbarTarget.toggleAttribute("hidden", this.modeValue !== "scopes")
+    if (this.hasScopesToolbarTarget)
+      this.scopesToolbarTarget.toggleAttribute("hidden", this.modeValue !== "scopes")
 
     // Update the rows background color
     this.checkboxTargets.filter((checkbox) =>

admin/app/components/solidus_admin/ui/table/component.rb

@@ -11,7 +11,9 @@ class Data < Struct.new(:rows, :class, :url, :prev, :next, :columns, :fade, :bat
     def initialize(**args)
       super
 
-      self.columns = columns.map { |column| Column.new(wrap: false, **column) }
+      self.columns = columns.map do |column|
+        column.is_a?(Symbol) ? Column.new(wrap: false, header: column, data: column) : Column.new(wrap: false, **column)
+      end
       self.batch_actions = batch_actions.to_a.map { |action| BatchAction.new(**action) }
     end
 
@@ -152,6 +154,11 @@ def current_scope_name
   end
 
   def initial_mode
-    @initial_mode ||= @search.value[@search.searchbar_key] ? "search" : "scopes"
+    @initial_mode ||=
+      if @search.value[@search.searchbar_key] || @search.scopes.none?
+        "search"
+      else
+        "scopes"
+      end
   end
 end

admin/app/controllers/solidus_admin/tax_categories_controller.rb

@@ -0,0 +1,40 @@
+# frozen_string_literal: true
+
+module SolidusAdmin
+  class TaxCategoriesController < SolidusAdmin::BaseController
+    include SolidusAdmin::ControllerHelpers::Search
+
+    def index
+      tax_categories = apply_search_to(
+        Spree::TaxCategory.order(created_at: :desc, id: :desc),
+        param: :q,
+      )
+
+      set_page_and_extract_portion_from(tax_categories)
+
+      respond_to do |format|
+        format.html { render component('tax_categories/index').new(page: @page) }
+      end
+    end
+
+    def destroy
+      @tax_categories = Spree::TaxCategory.where(id: params[:id])
+
+      Spree::TaxCategory.transaction { @tax_categories.destroy_all }
+
+      flash[:notice] = t('.success')
+      redirect_back_or_to tax_categories_path, status: :see_other
+    end
+
+    private
+
+    def load_tax_category
+      @tax_category = Spree::TaxCategory.find_by!(number: params[:id])
+      authorize! action_name, @tax_category
+    end
+
+    def tax_category_params
+      params.require(:tax_category).permit(:tax_category_id, permitted_tax_category_attributes)
+    end
+  end
+end

admin/config/locales/tax_categories.en.yml

@@ -0,0 +1,6 @@
+en:
+  solidus_admin:
+    tax_categories:
+      title: "Tax Categories"
+      destroy:
+        success: "Tax categories were successfully removed."