solidus_admin 0.4.0 → 0.5.0

data/app/javascript/solidus_admin/utils.js

@@ -6,3 +6,43 @@ export const debounce = (func, wait) => {
     timeout = setTimeout(func, wait)
   }
 }
+
+export const setValidity = (element, error) => {
+  if (!error) return;
+
+  element.setCustomValidity(error);
+
+  const clearValidity = () => {
+    element.setCustomValidity("");
+  }
+
+  let clearOn;
+
+  switch (element.tagName) {
+    case "INPUT":
+    case "TEXTAREA":
+      clearOn = "input";
+      break;
+    case "SELECT":
+      clearOn = "change";
+      break;
+  }
+
+  element.addEventListener(clearOn, clearValidity, { once: true });
+};
+
+export function parseLinkHeader(header) {
+  if (!header) return {};
+
+  const links = {};
+  header.split(",").forEach((link) => {
+    // match against something like this '<https://example.com>; rel="next"'
+    const match = link.match(/<([^>]+)>\s*;\s*rel="([^"]+)"/);
+    if (match) {
+      const [, url, rel] = match;
+      links[rel] = url;
+    }
+  });
+
+  return links;
+}

data/app/javascript/solidus_admin/web_components/solidus_select.js

@@ -0,0 +1,90 @@
+import TomSelect from "solidus_admin/tom-select";
+import { setValidity } from "solidus_admin/utils";
+
+class SolidusSelect extends HTMLSelectElement {
+  static observedAttributes = ["synced"];
+
+  connectedCallback() {
+    const tomselect = new TomSelect(this, this.tomSelectSettings);
+
+    this.setAttribute("synced", "true");
+
+    // set default style for inner input field
+    tomselect.control_input.style =
+      "flex: 1 1 auto;\n" +
+      "line-height: inherit !important;\n" +
+      "max-height: none !important;\n" +
+      "max-width: 100% !important;\n" +
+      "min-height: 0 !important;\n" +
+      "min-width: 7rem;\n" +
+      "outline: none !important;"
+
+    this.setAttribute("hidden", "true");
+    this.setAttribute("aria-hidden", "true");
+    setValidity(this, this.dataset.errorMessage);
+  }
+
+  attributeChangedCallback(name, oldValue, newValue) {
+    switch (name) {
+      case "synced":
+        if (newValue === "false") {
+          const keepNone = function() { return false; }
+          this.tomselect.clearOptions(keepNone);
+          this.tomselect.sync();
+          this.setAttribute("synced", "true");
+        }
+        break;
+    }
+  }
+
+  get tomSelectSettings() {
+    const settings = {
+      controlClass: "control",
+      dropdownClass: "dropdown",
+      dropdownContentClass: "dropdown-content",
+      optionClass: "option",
+      wrapperClass: "wrapper",
+      allowEmptyOption: true,
+      maxOptions: null,
+      refreshThrottle: 0,
+      itemLabelField: "itemLabel",
+      plugins: {
+        no_active_items: true,
+        remove_button: {
+          append: this.multiple,
+          className: "remove-button"
+        },
+        patch_scroll: true,
+        stash_on_search: true,
+      },
+      render: {
+        no_results: function() {
+          const message = this.input.getAttribute("data-no-results-message");
+          return `<div class='no-results'>${message}</div>`;
+        },
+        item: function(data, escape) {
+          const itemLabel = data[this.settings.itemLabelField] || data[this.settings.labelField];
+          return `<div>${escape(itemLabel)}</div>`;
+        }
+      },
+    };
+
+    if (this.getAttribute("data-src")) {
+      settings.valueField = this.getAttribute("data-option-value-field") || "id";
+      settings.labelField = this.getAttribute("data-option-label-field") || "name";
+
+      settings.plugins.remote_with_pagination = {
+        src: this.getAttribute("data-src"),
+        preload: this.getAttribute("data-no-preload") !== "true",
+        jsonPath: this.getAttribute("data-json-path"),
+        queryParam: this.getAttribute("data-query-param"),
+        loadingMessage: this.getAttribute("data-loading-message"),
+        loadingMoreMessage: this.getAttribute("data-loading-more-message"),
+      };
+    }
+
+    return settings;
+  }
+}
+
+customElements.define("solidus-select", SolidusSelect, { extends: "select" });

