Merge pull request #5530 from nebulab/rainerd/admin/payment-methods-i…

…ndex-page

[Admin] Add `Payment Methods` index component

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

@@ -4,7 +4,7 @@
     <%= page_header_actions do %>
       <%= render component("ui/button").new(
         tag: :a,
-        text: t('.create_option_type'),
+        text: t('.add'),
         href: spree.new_admin_option_type_path,
         icon: "add-line",
       ) %>

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

@@ -1,4 +1,4 @@
 en:
   batch_actions:
     delete: 'Delete'
-  create_option_type: Create Option Type
+  add: 'Add new'

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

@@ -0,0 +1,35 @@
+<%= page do %>
+  <%= page_header do %>
+    <%= page_header_title title %>
+    <%= page_header_actions do %>
+      <%= render component("ui/button").new(
+        tag: :a,
+        text: t('.add'),
+        href: spree.new_admin_payment_method_path,
+        icon: "add-line",
+      ) %>
+    <% end %>
+  <% end %>
+
+  <%= render component('ui/table').new(
+    id: stimulus_id,
+    data: {
+      class: Spree::PaymentMethod,
+      rows: @payment_methods,
+      url: ->(payment_method) { spree.edit_admin_payment_method_path(payment_method) },
+      columns: columns,
+      batch_actions: batch_actions,
+    },
+    search: {
+      name: :q,
+      value: params[:q],
+      url: solidus_admin.payment_methods_path,
+      searchbar_key: :name_or_description_cont,
+      scopes: scopes,
+    },
+    sortable: {
+      url: ->(payment_method) { solidus_admin.move_payment_method_path(payment_method) },
+      param: 'position',
+    },
+  ) %>
+<% end %>

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

@@ -0,0 +1,81 @@
+# frozen_string_literal: true
+
+class SolidusAdmin::PaymentMethods::Index::Component < SolidusAdmin::BaseComponent
+  include SolidusAdmin::Layout::PageHelpers
+
+  def initialize(payment_methods:)
+    @payment_methods = payment_methods
+  end
+
+  def title
+    Spree::PaymentMethod.model_name.human.pluralize
+  end
+
+  def batch_actions
+    [
+      {
+        display_name: t('.batch_actions.delete'),
+        action: solidus_admin.payment_methods_path,
+        method: :delete,
+        icon: 'delete-bin-7-line',
+      },
+    ]
+  end
+
+  def scopes
+    [
+      { name: :all, label: t('.scopes.all'), default: true },
+      { name: :active, label: t('.scopes.active') },
+      { name: :inactive, label: t('.scopes.inactive') },
+      { name: :storefront, label: t('.scopes.storefront') },
+      { name: :admin, label: t('.scopes.admin') },
+    ]
+  end
+
+  def columns
+    [
+      {
+        header: :name,
+        data: ->(payment_method) do
+          content_tag :div, payment_method.name
+        end
+      },
+      {
+        header: :type,
+        data: ->(payment_method) do
+          content_tag :div, payment_method.model_name.human
+        end
+      },
+      {
+        header: :available_to_users,
+        data: ->(payment_method) do
+          if payment_method.available_to_users?
+            component('ui/badge').new(name: t('.yes'), color: :green)
+          else
+            component('ui/badge').new(name: t('.no'), color: :graphite_light)
+          end
+        end
+      },
+      {
+        header: :available_to_admin,
+        data: ->(payment_method) do
+          if payment_method.available_to_admin?
+            component('ui/badge').new(name: t('.yes'), color: :green)
+          else
+            component('ui/badge').new(name: t('.no'), color: :graphite_light)
+          end
+        end
+      },
+      {
+        header: :status,
+        data: ->(payment_method) do
+          if payment_method.active?
+            render component('ui/badge').new(name: t('.status.active'), color: :green)
+          else
+            render component('ui/badge').new(name: t('.status.inactive'), color: :graphite_light)
+          end
+        end
+      },
+    ]
+  end
+end

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

