solidus_admin 0.1.0 → 0.3.0

data/app/components/solidus_admin/ui/pages/index/component.rb

@@ -0,0 +1,105 @@
+# frozen_string_literal: true
+
+class SolidusAdmin::UI::Pages::Index::Component < SolidusAdmin::BaseComponent
+  include SolidusAdmin::Layout::PageHelpers
+
+  Tab = Struct.new(:text, :href, :current, keyword_init: true)
+
+  # Template methods
+  def tabs; end
+  def model_class; end
+  def back_url; end
+  def search_key; end
+  def search_url; end
+  def page_actions; end
+  def sidebar; end
+  def sortable_options; end
+  def row_url(_record); end
+  def batch_actions; []; end
+  def scopes; []; end
+  def filters; []; end
+  def columns; []; end
+
+  def initialize(page:)
+    @page = page
+    @tabs = tabs&.map { |tab| Tab.new(**tab) }
+  end
+
+  def row_fade(_record)
+    false
+  end
+
+  def title
+    model_class.model_name.human.pluralize
+  end
+
+  def search_params
+    params[:q]
+  end
+
+  def search_name
+    :q
+  end
+
+  def rows
+    @page.records
+  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 search_options
+    return unless search_url
+
+    {
+      name: search_name,
+      value: search_params,
+      url: search_url,
+      searchbar_key: search_key,
+      filters: filters,
+      scopes: scopes,
+    }
+  end
+
+  def render_title
+    back_url = self.back_url
+
+    safe_join [
+      (page_header_back back_url if back_url),
+      page_header_title(title),
+    ]
+  end
+
+  def render_table
+    render component('ui/table').new(
+      id: stimulus_id,
+      data: {
+        class: model_class,
+        rows: rows,
+        fade: -> { row_fade(_1) },
+        prev: prev_page_path,
+        next: next_page_path,
+        columns: columns,
+        batch_actions: batch_actions,
+        url: -> { row_url(_1) },
+      },
+      search: search_options,
+      sortable: sortable_options,
+    )
+  end
+
+  def render_sidebar
+    sidebar = self.sidebar
+
+    page_with_sidebar_aside { sidebar } if sidebar
+  end
+
+  def turbo_frames
+    []
+  end
+end

data/app/components/solidus_admin/ui/panel/component.html.erb

@@ -22,29 +22,18 @@
   <% end %>
 
   <% if @title %>
-    <section class="border-gray-100 border-t w-full first-of-type:border-t-0 p-6">
+    <%= render_section do %>
       <h2>
-        <span class="font-semibold text-xl"><%= @title %></span>
+        <span class="font-semibold text-base"><%= @title %></span>
         <%= render component("ui/toggletip").new(text: @title_hint) if @title_hint %>
       </h2>
-    </section>
+    <% end %>
   <% end %>
 
   <% sections.each do |section| %>
     <%= section %>
   <% end %>
 
-  <% if content.present? %>
-    <section class="border-gray-100 border-t w-full first-of-type:border-t-0 p-6">
-      <%= content %>
-    </section>
-  <% end %>
-
-  <% if action? %>
-    <section class="border-gray-100 border-t w-full first-of-type:border-t-0 p-6">
-      <div class="flex justify-between items-center">
-        <%= action %>
-      </div>
-    </section>
-  <% end %>
+  <%= render_section { content } if content.present? %>
+  <%= render_section { tag.div(action, class: "flex justify-between items-center") } if action? %>
 </div>

data/app/components/solidus_admin/ui/panel/component.rb

@@ -10,13 +10,8 @@ class SolidusAdmin::UI::Panel::Component < SolidusAdmin::BaseComponent
     )
   }
 