data/app/javascript/vendor/custom_elements.js

@@ -0,0 +1,3 @@
+/*! (c) Andrea Giammarchi @webreflection ISC */
+!function(){"use strict";var e=function(e,t){var n=function(e){for(var t=0,n=e.length;t<n;t++)r(e[t])},r=function(e){var t=e.target,n=e.attributeName,r=e.oldValue;t.attributeChangedCallback(n,r,t.getAttribute(n))};return function(o,a){var l=o.constructor.observedAttributes;return l&&e(a).then((function(){new t(n).observe(o,{attributes:!0,attributeOldValue:!0,attributeFilter:l});for(var e=0,a=l.length;e<a;e++)o.hasAttribute(l[e])&&r({target:o,attributeName:l[e],oldValue:null})})),o}};function t(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function n(e,n){var r="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!r){if(Array.isArray(e)||(r=function(e,n){if(e){if("string"==typeof e)return t(e,n);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?t(e,n):void 0}}(e))||n&&e&&"number"==typeof e.length){r&&(e=r);var o=0,a=function(){};return{s:a,n:function(){return o>=e.length?{done:!0}:{done:!1,value:e[o++]}},e:function(e){throw e},f:a}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var l,i=!0,c=!1;return{s:function(){r=r.call(e)},n:function(){var e=r.next();return i=e.done,e},e:function(e){c=!0,l=e},f:function(){try{i||null==r.return||r.return()}finally{if(c)throw l}}}}
+/*! (c) Andrea Giammarchi - ISC */var r=!0,o=!1,a="querySelectorAll",l="querySelectorAll",i=self,c=i.document,u=i.Element,s=i.MutationObserver,f=i.Set,d=i.WeakMap,h=function(e){return l in e},v=[].filter,p=function(e){var t=new d,i=function(n,r){var o;if(r)for(var a,l=function(e){return e.matches||e.webkitMatchesSelector||e.msMatchesSelector}(n),i=0,c=y.length;i<c;i++)l.call(n,a=y[i])&&(t.has(n)||t.set(n,new f),(o=t.get(n)).has(a)||(o.add(a),e.handle(n,r,a)));else t.has(n)&&(o=t.get(n),t.delete(n),o.forEach((function(t){e.handle(n,r,t)})))},p=function(e){for(var t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],n=0,r=e.length;n<r;n++)i(e[n],t)},y=e.query,g=e.root||c,m=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:document,l=arguments.length>2&&void 0!==arguments[2]?arguments[2]:MutationObserver,i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:["*"],c=function t(o,l,i,c,u,s){var f,d=n(o);try{for(d.s();!(f=d.n()).done;){var h=f.value;(s||a in h)&&(u?i.has(h)||(i.add(h),c.delete(h),e(h,u)):c.has(h)||(c.add(h),i.delete(h),e(h,u)),s||t(h[a](l),l,i,c,u,r))}}catch(e){d.e(e)}finally{d.f()}},u=new l((function(e){if(i.length){var t,a=i.join(","),l=new Set,u=new Set,s=n(e);try{for(s.s();!(t=s.n()).done;){var f=t.value,d=f.addedNodes,h=f.removedNodes;c(h,a,l,u,o,o),c(d,a,l,u,r,o)}}catch(e){s.e(e)}finally{s.f()}}})),s=u.observe;return(u.observe=function(e){return s.call(u,e,{subtree:r,childList:r})})(t),u}(i,g,s,y),w=u.prototype.attachShadow;return w&&(u.prototype.attachShadow=function(e){var t=w.call(this,e);return m.observe(t),t}),y.length&&p(g[l](y)),{drop:function(e){for(var n=0,r=e.length;n<r;n++)t.delete(e[n])},flush:function(){for(var e=m.takeRecords(),t=0,n=e.length;t<n;t++)p(v.call(e[t].removedNodes,h),!1),p(v.call(e[t].addedNodes,h),!0)},observer:m,parse:p}},y=self,g=y.document,m=y.Map,w=y.MutationObserver,b=y.Object,E=y.Set,S=y.WeakMap,A=y.Element,M=y.HTMLElement,O=y.Node,N=y.Error,C=y.TypeError,T=y.Reflect,q=b.defineProperty,D=b.keys,I=b.getOwnPropertyNames,P=b.setPrototypeOf,k=!self.customElements,L=function(e){for(var t=D(e),n=[],r=new E,o=t.length,a=0;a<o;a++){n[a]=e[t[a]];try{delete e[t[a]]}catch(e){r.add(a)}}return function(){for(var a=0;a<o;a++)r.has(a)||(e[t[a]]=n[a])}};if(k){var x=function(){var e=this.constructor;if(!$.has(e))throw new C("Illegal constructor");var t=$.get(e);if(W)return F(W,t);var n=H.call(g,t);return F(P(n,e.prototype),t)},H=g.createElement,$=new m,_=new m,j=new m,R=new m,V=[],U=p({query:V,handle:function(e,t,n){var r=j.get(n);if(t&&!r.isPrototypeOf(e)){var o=L(e);W=P(e,r);try{new r.constructor}finally{W=null,o()}}var a="".concat(t?"":"dis","connectedCallback");a in r&&e[a]()}}).parse,W=null,B=function(e){if(!_.has(e)){var t,n=new Promise((function(e){t=e}));_.set(e,{$:n,_:t})}return _.get(e).$},F=e(B,w);self.customElements={define:function(e,t){if(R.has(e))throw new N('the name "'.concat(e,'" has already been used with this registry'));$.set(t,e),j.set(e,t.prototype),R.set(e,t),V.push(e),B(e).then((function(){U(g.querySelectorAll(e))})),_.get(e)._(t)},get:function(e){return R.get(e)},whenDefined:B},q(x.prototype=M.prototype,"constructor",{value:x}),self.HTMLElement=x,g.createElement=function(e,t){var n=t&&t.is,r=n?R.get(n):R.get(e);return r?new r:H.call(g,e)},"isConnected"in O.prototype||q(O.prototype,"isConnected",{configurable:!0,get:function(){return!(this.ownerDocument.compareDocumentPosition(this)&this.DOCUMENT_POSITION_DISCONNECTED)}})}else if(k=!self.customElements.get("extends-br"))try{var z=function e(){return self.Reflect.construct(HTMLBRElement,[],e)};z.prototype=HTMLLIElement.prototype;var G="extends-br";self.customElements.define("extends-br",z,{extends:"br"}),k=g.createElement("br",{is:G}).outerHTML.indexOf(G)<0;var J=self.customElements,K=J.get,Q=J.whenDefined;self.customElements.whenDefined=function(e){var t=this;return Q.call(this,e).then((function(n){return n||K.call(t,e)}))}}catch(e){}if(k){var X=function(e){var t=ae.get(e);ve(t.querySelectorAll(this),e.isConnected)},Y=self.customElements,Z=g.createElement,ee=Y.define,te=Y.get,ne=Y.upgrade,re=T||{construct:function(e){return e.call(this)}},oe=re.construct,ae=new S,le=new E,ie=new m,ce=new m,ue=new m,se=new m,fe=[],de=[],he=function(e){return se.get(e)||te.call(Y,e)},ve=p({query:de,handle:function(e,t,n){var r=ue.get(n);if(t&&!r.isPrototypeOf(e)){var o=L(e);we=P(e,r);try{new r.constructor}finally{we=null,o()}}var a="".concat(t?"":"dis","connectedCallback");a in r&&e[a]()}}).parse,pe=p({query:fe,handle:function(e,t){ae.has(e)&&(t?le.add(e):le.delete(e),de.length&&X.call(de,e))}}).parse,ye=A.prototype.attachShadow;ye&&(A.prototype.attachShadow=function(e){var t=ye.call(this,e);return ae.set(this,t),t});var ge=function(e){if(!ce.has(e)){var t,n=new Promise((function(e){t=e}));ce.set(e,{$:n,_:t})}return ce.get(e).$},me=e(ge,w),we=null;I(self).filter((function(e){return/^HTML.*Element$/.test(e)})).forEach((function(e){var t=self[e];function n(){var e=this.constructor;if(!ie.has(e))throw new C("Illegal constructor");var n=ie.get(e),r=n.is,o=n.tag;if(r){if(we)return me(we,r);var a=Z.call(g,o);return a.setAttribute("is",r),me(P(a,e.prototype),r)}return oe.call(this,t,[],e)}q(n.prototype=t.prototype,"constructor",{value:n}),q(self,e,{value:n})})),g.createElement=function(e,t){var n=t&&t.is;if(n){var r=se.get(n);if(r&&ie.get(r).tag===e)return new r}var o=Z.call(g,e);return n&&o.setAttribute("is",n),o},Y.get=he,Y.whenDefined=ge,Y.upgrade=function(e){var t=e.getAttribute("is");if(t){var n=se.get(t);if(n)return void me(P(e,n.prototype),t)}ne.call(Y,e)},Y.define=function(e,t,n){if(he(e))throw new N("'".concat(e,"' has already been defined as a custom element"));var r,o=n&&n.extends;ie.set(t,o?{is:e,tag:o}:{is:"",tag:e}),o?(r="".concat(o,'[is="').concat(e,'"]'),ue.set(r,t.prototype),se.set(e,t),de.push(r)):(ee.apply(Y,arguments),fe.push(r=e)),ge(e).then((function(){o?(ve(g.querySelectorAll(r)),le.forEach(X,[r])):pe(g.querySelectorAll(r))})),ce.get(e)._(t)}}}();