@@ -0,0 +1,15 @@
+en:
+  add: 'Add new'
+  "yes": "Yes"
+  "no": "No"
+  status:
+    active: Active
+    inactive: Inactive
+  scopes:
+    active: Active
+    inactive: Inactive
+    admin: Admin
+    storefront: Storefront
+    all: All
+  batch_actions:
+    delete: 'Delete'

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

@@ -4,7 +4,7 @@
     <%= page_header_actions do %>
       <%= render component("ui/button").new(
         tag: :a,
-        text: t('.create_promotion_category'),
+        text: t('.add'),
         href: spree.new_admin_promotion_category_path,
         icon: "add-line",
       ) %>

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

@@ -1,4 +1,4 @@
 en:
   batch_actions:
     delete: 'Delete'
-  create_promotion_category: Create Promotion Category
+  add: 'Add new'

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

@@ -4,7 +4,7 @@
     <%= page_header_actions do %>
       <%= render component("ui/button").new(
         tag: :a,
-        text: t('.add_property'),
+        text: t('.add'),
         href: spree.new_admin_property_path,
         icon: "add-line",
       ) %>

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

@@ -1,4 +1,4 @@
 en:
-  add_property: 'Add Property'
+  add: 'Add new'
   batch_actions:
     delete: 'Delete'

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

@@ -4,7 +4,7 @@
     <%= page_header_actions do %>
       <%= render component("ui/button").new(
         tag: :a,
-        text: t('.create_taxonomy'),
+        text: t('.add'),
         href: spree.new_admin_taxonomy_path,
         icon: "add-line",
       ) %>

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

@@ -1,4 +1,4 @@
 en:
   batch_actions:
     delete: 'Delete'
-  create_taxonomy: Create Taxonomy
+  add: 'Add new'

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

@@ -7,7 +7,7 @@
   data-controller="<%= stimulus_id %>"
   data-<%= stimulus_id %>-selected-row-class="bg-gray-15"
   data-<%= stimulus_id %>-mode-value="<%= initial_mode %>"
-  data-<%= stimulus_id %>-sortable-value="<%= @sortable.present? %>"
+  data-<%= stimulus_id %>-sortable-value="<%= should_enable_sortable? %>"
   data-action="
     <%= component("ui/table/ransack_filter").stimulus_id %>:search-><%= stimulus_id %>#search
     <%= component("ui/table/ransack_filter").stimulus_id %>:showSearch-><%= stimulus_id %>#showSearch
@@ -44,7 +44,7 @@
             <%= render component("ui/button").new(
               text: t('.cancel'),
               scheme: :ghost,
-              "data-action": "#{stimulus_id}#cancelSearch",
+              "data-action": "#{stimulus_id}#resetSearchAndFilters",
             ) %>
           </div>
         <% end %>
@@ -130,7 +130,7 @@
     <tbody
       class="bg-white text-3.5 line-[150%] text-black"
       data-<%= stimulus_id %>-target="tableBody"
-      <%= "data-controller=sortable" if @sortable&.url %>
+      <%= "data-controller=sortable" if should_enable_sortable? %>
       <%= "data-sortable-param-value=#{@sortable.param}" if @sortable&.param %>
       <%= "data-sortable-handle-value=#{@sortable.handle}" if @sortable&.handle %>
       <%= "data-sortable-animation-value=#{@sortable.animation}" if @sortable&.animation %>

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

@@ -31,6 +31,17 @@ export default class extends Controller {
     this.search = debounce(this.search.bind(this), 200)
   }
 