-  renders_many :sections, ->(wide: false, high: false, **args, &block) do
-    tag.section(**args, class: "
-      border-gray-100 border-t w-full first-of-type:border-t-0
-      #{'px-6' unless wide}
-      #{'py-6' unless high}
-      #{args[:class]}
-    ", &block)
+  renders_many :sections, ->(**args, &block) do
+    render_section(**args, &block)
   end
 
   renders_many :menus, ->(name, url, **args) do
@@ -33,4 +28,13 @@ class SolidusAdmin::UI::Panel::Component < SolidusAdmin::BaseComponent
     @title = title
     @title_hint = title_hint
   end
+
+  def render_section(wide: false, high: false, **args, &block)
+    tag.section(**args, class: "
+      border-gray-100 border-t w-full first-of-type:border-t-0
+      #{'px-6' unless wide}
+      #{'py-4' unless high}
+      #{args[:class]}
+    ", &block)
+  end
 end

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

@@ -3,6 +3,7 @@
     rounded-lg
     border
     border-gray-100
+    <%= 'overflow-hidden' unless @search %>
   "
   data-controller="<%= stimulus_id %>"
   data-<%= stimulus_id %>-selected-row-class="bg-gray-15"
@@ -111,7 +112,7 @@
       </tr>
     </thead>
 
-    <% if @data.batch_actions %>
+    <% if @data.batch_actions && @data.rows.any? %>
       <thead
         data-<%= stimulus_id %>-target="batchHeader"
         class="bg-white color-black text-xs leading-none text-left"

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

@@ -104,7 +104,15 @@ export default class extends Controller {
     if (this.modeValue === "batch") {
       this.toggleCheckbox(event.currentTarget)
     } else {
-      window.Turbo.visit(event.params.url)
+      const url = new URL(event.params.url, "http://dummy.com")
+      const params = new URLSearchParams(url.search)
+      const frameId = params.get('_turbo_frame')
+      const frame = frameId ? { frame: frameId } : {}
+      // remove the custom _turbo_frame param from url search:
+      params.delete('_turbo_frame')
+      url.search = params.toString()
+
+      window.Turbo.visit(url.pathname + url.search, frame)
     }
   }
 
@@ -117,8 +125,29 @@ export default class extends Controller {
     }
   }
 
+  selectedRows() {
+    return this.checkboxTargets.filter((checkbox) => checkbox.checked)
+  }
+
+  confirmAction(event) {
+    const message = event.params.message
+      .replace(
+        "${count}",
+        this.selectedRows().length
+      ).replace(
+        "${resource}",
+        this.selectedRows().length > 1 ?
+        event.params.resourcePlural :
+        event.params.resourceSingular
+      )
+
+    if (!confirm(message)) {
+      event.preventDefault()
+    }
+  }
+
   render() {
-    const selectedRows = this.checkboxTargets.filter((checkbox) => checkbox.checked)
+    const selectedRows = this.selectedRows()
 
     if (this.hasSearchFieldTarget) {
       this.searchToolbarTarget.toggleAttribute("hidden", this.modeValue !== "search")

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

@@ -1,11 +1,11 @@
 # frozen_string_literal: true
 
 class SolidusAdmin::UI::Table::Component < SolidusAdmin::BaseComponent
-  BatchAction = Struct.new(:display_name, :icon, :action, :method, keyword_init: true) # rubocop:disable Lint/StructNewOverride
   Column = Struct.new(:header, :data, :col, :wrap, keyword_init: true)
-  Filter = Struct.new(:presentation, :combinator, :attribute, :predicate, :options, keyword_init: true)
-  Scope = Struct.new(:name, :label, :default, keyword_init: true)
   Sortable = Struct.new(:url, :param, :animation, :handle, keyword_init: true)
+  Scope = Struct.new(:label, :name, :default, keyword_init: true)
+  Filter = Struct.new(:label, :combinator, :attribute, :predicate, :options, keyword_init: true)
+  BatchAction = Struct.new(:label, :icon, :action, :require_confirmation, :method, keyword_init: true) # rubocop:disable Lint/StructNewOverride
   private_constant :BatchAction, :Column, :Filter, :Scope, :Sortable
 
   class Data < Struct.new(:rows, :class, :url, :prev, :next, :columns, :fade, :batch_actions, keyword_init: true) # rubocop:disable Lint/StructNewOverride,Style/StructInheritance
@@ -18,6 +18,10 @@ class SolidusAdmin::UI::Table::Component < SolidusAdmin::BaseComponent
       self.batch_actions = batch_actions.to_a.map { |action| BatchAction.new(**action) }
     end
 
+    def singular_name
+      self[:class].model_name.human if self[:class]
+    end
+
     def plural_name
       self[:class].model_name.human.pluralize if self[:class]
     end
@@ -59,7 +63,7 @@ class SolidusAdmin::UI::Table::Component < SolidusAdmin::BaseComponent
   def initialize(id:, data:, search: nil, sortable: nil)
     @id = id
     @data = Data.new(**data)
-    @data.columns.unshift selectable_column if @data.batch_actions.present?
+    @data.columns.unshift selectable_column if @data.batch_actions.present? && @data.rows.present?
     @search = Search.new(**search) if search
     @sortable = Sortable.new(**sortable) if sortable
   end
@@ -97,7 +101,7 @@ class SolidusAdmin::UI::Table::Component < SolidusAdmin::BaseComponent
   end
 
   def render_batch_action_button(batch_action)
-    render component("ui/button").new(
+    params = {
       name: request_forgery_protection_token,
       value: form_authenticity_token(form_options: {
         action: batch_action.action,
@@ -108,14 +112,26 @@ class SolidusAdmin::UI::Table::Component < SolidusAdmin::BaseComponent
       form: batch_actions_form_id,
       type: :submit,
       icon: batch_action.icon,
-      text: batch_action.display_name,
+      text: batch_action.label,
       scheme: :secondary,
-    )
+    }
+
+    if batch_action.require_confirmation
+      params["data-action"] = "click->#{stimulus_id}#confirmAction"
+      params["data-#{stimulus_id}-message-param"] = t(
+        ".action_confirmation",
+        action: batch_action.label.downcase
+      )
+      params["data-#{stimulus_id}-resource-singular-param"] = @data.singular_name.downcase
+      params["data-#{stimulus_id}-resource-plural-param"] = @data.plural_name.downcase
+    end
+
+    render component("ui/button").new(**params)
   end
 
   def render_ransack_filter_dropdown(filter, index)
     render component("ui/table/ransack_filter").new(
-      presentation: filter.presentation,
+      presentation: filter.label,
       search_param: @search.name,
       combinator: filter.combinator,
       attribute: filter.attribute,

data/app/components/solidus_admin/ui/table/component.yml

@@ -5,6 +5,7 @@ en:
   select_row: 'Select row'
   filter: 'Filter'
   search_placeholder: 'Search all %{resources}'
+  action_confirmation: 'Are you sure you want to %{action} ${count} ${resource}?'
   refine_search: 'Refine Search'
   batch_actions: Batch actions
   cancel: Cancel

data/app/components/solidus_admin/ui/thumbnail/component.rb

@@ -31,7 +31,7 @@ class SolidusAdmin::UI::Thumbnail::Component < SolidusAdmin::BaseComponent
 
   def self.for(record, **attrs)
     case record
-    when Spree::PromotionAction then new(icon: "megaphone-line", **attrs)
+    when *Spree::Config.adjustment_promotion_source_types then new(icon: "megaphone-line", **attrs)
     when Spree::UnitCancel then new(icon: "close-circle-line", **attrs)
     when Spree::TaxRate then new(icon: "percent-line", **attrs)
     when Spree::LineItem then self.for(record.variant, **attrs)

data/app/components/solidus_admin/ui/thumbnail_with_caption/component.html.erb

@@ -0,0 +1,17 @@
+<figure class="flex items-center gap-2">
+  <% if content? %>
+    <%= content %>
+  <% else %>
+    <%= icon_thumbnail %>
+  <% end %>
+  <figcaption class="flex flex-col gap-0 max-w-[15rem]">
+    <div class="text-black body-small whitespace-nowrap text-ellipsis overflow-hidden">
+      <%= caption %>
+    </div>
+    <% if detail %>
+      <div class="text-gray-500 body-small whitespace-nowrap text-ellipsis overflow-hidden">
+        <%= detail %>
+      </div>
+    <% end %>
+  </figcaption>
+</figure>

data/app/components/solidus_admin/ui/thumbnail_with_caption/component.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+class SolidusAdmin::UI::ThumbnailWithCaption::Component < SolidusAdmin::BaseComponent
+  attr_reader :icon, :caption, :detail
+
+  def initialize(icon: "question-line", caption: "", detail: nil)
+    @icon = icon
+    @caption = caption
+    @detail = detail
+  end
+
+  def icon_thumbnail
+    render component("ui/thumbnail").new(icon: icon)
+  end
+end

data/app/components/solidus_admin/users/addresses/component.html.erb

@@ -0,0 +1,46 @@
+<%= page do %>
+  <%= page_header do %>
+    <%= page_header_back(solidus_admin.users_path) %>
+    <%= page_header_title(t(".title", email: @user.email)) %>
+
+    <%= page_header_actions do %>
+      <%= render component("ui/button").new(tag: :a, text: t(".create_order_for_user"), href: spree.new_admin_order_path(user_id: @user.id)) %>
+    <% end %>
+  <% end %>
+
+  <%= page_header do %>
+    <% tabs.each do |tab| %>
+      <%= render(component("ui/button").new(tag: :a, scheme: :ghost, text: tab[:text], 'aria-current': tab[:current], href: tab[:href])) %>
+    <% end %>
+  <% end %>
+
+  <%= page_with_sidebar do %>
+    <%= page_with_sidebar_main do %>
+      <%= render component('ui/panel').new(title: t(".billing_address")) do %>
+        <%= form_for @user, url: solidus_admin.update_addresses_user_path(@user), method: :put, html: { id: "#{form_id}_billing", autocomplete: "off", class: "bill_address" } do |f| %>
+
+          <%= render component('ui/forms/address').new(address: @bill_address, name: "user[bill_address_attributes]") %>
+          <div class="py-1.5 text-center">
+            <%= render component("ui/button").new(tag: :button, text: t(".update"), form: "#{form_id}_billing") %>
+            <%= render component("ui/button").new(tag: :a, text: t(".cancel"), href: solidus_admin.addresses_user_path(@user), scheme: :secondary) %>
+          </div>
+        <% end %>
+      <% end %>
+
+      <%= render component('ui/panel').new(title: t(".shipping_address")) do %>
+        <%= form_for @user, url: solidus_admin.update_addresses_user_path(@user), method: :put, html: { id: "#{form_id}_shipping", autocomplete: "off", class: "ship_address"  } do |f| %>
+
+          <%= render component('ui/forms/address').new(address: @ship_address, name: "user[ship_address_attributes]") %>
+          <div class="py-1.5 text-center">
+            <%= render component("ui/button").new(tag: :button, text: t(".update"), form: "#{form_id}_shipping") %>
+            <%= render component("ui/button").new(tag: :a, text: t(".cancel"), href: solidus_admin.addresses_user_path(@user), scheme: :secondary) %>
+          </div>
+        <% end %>
+      <% end %>
+    <% end %>
+
+    <%= page_with_sidebar_aside do %>
+      <%= render component("users/stats").new(user: @user) %>
+    <% end %>
+  <% end %>
+<% end %>

data/app/components/solidus_admin/users/addresses/component.rb

@@ -0,0 +1,61 @@
+# frozen_string_literal: true
+
+class SolidusAdmin::Users::Addresses::Component < SolidusAdmin::BaseComponent
+  include SolidusAdmin::Layout::PageHelpers
+
+  def initialize(user:, address: nil, type: nil)
+    @user = user
+    @bill_address = bill_address(address, type)
+    @ship_address = ship_address(address, type)
+  end
+
+  def form_id
+    @form_id ||= "#{stimulus_id}--form-#{@user.id}"
+  end
+
+  def tabs
+    [
+      {
+        text: t('.account'),
+        href: solidus_admin.user_path(@user),
+        current: false,
+      },
+      {
+        text: t('.addresses'),
+        href: solidus_admin.addresses_user_path(@user),
+        current: true,
+      },
+      {
+        text: t('.order_history'),
+        href: solidus_admin.orders_user_path(@user),
+        current: false,
+      },
+      {
+        text: t('.items'),
+        href: spree.items_admin_user_path(@user),
+        current: false,
+      },
+      {
+        text: t('.store_credit'),
+        href: spree.admin_user_store_credits_path(@user),
+        current: false,
+      },
+    ]
+  end
+
+  def bill_address(address, type)
+    if address.present? && type == "bill"
+      address
+    else
+      @user.bill_address || Spree::Address.build_default
+    end
+  end
+
+  def ship_address(address, type)
+    if address.present? && type == "ship"
+      address
+    else
+      @user.ship_address || Spree::Address.build_default
+    end
+  end
+end

data/app/components/solidus_admin/users/addresses/component.yml

@@ -0,0 +1,14 @@
+en:
+  title: "Users / %{email} / Addresses"
+  account: Account
+  addresses: Addresses
+  order_history: Order History
+  items: Items
+  store_credit: Store Credit
+  last_active: Last Active
+  create_order_for_user: Create order for this user
+  update: Update
+  cancel: Cancel
+  back: Back
+  billing_address: Billing Address
+  shipping_address: Shipping Address

data/app/components/solidus_admin/users/edit/api_access/component.html.erb

@@ -0,0 +1,49 @@
+<%= render component('ui/panel').new(title: t('.api_access')) do %>
+  <section>
+    <% if @user.spree_api_key.present? %>
+      <div id="current-api-key">
+        <h2 class="py-1.5 font-semibold"><%= t('.key') %></h2>
+        <% if @user == helpers.current_solidus_admin_user %>
+          <%= @user.spree_api_key %>
+        <% else %>
+          <i>(<%= t('spree.hidden') %>)</i>
+        <% end %>
+      </div>
+
+      <div class="py-1.5 text-center">
+        <%= form_with url: spree.admin_user_api_key_path(@user), method: :delete, local: true, html: { class: 'clear_api_key inline-flex' } do %>
+          <%= render component("ui/button").new(
+            text: t('.clear_key'),
+            scheme: :secondary,
+            type: :submit,
+            "data-action": "click->#{stimulus_id}#confirm",
+            "data-#{stimulus_id}-message-param": t(".confirm_clear_key"),
+          ) %>
+        <% end %>
+
+        <%= form_with url: spree.admin_user_api_key_path(@user), method: :post, local: true, html: { class: 'regen_api_key inline-flex' } do %>
+          <%= render component("ui/button").new(
+            text: t('.regenerate_key'),
+            scheme: :secondary,
+            type: :submit,
+            "data-action": "click->#{stimulus_id}#confirm",
+            "data-#{stimulus_id}-message-param": t(".confirm_regenerate_key"),
+          ) %>
+        <% end %>
+      </div>
+
+    <% else %>
+      <div class="no-objects-found"><%= t('.no_key') %></div>
+      <div class="filter-actions actions">
+        <div class="py-1.5 text-center">
+          <%= form_with url: spree.admin_user_api_key_path(@user), method: :post, local: true, html: { class: 'generate_api_key inline-flex' } do %>
+            <%= render component("ui/button").new(
+              text: t('.generate_key'),
+              type: :submit,
+            ) %>
+          <% end %>
+        </div>
+      </div>
+    <% end %>
+  </section>
+<% end %>

data/app/components/solidus_admin/users/edit/api_access/component.js

@@ -0,0 +1,9 @@
+import { Controller } from "@hotwired/stimulus"
+
+export default class extends Controller {
+  confirm(event) {
+    if (!confirm(event.params.message)) {
+      event.preventDefault()
+    }
+  }
+}

data/app/components/solidus_admin/users/edit/api_access/component.rb

@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+class SolidusAdmin::Users::Edit::ApiAccess::Component < SolidusAdmin::BaseComponent
+  def initialize(user:)
+    @user = user
+  end
+end

data/app/components/solidus_admin/users/edit/api_access/component.yml

@@ -0,0 +1,10 @@
+en:
+  api_access: API Access
+  no_key: No key
+  key: "Key"
+  generate_key: Generate API key
+  clear_key: Clear key
+  regenerate_key: Regenerate key
+  hidden: Hidden
+  confirm_clear_key: Are you sure you want to clear this user's API key? It will invalidate the existing key.
+  confirm_regenerate_key: Are you sure you want to regenerate this user's API key? It will invalidate the existing key.

data/app/components/solidus_admin/users/edit/component.html.erb

@@ -0,0 +1,52 @@
+<%= page do %>
+  <%= page_header do %>
+    <%= page_header_back(solidus_admin.users_path) %>
+    <%= page_header_title(t(".title", email: @user.email)) %>
+
+    <% # @todo: I am not sure how we want to handle Cancan stuff in the new admin. %>
+    <% # if can?(:admin, Spree::Order) && can?(:create, Spree::Order) %>
+      <%= page_header_actions do %>
+        <%= render component("ui/button").new(tag: :a, text: t(".create_order_for_user"), href: spree.new_admin_order_path(user_id: @user.id)) %>
+      <% end %>
+    <% # end %>
+  <% end %>
+
+  <%= page_header do %>
+    <% tabs.each do |tab| %>
+      <%= render(component("ui/button").new(tag: :a, scheme: :ghost, text: tab[:text], 'aria-current': tab[:current], href: tab[:href])) %>
+    <% end %>
+  <% end %>
+
+  <%= page_with_sidebar do %>
+    <%= page_with_sidebar_main do %>
+
+      <%= render component('ui/panel').new(title: Spree.user_class.model_name.human) do %>
+        <%= form_for @user, url: solidus_admin.user_path(@user), html: { id: form_id, autocomplete: "off" } do |f| %>
+          <div class="py-1.5">
+            <%= render component("ui/forms/field").text_field(f, :email) %>
+          </div>
+          <div class="py-1.5">
+            <%= render component("ui/forms/field").text_field(f, :password) %>
+          </div>
+          <div class="py-1.5">
+            <%= render component("ui/forms/field").text_field(f, :password_confirmation) %>
+          </div>
+          <div class="py-1.5">
+            <%= render component("ui/checkbox_row").new(options: role_options, row_title: "Roles", form: f, method: "spree_role_ids", layout: :subsection) %>
+          </div>
+          <div class="py-1.5 text-center">
+            <%= render component("ui/button").new(tag: :button, text: t(".update"), form: form_id) %>
+            <%= render component("ui/button").new(tag: :a, text: t(".cancel"), href: solidus_admin.user_path(@user), scheme: :secondary) %>
+          </div>
+        <% end %>
+      <% end %>
+
+      <%= render component("users/edit/api_access").new(user: @user) %>
+
+    <% end %>
+
+    <%= page_with_sidebar_aside do %>
+      <%= render component("users/stats").new(user: @user) %>
+    <% end %>
+  <% end %>
+<% end %>

data/app/components/solidus_admin/users/edit/component.rb

@@ -0,0 +1,51 @@
+# frozen_string_literal: true
+
+class SolidusAdmin::Users::Edit::Component < SolidusAdmin::BaseComponent
+  include SolidusAdmin::Layout::PageHelpers
+
+  def initialize(user:)
+    @user = user
+  end
+
+  def form_id
+    @form_id ||= "#{stimulus_id}--form-#{@user.id}"
+  end
+
+  def tabs
+    [
+      {
+        text: t('.account'),
+        href: solidus_admin.user_path(@user),
+        current: action_name == "edit",
+      },
+      {
+        text: t('.addresses'),
+        href: solidus_admin.addresses_user_path(@user),
+        current: action_name == "addresses",
+      },
+      {
+        text: t('.order_history'),
+        href: solidus_admin.orders_user_path(@user),
+        current: action_name == "orders",
+      },
+      {
+        text: t('.items'),
+        href: spree.items_admin_user_path(@user),
+        # @todo: update this "current" logic once folded into new admin
+        current: action_name != "edit",
+      },
+      {
+        text: t('.store_credit'),
+        href: spree.admin_user_store_credits_path(@user),
+        # @todo: update this "current" logic once folded into new admin
+        current: action_name != "edit",
+      },
+    ]
+  end
+
+  def role_options
+    Spree::Role.all.map do |role|
+      { label: role.name, id: role.id }
+    end
+  end
+end