data/app/lib/solidus_admin/form_builder.rb

@@ -0,0 +1,58 @@
+# frozen_string_literal: true
+
+class SolidusAdmin::FormBuilder < ActionView::Helpers::FormBuilder
+  include SolidusAdmin::ComponentsHelper
+
+  delegate :render, to: :@template
+
+  def text_field(method, **options)
+    render component("ui/forms/field").text_field(self, method, **options)
+  end
+
+  def text_area(method, **options)
+    render component("ui/forms/field").text_area(self, method, **options)
+  end
+
+  def select(method, choices, **options)
+    render component("ui/forms/field").select(self, method, choices, **options)
+  end
+
+  def checkbox(method, label: nil, checked: nil, hint: nil, **options)
+    label = @object.class.human_attribute_name(method) if label.nil?
+    label_options = options.delete(:label_options) || {}
+    checked = @object.public_send(method) if checked.nil?
+    hint_options = options.delete(:hint_options) || {}
+
+    component_instance = component("ui/forms/checkbox").new(object_name: @object_name, checked:, method:, **options)
+    render component_instance do |checkbox|
+      checkbox.with_label(text: label, **label_options)
+      checkbox.with_hint(text: hint, **hint_options) if hint
+    end
+  end
+
+  def checkbox_row(method, options:, row_title:, **attrs)
+    render component("ui/checkbox_row").new(form: self, method:, options:, row_title:, **attrs)
+  end
+
+  def input(method, **options)
+    name = "#{@object_name}[#{method}]"
+    value = @object.public_send(method) if options[:value].nil?
+    render component("ui/forms/input").new(name:, value:, **options)
+  end
+
+  def hidden_field(method, **options)
+    input(method, type: :hidden, autocomplete: "off", **options)
+  end
+
+  def switch_field(method, label: nil, include_hidden: true, **options)
+    label = @object.class.human_attribute_name(method) if label.nil?
+    name = "#{@object_name}[#{method}]"
+    error = @object.errors[method]
+    checked = @object.public_send(method)
+    render component("ui/forms/switch_field").new(label:, name:, error:, checked:, include_hidden:, **options)
+  end
+
+  def submit(**options)
+    render component("ui/button").submit(resource: @object, form: id, **options)
+  end
+end