+  // Determine if sortable should be enabled
+  modeValueChanged() {
+    const shouldSetSortable = this.sortableValue && this.modeValue !== "batch" && this.modeValue !== "search"
+
+    if (shouldSetSortable) {
+      this.tableBodyTarget.setAttribute('data-controller', 'sortable')
+    } else {
+      this.tableBodyTarget.removeAttribute('data-controller')
+    }
+  }
+
   showSearch(event) {
     this.modeValue = "search"
     this.render()
@@ -46,18 +57,12 @@ export default class extends Controller {
     this.search()
   }
 
-  cancelSearch() {
-    this.resetFilters()
-    this.search()
-  }
-
-  resetFilters() {
-    if (!this.hasFilterToolbarTarget) return
-
-    for (const fieldset of this.filterToolbarTarget.querySelectorAll('fieldset')) {
-      fieldset.setAttribute('disabled', true)
+  resetSearchAndFilters() {
+    if (this.hasFilterToolbarTarget) {
+      this.filterToolbarTarget.querySelectorAll('fieldset').forEach(fieldset => fieldset.disabled = true)
     }
-    this.searchFieldTarget.setAttribute('disabled', true)
+
+    this.searchFieldTarget.disabled = true
     this.searchFormTarget.submit()
   }
 
@@ -135,13 +140,6 @@ export default class extends Controller {
       checkbox.closest("tr").classList.toggle(this.selectedRowClass, checkbox.checked),
     )
 
-    // Determine if sortable should be enabled
-    if (this.sortableValue && this.modeValue !== "batch" && this.modeValue !== "search") {
-      this.tableBodyTarget.setAttribute('data-controller', 'sortable');
-    } else {
-      this.tableBodyTarget.removeAttribute('data-controller');
-    }
-
     // Update the selected rows count
     this.selectedRowsCountTarget.textContent = `${selectedRows.length}`
 

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

@@ -39,6 +39,10 @@ def default_scope
       scopes.find(&:default)
     end
 
+    def on_default_scope?
+      current_scope == default_scope
+    end
+
     def scope_param_name
       "#{name}[scope]"
     end
@@ -163,4 +167,8 @@ def initial_mode
         "scopes"
       end
   end
+
+  def should_enable_sortable?
+    @sortable && @search&.on_default_scope?
+  end
 end

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

@@ -18,6 +18,7 @@
   <p class="body-tiny-bold leading-none"><%= @text %></p>
 
   <button
+    type="button"
     class="ml-2 align-text-bottom"
     title="<%= t('.close_text') %>"
     data-action="<%= stimulus_id %>#close"

admin/app/controllers/solidus_admin/payment_methods_controller.rb

@@ -0,0 +1,50 @@
+# frozen_string_literal: true
+
+module SolidusAdmin
+  class PaymentMethodsController < SolidusAdmin::BaseController
+    include SolidusAdmin::ControllerHelpers::Search
+
+    before_action :load_payment_method, only: [:move]
+
+    search_scope(:all)
+    search_scope(:active, default: true, &:active)
+    search_scope(:inactive) { _1.where.not(active: true) }
+    search_scope(:storefront, &:available_to_users)
+    search_scope(:admin, &:available_to_admin)
+
+    def index
+      @payment_methods = apply_search_to(
+        Spree::PaymentMethod.ordered_by_position,
+        param: :q,
+      )
+
+      respond_to do |format|
+        format.html { render component('payment_methods/index').new(payment_methods: @payment_methods) }
+      end
+    end
+
+    def move
+      @payment_method.insert_at(params[:position].to_i)
+
+      respond_to do |format|
+        format.js { head :no_content }
+      end
+    end
+
+    def destroy
+      @payment_methods = Spree::PaymentMethod.where(id: params[:id])
+
+      Spree::PaymentMethod.transaction { @payment_methods.destroy_all }
+
+      flash[:notice] = t('.success')
+      redirect_back_or_to payment_methods_path, status: :see_other
+    end
+
+    private
+
+    def load_payment_method
+      @payment_method = Spree::PaymentMethod.find_by!(id: params[:id])
+      authorize! action_name, @payment_method
+    end
+  end
+end

admin/config/locales/payment_methods.en.yml

@@ -0,0 +1,6 @@
+en:
+  solidus_admin:
+    payment_methods:
+      title: "Payment Methods"
+      destroy:
+        success: "Payment Methods were successfully removed."

admin/config/routes.rb

@@ -84,4 +84,13 @@
       delete :destroy
     end
   end
+
+  resources :payment_methods, only: [:index] do
+    collection do
+      delete :destroy
+    end
+    member do
+      patch :move
+    end
+  end
 end