data/app/views/layouts/solidus_admin/application.html.erb

@@ -13,11 +13,11 @@
 
     <%= stylesheet_link_tag SolidusAdmin::Config.theme_path(session[:admin_light_theme]), media: '(prefers-color-scheme: light)', "data-turbo-track": "reload" %>
     <%= stylesheet_link_tag SolidusAdmin::Config.theme_path(session[:admin_dark_theme]), media: '(prefers-color-scheme: dark)', "data-turbo-track": "reload" %>
-    <%= javascript_importmap_tags "solidus_admin/application", shim: false, importmap: SolidusAdmin.importmap %>
-    <meta name="turbo-refresh-scroll", content="preserve">
+    <%= javascript_importmap_tags "solidus_admin/application", importmap: SolidusAdmin.importmap %>
+    <meta name="turbo-refresh-scroll" content="preserve">
   </head>
 
-  <body class="bg-gray-15 font-sans">
+  <body class="bg-gray-15 font-sans text-sm">
     <%= render component("layout/skip_link").new(href: "#main") %>
     <div class="flex gap-0">
       <div class="min-w-[240px] border-r border-r-gray-100 relative">
@@ -31,10 +31,8 @@
       </main>
     </div>
 
-    <div class="fixed inset-x-0 bottom-3 flex items-center justify-center flex-col gap-3 pointer-events-none" role="alert">
-      <% flash.each do |key, message| %>
-        <%= render component("ui/toast").new(text: message, scheme: key.to_sym == :error ? :error : :default) %>
-      <% end %>
-    </div>
+    <%= render component("layout/flashes/alerts").new(alerts:) %>
+    <%= render component("layout/flashes/toasts").new(toasts:) %>
+    <%= render component("layout/confirm").new %>
   </body>
 </html>

data/app/views/layouts/solidus_admin/preview.html.erb

@@ -3,7 +3,7 @@
   <head>
     <%= stylesheet_link_tag SolidusAdmin::Config.theme_path(session[:admin_light_theme]), media: '(prefers-color-scheme: light)', "data-turbo-track": "reload" %>
     <%= stylesheet_link_tag SolidusAdmin::Config.theme_path(session[:admin_dark_theme]), media: '(prefers-color-scheme: dark)', "data-turbo-track": "reload" %>
-    <%= javascript_importmap_tags "solidus_admin/application", shim: false, importmap: SolidusAdmin.importmap %>
+    <%= javascript_importmap_tags "solidus_admin/application", importmap: SolidusAdmin.importmap %>
   </head>
   <body class="p-3">
     <%= yield %>

data/app/views/solidus_admin/option_values/create.turbo_stream.erb

@@ -0,0 +1,3 @@
+<%= turbo_stream.update("option_values_table", component("option_values/table").new(@option_type)) %>
+<%= turbo_stream.update(resource_form_frame, nil) %>
+<%= turbo_stream.replace("flash_toasts", component("layout/flashes").new) %>

data/app/views/solidus_admin/option_values/destroy.turbo_stream.erb

@@ -0,0 +1,3 @@
+<%= turbo_stream.update("option_values_table", component("option_values/table").new(@option_type)) %>
+<%= turbo_stream.update(resource_form_frame, nil) %>
+<%= turbo_stream.replace("flash_toasts", component("layout/flashes").new) %>

data/app/views/solidus_admin/option_values/update.turbo_stream.erb

@@ -0,0 +1,3 @@
+<%= turbo_stream.update("option_values_table", component("option_values/table").new(@option_value.option_type)) %>
+<%= turbo_stream.update(resource_form_frame, nil) %>
+<%= turbo_stream.replace("flash_toasts", component("layout/flashes").new) %>

data/config/importmap.rb

@@ -10,6 +10,15 @@ pin "sortablejs", to: "https://cdn.jsdelivr.net/npm/sortablejs@1.15.0/+esm"
 pin "@rails/request.js", to: "https://cdn.jsdelivr.net/npm/@rails/request.js@0.0.9/+esm"
 
 pin "solidus_admin/application", preload: true
+pin "solidus_admin/confirm_modal"
 pin "solidus_admin/utils"
+pin "solidus_admin/tom-select", to: "solidus_admin/tom-select/tom-select.js"
+pin "vendor/custom_elements", preload: true
+
 pin_all_from SolidusAdmin::Engine.root.join("app/javascript/solidus_admin/controllers"), under: "solidus_admin/controllers"
 pin_all_from SolidusAdmin::Engine.root.join("app/components")
+pin_all_from SolidusAdmin::Engine.root.join("app/javascript/solidus_admin/web_components"), under: "solidus_admin/web_components"
+
+pin "tom-select", to: "https://ga.jspm.io/npm:tom-select@2.4.3/dist/esm/tom-select.complete.js"
+pin "@orchidjs/sifter", to: "https://ga.jspm.io/npm:@orchidjs/sifter@1.1.0/dist/esm/sifter.js"
+pin "@orchidjs/unicode-variants", to: "https://ga.jspm.io/npm:@orchidjs/unicode-variants@1.1.2/dist/esm/index.js"

data/config/initializers/view_component.rb

@@ -6,7 +6,7 @@ if Rails.env.development? || Rails.env.test?
   Rails.application.config.view_component.instrumentation_enabled = true
   Rails.application.config.view_component.use_deprecated_instrumentation_name = false
 
-  bold  = "\e[1m"
+  bold = "\e[1m"
   clear = "\e[0m"
 
   ActiveSupport::Notifications.subscribe("render.view_component") do |*args|

data/config/locales/option_types.en.yml

@@ -2,5 +2,9 @@ en:
   solidus_admin:
     option_types:
       title: "Option Types"
+      create:
+        success: "Option type was successfully created."
       destroy:
-        success: "Option Types were successfully removed."
+        success: "Option types were successfully removed."
+      update:
+        success: "Option type was successfully updated."

data/config/locales/option_values.en.yml

@@ -0,0 +1,9 @@
+en:
+  solidus_admin:
+    option_values:
+      create:
+        success: "Option value was successfully created."
+      destroy:
+        success: "Option values were successfully removed."
+      update:
+        success: "Option value was successfully updated."

data/config/locales/payment_methods.en.yml

@@ -2,5 +2,9 @@ en:
   solidus_admin:
     payment_methods:
       title: "Payment Methods"
+      create:
+        success: "Payment method was successfully created."
       destroy:
-        success: "Payment Methods were successfully removed."
+        success: "Payment methods were successfully removed."
+      update:
+        success: "Payment method was successfully updated."

data/config/locales/product_taxons.en.yml

@@ -0,0 +1,6 @@
+en:
+  solidus_admin:
+    product_taxons:
+      title: "Categories"
+      create:
+        success: "Product category was successfully added."

data/config/locales/products.en.yml

@@ -8,3 +8,5 @@ en:
         success: "Products were successfully discontinued."
       activate:
         success: "Products were successfully activated."
+      update:
+        success: "Product was successfully updated."

data/config/locales/solidus_select.yml

@@ -0,0 +1,6 @@
+en:
+  solidus_admin:
+    solidus_select:
+      loading: Loading
+      loading_more: Loading more results
+      no_results: No results found

data/config/locales/stock_locations.en.yml

@@ -2,5 +2,9 @@ en:
   solidus_admin:
     stock_locations:
       title: "Stock Locations"
+      create:
+        success: "Stock location was successfully created."
       destroy:
         success: "Stock locations were successfully removed."
+      update:
+        success: "Stock location was successfully updated."

data/config/locales/stores.en.yml

@@ -1,6 +1,28 @@
 en:
+  activerecord:
+    attributes:
+      spree/store:
+        available_locales: Storefront Languages
+        bcc_email: BCC Email
+        cart_tax_country_iso: Tax Country
+        code: Slug
+        default: Default
+        default_currency: Default Currency
+        mail_from_address: Store Email
+        meta_description: Meta Description
+        meta_keywords: Meta Keywords
+        name: Store Name
+        seo_title: Page Title
+        url: URL
   solidus_admin:
     stores:
       title: "Stores"
+      create:
+        success: "Store was successfully created."
       destroy:
+        error:
+          title: "Some Stores could not be removed"
+          description: "%{name}: %{reason}"
         success: "Stores were successfully removed."
+      update:
+        success: "Store was successfully updated."

data/config/locales/tax_rates.en.yml

@@ -2,5 +2,9 @@ en:
   solidus_admin:
     tax_rates:
       title: "Tax Rates"
+      create:
+        success: "Tax rate was successfully created."
       destroy:
         success: "Tax rates were successfully removed."
+      update:
+        success: "Tax rate was successfully updated."

data/config/locales/zones.en.yml

@@ -2,5 +2,9 @@ en:
   solidus_admin:
     zones:
       title: "Zones"
+      create:
+        success: "Zone was successfully created."
       destroy:
         success: "Zones were successfully removed."
+      update:
+        success: "Zone was successfully updated."

data/config/routes.rb

@@ -6,26 +6,30 @@ SolidusAdmin::Engine.routes.draw do
 
   resource :account, only: :show
   resources :countries, only: [] do
-    get 'states', to: 'countries#states'
+    get "states", to: "countries#states"
   end
 
+  resources :states, only: [:index], defaults: {format: :json}
+
   admin_resources :products, only: [:index, :update, :destroy] do
     collection do
       put :discontinue
       put :activate
     end
+
+    resources :taxons, only: [:new, :create], controller: :product_taxons
   end
 
   # Needs a constraint to avoid interpreting "new" as a product's slug
   admin_resources :products, only: [
     :show, :edit
-  ], constraints: ->{ SolidusAdmin::Config.enable_alpha_features? && _1.path != "/admin/products/new" }
+  ], constraints: -> { SolidusAdmin::Config.enable_alpha_features? && _1.path != "/admin/products/new" }
 
   admin_resources :orders, only: [:index]
 
   admin_resources :orders, except: [
     :destroy, :index
-  ], constraints: ->{ SolidusAdmin::Config.enable_alpha_features? } do
+  ], constraints: -> { SolidusAdmin::Config.enable_alpha_features? } do
     resources :adjustments, only: [:index] do
       collection do
         delete :destroy
@@ -45,6 +49,11 @@ SolidusAdmin::Engine.routes.draw do
     end
   end
 
+  admin_resources :payment_methods,
+    constraints: -> { SolidusAdmin::Config.enable_alpha_features? },
+    except: [:show],
+    sortable: true
+
   admin_resources :users, only: [:index, :edit, :destroy] do
     member do
       get :addresses
@@ -67,22 +76,25 @@ SolidusAdmin::Engine.routes.draw do
 
   admin_resources :promotions, only: [:index, :destroy]
   admin_resources :properties, except: [:show]
-  admin_resources :option_types, only: [:index, :destroy], sortable: true
+  admin_resources :option_types, except: [:show], sortable: true do
+    admin_resources :option_values, only: [:new, :create, :destroy], controller: "option_values", sortable: false
+  end
+  admin_resources :option_values, only: [:edit, :update], sortable: true
   admin_resources :taxonomies, only: [:index, :destroy], sortable: true
   admin_resources :promotion_categories, only: [:index, :destroy]
   admin_resources :tax_categories, except: [:show]
-  admin_resources :tax_rates, only: [:index, :destroy]
-  admin_resources :payment_methods, only: [:index, :destroy], sortable: true
+  admin_resources :tax_rates, except: [:show]
   admin_resources :stock_items, only: [:index, :edit, :update]
   admin_resources :shipping_methods, only: [:index, :destroy]
   admin_resources :shipping_categories, except: [:show]
-  admin_resources :stock_locations, only: [:index, :destroy]
-  admin_resources :stores, only: [:index, :destroy]
-  admin_resources :zones, only: [:index, :destroy]
+  admin_resources :stock_locations, except: [:show]
+  admin_resources :stores, except: [:show]
+  admin_resources :zones, except: [:show]
   admin_resources :refund_reasons, except: [:show]
   admin_resources :reimbursement_types, only: [:index]
   admin_resources :return_reasons, except: [:show]
   admin_resources :roles, except: [:show]
   admin_resources :adjustment_reasons, except: [:show]
   admin_resources :store_credit_reasons, except: [:show]
+  admin_resources :product_option_types, only: [], sortable: true
 end

data/config/tailwind.config.js

@@ -29,7 +29,7 @@ module.exports = {
         // Secondary palette
         yellow: "#fdc071",
         orange: "#f68050",
-        blue: "#2554b1",
+        "solidus-blue": "#2554b1",
         moss: "#2d3925",
         forest: "#096756",
         midnight: "#163449",
@@ -42,6 +42,7 @@ module.exports = {
 
         // Extra colors (not part of the original palette)
         "papaya-whip": "#f9e3d9",
+        sazerac: "#fcf0dd",
 
         // UI Red
         red: {
@@ -83,6 +84,9 @@ module.exports = {
         sm: "0px 1px 2px 0px rgba(0, 0, 0, 0.04)",
         base: "0px 4px 8px 0px rgba(0, 0, 0, 0.08), 0px 2px 4px -1px rgba(0, 0, 0, 0.04)",
       },
+      height: {
+        "5.5": "1.375rem",
+      }
     },
   },
   plugins: [
@@ -108,7 +112,7 @@ module.exports = {
       // Add a text style for links
       addComponents({
         ".body-link": {
-          color: theme("colors.blue"),
+          color: theme("colors.solidus-blue"),
           "&:hover": {
             textDecoration: "underline",
           },

data/docs/components.md

@@ -2,11 +2,11 @@
 
 Components are the main building blocks of the admin interface. They are implemented as ViewComponents and are rendered directly by controllers.
 
-The following documentation assumes familiariry with ViewComponents. If you are not please refer to the [ViewComponent documentation](https://viewcomponent.org/guide/).
+The following documentation assumes familiarity with ViewComponents. If you are not please refer to the [ViewComponent documentation](https://viewcomponent.org/guide/).
 
 There are two types of components:
 
-- **UI components** are the building blocks of the interface. Tipically, they are small components that are used to build more complex components and are generic enough to be reused in various contexts. UI components are located under the `app/components/solidus_admin/ui` folder.
+- **UI components** are the building blocks of the interface. Typically, they are small components that are used to build more complex components and are generic enough to be reused in various contexts. UI components are located under the `app/components/solidus_admin/ui` folder.
 - **Page components** are the primary components rendered by the controllers. Generally, they are full-page components rendered directly by the controllers. They are located under the `app/components/solidus_admin` directory following the naming convention of the controller and action names they are used in. For example `app/components/solidus_admin/orders/index/component.rb` is the component that is rendered by the `SolidusAdmin::OrdersController#index` action.
 
 ## Generating components

data/docs/index_pages.md

@@ -20,21 +20,27 @@ class SolidusAdmin::UsersController < SolidusAdmin::BaseController
     # ...
 ```
 
-For pagination support, the index action should also call the `set_page_and_extract_portion_from` method provided by the `geared_pagination` gem. This method sets the `@page` instance variable to the paginated collection and returns the portion of the collection to be displayed on the current page.
+For pagination support, the index action should also call the `paginate` method provided by `SolidusAdmin::ControllerHelpers::Pagination` (included in `SolidusAdmin::BaseController`). It paginates the collection with Kaminari, 20 records per page by default (pass `per_page:` to change it), and returns the page to be displayed. Assign it to `@page`.
 
 ```ruby
 def index
   users = apply_search_to(Spree.user_class.order(id: :desc), param: :q)
-  set_page_and_extract_portion_from(users)
+  @page = paginate(users)
   # ...
 ```
 
-Finally, the index action should render the `index` component passing the `@page` instance variable as the `collection` prop.
+To sort the records, pass `ordered_by:` with the columns and directions to sort by. The primary key is added as a final sort column when it isn't already included, so records with equal values don't repeat or go missing between pages.
+
+```ruby
+@page = paginate(products, ordered_by: {name: :asc}) # ORDER BY name ASC, id ASC
+```
+
+Finally, the index action should render the `index` component passing the `@page` instance variable as the `page` prop.
 
 ```ruby
 def index
   users = apply_search_to(Spree.user_class.order(id: :desc), param: :q)
-  set_page_and_extract_portion_from(users)
+  @page = paginate(users)
   render component('users/index').new(page: @page)
 end
 ```
@@ -94,7 +100,7 @@ end
 def delete
   @users = Spree.user_class.where(id: params[:id])
   @users.destroy_all
-  flash[:success] = "Admin users deleted"
+  flash[:notice] = "Admin users deleted"
   redirect_to solidus_admin.users_path, status: :see_other
 end
 ```

data/docs/stimulusjs.md

@@ -2,7 +2,7 @@
 
 This project uses [StimulusJS](https://stimulusjs.org) to add interactivity to the admin interface.
 
-## Using ther `stimulus_id` helper
+## Using the `stimulus_id` helper
 
 All JavaScript files are imported using `import-maps`, eliminating the need for compilation.
 

data/eslint.config.mjs

@@ -0,0 +1,25 @@
+import { defineConfig } from "eslint/config";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+import js from "@eslint/js";
+import { FlatCompat } from "@eslint/eslintrc";
+import rootConfig from "../eslint.config.mjs";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const compat = new FlatCompat({
+    baseDirectory: __dirname,
+    recommendedConfig: js.configs.recommended,
+    allConfig: js.configs.all
+});
+
+export default defineConfig([
+  {
+    extends: [compat.extends("eslint:recommended"), rootConfig],
+
+    languageOptions: {
+        ecmaVersion: 2023,
+        sourceType: "module",
+    },
+  }
+]);