spree_admin 5.0.0.rc1

data/app/views/spree/admin/taxons/_form.html.erb

@@ -0,0 +1,148 @@
+<div class="row" data-controller="slug-form seo-form">
+  <div class="col-lg-8">
+    <div class="card mb-4">
+      <div class="card-body pb-0 pt-3">
+        <div class="form-group">
+          <%= f.label :name, raw(Spree.t(:name) + required_span_tag) %>
+          <%= f.text_field :name,
+                class: 'form-control',
+                required: true,
+                autofocus: @taxon.new_record?,
+                data: {
+                  seo_form_target: 'sourceTitleInput',
+                  slug_form_target: 'name',
+                  action: 'slug-form#updateUrlFromName'
+                } %>
+          <%= f.error_message_on :name %>
+        </div>
+        <div class="form-group">
+          <%= f.label :description, Spree.t(:description) %>
+          <div class="trix-container">
+            <%= f.rich_text_area :description, data: { seo_form_target: 'sourceDescriptionInput' } %>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <% if @taxon.new_record? %>
+      <div class="card mb-4" data-controller="reveal" data-reveal-hidden-class="d-none">
+        <div class="card-header">
+          <h5 class="card-title"><%= Spree.t('admin.taxon_type') %></h5>
+        </div>
+        <div class="card-body">
+          <div class="custom-control custom-radio mb-2">
+            <%= f.radio_button :automatic, false, id: 'customRadio1', class: 'custom-control-input', checked: true, data: { action: 'reveal#hide' } %>
+            <label class="custom-control-label" for="customRadio1"><%= Spree.t('admin.taxon_types.manual') %></label>
+            <br />
+            <span class="text-muted"><%= Spree.t('admin.taxon_types.manual_info') %></span>
+          </div>
+          <div class="custom-control custom-radio">
+            <%= f.radio_button :automatic, true, id: 'customRadio2', class: 'custom-control-input', data: { action: 'reveal#show' } %>
+            <label class="custom-control-label" for="customRadio2"><%= Spree.t('admin.taxon_types.automatic') %></label>
+            <br />
+            <span class="text-muted"><%= Spree.t('admin.taxon_types.automatic_info') %></span>
+          </div>
+        </div>
+        <div class="card-body border-top pt-4 d-none" data-reveal-target="item">
+          <h6><%= Spree.t(:conditions) %></h6>
+          <%= render 'spree/admin/taxons/rules_form', f: f %>
+        </div>
+      </div>
+    <% else %>
+      <% if @taxon.automatic? %>
+        <div class="card mb-4">
+          <div class="card-header">
+            <h5 class="card-title"><%= Spree.t(:conditions) %></h5>
+          </div>
+          <div class="card-body">
+            <div class="alert alert-info mb-3"><%= Spree.t('admin.taxon_types.automatic_info') %></div>
+            <%= render 'spree/admin/taxons/rules_form', f: f %>
+          </div>
+        </div>
+      <% end %>
+
+      <div class="card mb-4">
+        <div class="card-header d-flex align-items-center justify-content-between">
+          <h5 class="card-title">
+            <%= Spree.t(:products) %>
+            <span class="badge badge-info ml-2" id="product_count">
+              <%= @taxon.products.not_archived.count %>
+            </span>
+          </h5>
+
+          <% if @taxon.manual? && can?(:create, Spree::Classification) %>
+            <span data-toggle="modal" data-target="#modal">
+              <%= link_to_with_icon 'plus', Spree.t(:add_products), spree.new_admin_taxon_classification_path(@taxon.id), class: 'btn btn-light btn-sm', data: { turbo_frame: 'dialog_modal' } %>
+            </span>
+          <% end %>
+        </div>
+
+        <div class="card-body border-bottom">
+          <div class="d-flex align-items-center">
+            <%= f.label :sort_order, class: 'text-nowrap mr-2 mb-0' %>
+            <%= f.select :sort_order, taxon_sort_options_for_select, {}, { class: 'custom-select custom-select-sm w-auto',  data: { action: 'change->auto-submit#submit' } } %>
+          </div>
+        </div>
+
+        <div class="card-body p-2" style="min-height: 300px">
+          <div class="d-block overflow-y-auto overflow-x-hidden" style="max-height: 300px">
+            <%= turbo_frame_tag :classifications, src: spree.admin_taxon_classifications_path(@taxon.id), loading: :lazy do %>
+              <%= render 'spree/admin/shared/spinner' %>
+            <% end %>
+          </div>
+        </div>
+      </div>
+    <% end %>
+  </div>
+
+  <div class="col-lg-4">
+    <div class="card mb-4">
+      <div class="card-header">
+        <h5 class="card-title"><%= Spree.t(:images) %></h5>
+      </div>
+      <div class="card-body">
+        <%= f.label :image, Spree.t(:image) %>
+        <%= render 'active_storage/upload_form', form: f, field_name: :image, width: 1920, height: 1080 %>
+        <%= f.error_message_on :image %>
+      </div>
+      <div class="card-body">
+        <%= f.label :square_image, Spree.t(:square_image) %>
+        <p class="text-muted form-text">
+          Used for the featured image on the homepage.
+        </p>
+        <%= render 'active_storage/upload_form', form: f, field_name: :square_image, width: 400, height: 400, crop: true %>
+        <%= f.error_message_on :square_image %>
+      </div>
+    </div>
+
+    <div class="card mb-4">
+      <div class="card-header">
+        <h5 class="card-title">
+          <%= Spree.t(:navigation) %>
+        </h5>
+      </div>
+      <div class="card-body">
+        <% if @taxon.new_record? %>
+          <% disabled = false %>
+        <% else %>
+          <% disabled = @taxon.root? %>
+        <% end %>
+        <div class="form-group">
+          <%= f.label :parent_id, Spree.t('admin.navigation.nested_under') %>
+          <%= f.select :parent_id, nested_set_options(@taxonomy.taxons.includes(:parent), @taxon) {|i| i.pretty_name }, { include_blank: false }, { data: { controller: 'autocomplete-select' }, disabled: disabled  } %>
+          <%= f.error_message_on :parent_id %>
+        </div>
+      </div>
+    </div>
+
+    <%= render 'spree/admin/shared/seo',
+          f: f,
+          title: @taxon.name,
+          meta_title: @taxon.meta_title,
+          description: @taxon.description,
+          slug_attribute_name: :permalink_part,
+          slug: @permalink_part,
+          slug_path: ['t', @parent_permalink.presence].compact.join('/'),
+          placeholder: 'Add a title and description to see how this taxon might appear in a search engine listing' %>
+  </div>
+</div>

data/app/views/spree/admin/taxons/_rule_form.html.erb

@@ -0,0 +1,24 @@
+<div class="row nested-form-wrapper border-bottom mb-3 pr-2" data-controller="rule-form" data-new-record="<%= rf.object.new_record? %>">
+  <% @taxon_rules.each do |taxon_rule| %>
+    <template id="rule-form-template-<%= taxon_rule.to_s.demodulize %>" data-rule-form-target="template">
+      <%= render "spree/admin/taxons/rule_forms/#{taxon_rule.to_s.demodulize.underscore}", rule_form: rf %>
+    </template>
+  <% end %>
+
+  <div class="col-lg-4 mb-3">
+    <%= rf.select :type, @rule_types, {}, { class: 'custom-select', data: { action: 'rule-form#replace' } } %>
+  </div>
+  <div class="col-lg-3 mb-3">
+    <%= rf.select :match_policy, @rule_match_policies, {}, { class: 'custom-select' } %>
+  </div>
+  <div class="col-lg-4 mb-3" data-rule-form-target="value">
+    <%= render "spree/admin/taxons/rule_forms/#{rf.object.type.demodulize.underscore}", rule_form: rf %>
+  </div>
+  <div class="col-lg-1 mb-3 d-flex align-items-center justify-content-center">
+    <button type="button" data-action="nested-form#remove" class="btn btn-sm btn-danger px-2 with-tip" title="Remove condition">
+      <%= icon('x', class: 'mr-0') %>
+      <span class="d-lg-none"><%= Spree.t(:remove_condition) %></span>
+    </button>
+    <%= rf.hidden_field :_destroy if rf.object.persisted? %>
+  </div>
+</div>

data/app/views/spree/admin/taxons/_rules_form.html.erb

@@ -0,0 +1,34 @@
+<div id="rules-form">
+  <div class="form-group mb-1">
+    <span class="d-block d-lg-inline mb-3"><%= Spree.t('admin.taxon_rules.products_must_match') %></span>
+
+    <div class="custom-control custom-radio custom-control-inline ml-lg-3 mb-3">
+      <%= f.radio_button :rules_match_policy, :all, class: 'custom-control-input' %>
+      <%= f.label :rules_match_policy, Spree.t('admin.taxon_rules.all_conditions'), class: 'custom-control-label', for: :taxon_rules_match_policy_all %>
+    </div>
+    <div class="custom-control custom-radio custom-control-inline mb-3">
+      <%= f.radio_button :rules_match_policy, :any, class: 'custom-control-input' %>
+      <%= f.label :rules_match_policy, Spree.t('admin.taxon_rules.any_condition'), class: 'custom-control-label', for: :taxon_rules_match_policy_any %>
+    </div>
+  </div>
+
+  <div data-controller="nested-form">
+    <template data-nested-form-target="template">
+      <%= f.fields_for :taxon_rules, @taxon.taxon_rules.new(type: @taxon_rules.first.to_s), child_index: 'NEW_RECORD' do |rf| %>
+        <%= render 'spree/admin/taxons/rule_form', rf: rf %>
+      <% end %>
+    </template>
+
+    <%= f.fields_for :taxon_rules, @taxon.taxon_rules do |rf| %>
+      <%= render 'spree/admin/taxons/rule_form', rf: rf %>
+    <% end %>
+
+    <!-- Inserted elements will be injected before that target. -->
+    <div data-nested-form-target="target" class="mb-2"></div>
+
+    <button type="button" class="btn btn-link w-100 py-3" data-action="nested-form#add">
+      <%= icon('plus', class: 'mr-2') %>
+      <%= Spree.t(:add_one)%>
+    </button>
+  </div>
+</div>

data/app/views/spree/admin/taxons/destroy.turbo_stream.erb

@@ -0,0 +1 @@
+<%= turbo_stream.remove spree_dom_id(@taxon) %>

data/app/views/spree/admin/taxons/edit.html.erb

@@ -0,0 +1,19 @@
+<% content_for :page_title do %>
+  <%= page_header_back_button spree.admin_taxonomy_path(@taxon.taxonomy) %>
+  <%= @taxon.name %>
+<% end %>
+
+<% content_for :page_actions_dropdown do %>
+  <%= link_to_edit_translations(@taxon) %>
+  <%= external_page_preview_link(@taxon, name: Spree.t(:taxonomy)) %>
+<% end %>
+
+<%# Because otherwise the form would attempt to use to_param of @taxon %>
+<% form_url = admin_taxonomy_taxon_path(@taxonomy.id, @taxon.id) %>
+
+<%= render partial: 'spree/admin/shared/error_messages', locals: { target: @taxon } %>
+
+<%= form_for [:admin, @taxon], method: :put, url: form_url, html: { multipart: true }, data: { controller: 'auto-submit' } do |f| %>
+  <%= render 'form', f: f %>
+  <%= render 'spree/admin/shared/edit_resource_links', f: f %>
+<% end %>

data/app/views/spree/admin/taxons/new.html.erb

@@ -0,0 +1,12 @@
+<% content_for :page_title do %>
+  <%= page_header_back_button spree.admin_taxonomy_path(@taxonomy) %>
+  <%= Spree.t(:new_taxon) %>
+<% end %>
+
+<%= render partial: 'spree/admin/shared/error_messages', locals: { target: @taxon } %>
+
+<%= form_for @taxon, as: :taxon, url: spree.admin_taxonomy_taxons_path do |f| %>
+  <%= render 'form', f: f %>
+
+  <%= render 'spree/admin/shared/new_resource_links' %>
+<% end %>

data/app/views/spree/admin/taxons/rule_forms/_available_on.html.erb

@@ -0,0 +1,4 @@
+<div class="d-flex align-items-center justify-content-center h-100">
+  <%= rule_form.number_field :value, min: 1, class: 'form-control mr-3' %>
+  <span class="form-text text-nowrap"><%= Spree.t(:days_ago) %></span>
+</div>

data/app/views/spree/admin/taxons/rule_forms/_sale.html.erb

@@ -0,0 +1,4 @@
+<div class="d-flex align-items-center justify-content-center h-100">
+  <span class="badge badge-success"><%= Spree.t(:true_label) %></span>
+  <%= rule_form.hidden_field :value, value: true %>
+</div>

data/app/views/spree/admin/taxons/rule_forms/_tag.html.erb

@@ -0,0 +1 @@
+<%= rule_form.select :value, tags_scope.distinct.pluck(:name, :name), { include_blank: true }, data: { controller: 'autocomplete-select' } %>

data/app/views/spree/admin/themes/_theme.html.erb

@@ -0,0 +1,53 @@
+<tr id="<%= spree_dom_id theme %>">
+  <td class="w-70 p-0">
+    <%= link_to theme.ready? ? spree.edit_admin_theme_path(theme) : '#', class: 'd-flex align-items-top p-3' do %>
+      <%= render 'spree/admin/themes/theme_preview_image', theme: theme %>
+
+      <div class="d-flex flex-column ml-3">
+        <strong><%= theme.name %></strong>
+        <p class="mb-0 mt-1">
+          <span class="text-muted">
+            <%= Spree.t(:updated) %>: 
+            <%= local_time_ago(theme.updated_at, class: 'with-tip') %>
+          </span>
+        </p>
+      </div>
+    <% end %>
+  </td>
+  <td class="w-10">
+    <% if theme.ready? %>
+      <% if theme.default? %>
+        <span class="badge  badge-success">
+          <%= icon('check') %>
+          <%= Spree.t(:live) %>
+        </span>
+      <% else %>
+        <span class="badge  badge-light">
+          <%= Spree.t(:draft) %>
+        </span>
+      <% end %>
+    <% else %>
+      <span class="badge  badge-light">
+        <%= Spree.t(:duplicating) %>
+      </span>
+    <% end %>
+  </td>
+  <td class="w-20">
+    <% if theme.ready? %>
+      <div class="d-flex justify-content-end w-100">
+        <%= link_to Spree.t('actions.publish'), publish_admin_theme_path(theme), class: 'btn btn-sm btn-light mr-2', data: { turbo_method: :put } unless theme.default? %>
+        <div class="dropdown">
+          <button class="btn btn-sm btn-light h-100" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+            <%= icon('dots', class: 'mr-0') %>
+          </button>
+          <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
+            <%= link_to_edit theme, class: 'dropdown-item' %>
+            <%= link_to_with_icon 'copy', Spree.t(:clone), spree.clone_admin_theme_path(theme), class: 'dropdown-item', data: { turbo_method: :post } %>
+            <% unless theme.default? %>
+            <%= link_to_delete(theme, icon: 'trash', class: 'dropdown-item btn-danger shadow-none') if can?(:delete, theme) %>
+          <% end %>
+        </div>
+      </div>
+    <% end %>
+  </td>
+</tr>

data/app/views/spree/admin/themes/_theme_preview_image.html.erb

@@ -0,0 +1,24 @@
+<% width ||= 120 %>
+<% height ||= 72 %>
+
+<% if theme.screenshot.attached? && theme.screenshot.variable? %>
+  <%= image_tag(
+        main_app.cdn_image_url(
+          theme.screenshot.variant(
+            spree_image_variant_options(resize_to_fill: [width * 2, height * 2])
+          )
+        ),
+        class: 'img-thumbnail',
+        style: "width: #{width}px; height: #{height}px",
+        loading: :lazy
+  ) %>
+<% elsif theme.class.preview_image_url.present? %>
+  <%= image_tag(
+  theme.class.preview_image_url,
+  class: 'img-thumbnail',
+  style: "width: #{width}px; height: #{height}px",
+  loading: :lazy
+) %>
+<% else %>
+  <%= render 'spree/admin/shared/no_image', width: width, height: height %>
+<% end %>

data/app/views/spree/admin/themes/edit.html.erb

@@ -0,0 +1,14 @@
+<div class="d-none d-md-block">
+  <div class="desktopLiveView" data-page-builder-target="previewContainer">
+    <div class="embed-responsive embed-responsive-4by3 bg-transparent">
+      <iframe class="embed-responsive-item border border-gray bg-transparent rounded"
+              data-page-builder-target="iframe"
+              data-action="load->page-builder#initializeVisualEditor"
+              id="page-builder-preview"
+              sandbox="allow-same-origin allow-forms allow-popups allow-scripts allow-modals">
+      </iframe>
+    </div>
+  </div>
+</div>
+
+<%= turbo_frame_tag :iframe_preview_scripts %>

data/app/views/spree/admin/themes/index.html.erb

@@ -0,0 +1,79 @@
+<%= content_for :page_title do %>
+  <%= Spree.t(:themes) %>
+<% end %>
+
+<%= content_for :page_actions do %>
+  <%= link_to_with_icon 'eye', Spree.t(:view_your_store), current_store.formatted_url_or_custom_domain, class: 'btn btn-light bg-transparent', target: '_blank' %>
+<% end %>
+
+<%= content_for :page_alerts do %>
+  <div class="alert alert-info">
+    If you wan't to make changes to theme but don't want to go live with them,
+    you can make a copy of the theme and make changes to the copy. And later promote that copy
+    to the live theme.
+  </div>
+  <br />
+
+  <% unless current_store.default_custom_domain&.active? %>
+    <div class="alert alert-info d-inline-flex align-items-center py-2 pr-2">
+      <div class="d-flex align-items-center">
+        <span>
+          You don't have domain connected to your store
+        </span>
+        <%= link_to 'Connect your own domain', spree.admin_custom_domains_path, class: 'btn btn-link ml-3' %>
+      </div>
+    </div>
+  <% end %>
+<% end %>
+
+<div class="card-lg p-0">
+  <div class="table-responsive rounded-lg">
+    <table class="table">
+      <thead class="text-muted">
+        <tr>
+          <th class="bg-transparent"><%= Spree.t(:theme) %></th>
+          <th class="bg-transparent"><%= Spree.t(:status) %></th>
+          <th class="bg-transparent"></th>
+        </tr>
+      </thead>
+      <tbody>
+        <%= render partial: 'spree/admin/themes/theme', collection: @themes, cached: spree_base_cache_scope %>
+      </tbody>
+    </table>
+  </div>
+</div>
+
+<% if available_themes.any? %>
+  <div class="card-lg p-0">
+    <div class="card-header">
+      <h5 class="card-title">Add a new theme</h5>
+    </div>
+    <div class="card-body pb-0">
+      <p>Pick a theme from the list of available themes</p>
+
+      <div class="row row-cols-1 row-cols-md-2 row-cols-lg-3">
+        <% available_themes.each do |theme| %>
+          <div class="col mb-4">
+            <div class="card hover-light">
+              <% if theme.preview_image_url.present? %>
+                <%= image_tag theme.preview_image_url, class: 'card-img-top' %>
+              <% end %>
+              <div class="card-body">
+                <h5 class="card-title"><%= theme.display_name %></h5>
+                <p class="text-muted">
+                  by <%= link_to theme.authors.join(', '), theme.website, target: '_blank' %>
+                </p>
+                <p><%= theme.description %></p>
+
+                <%= form_for :theme, url: spree.admin_themes_path do |f| %>
+                  <%= f.hidden_field :type, value: theme.to_s %>
+                  <%= f.submit Spree.t(:add), class: 'btn btn-primary' %>
+                <% end %>
+              </div>
+            </div>
+          </div>
+        <% end %>
+      </div>
+    </div>
+  </div>
+<% end %>

data/app/views/spree/admin/themes/update.turbo_stream.erb

@@ -0,0 +1 @@
+<%= refresh_theme_preview %>

data/app/views/spree/admin/translations/_translations_unavailable.html.erb

@@ -0,0 +1,10 @@
+<div class="container">
+  <div class="card">
+    <div class="card-body">
+      <p>To use translations, configure more than one locale for the store.</p>
+      <% if can?(:edit, current_store) %>
+        <%= button_link_to('Configure store', spree.edit_admin_store_path(current_store)) %>
+      <% end %>
+    </div>
+  </div>
+</div>

data/app/views/spree/admin/translations/edit.html.erb

@@ -0,0 +1,47 @@
+<% content_for :page_title do %>
+  <%= page_header_back_button @back_path %>
+  <span class="mr-3"><%= Spree.t(:translations_for, resource_name: @resource_name) %></span>
+<% end %>
+<% if @locales.any?%>
+  <% if @locales.many? %>
+    <%= form_with url: spree.edit_admin_translation_path(@resource, resource_type: @resource.class.to_s), class: "w-100 d-flex justify-content-end", data: { controller: 'auto-submit', turbo_frame: 'translations_table'}, method: :get do |f| %>
+      <div class="form-inline gap-2">
+        <%= f.label :translation_locale, Spree.t(:language) %>
+        <%= f.select :translation_locale, options_for_select(@locales.map { |locale| [Spree.t('i18n.this_file_language', locale: locale), locale] }, @selected_translation_locale), {}, { class: 'custom-select', data: { action: 'change->auto-submit#submit' } } %>
+      </div>
+    <% end %>
+  <% end %>
+  <%= form_with url: spree.admin_translation_path(@resource, resource_type: @resource.class.to_s), method: :put, class: 'form-horizontal' do |f| %>
+    <%= turbo_frame_tag :translations_table, class: "table-responsive border rounded bg-white my-3", refresh: "morph" do %>
+      <%= hidden_field_tag :translation_locale, @selected_translation_locale %>
+      <table class="table">
+        <thead class="text-muted">
+          <tr>
+            <th scope="col" class="text-center"><%= Spree.t(:field) %></th>
+            <th scope="col" class="text-center" style="width: 40%;"><%= Spree.t('i18n.this_file_language', locale: :en) %> (<%= Spree.t(:default) %>)</th>
+            <th scope="col" class="text-center"><%= Spree.t('i18n.this_file_language', locale: @selected_translation_locale) %></th>
+          </tr>
+        </thead>
+        <tbody>
+          <% options = { resource: @resource, selected_translation_locale: @selected_translation_locale } %>
+          <% case @resource %>
+          <% when Spree::Product %>
+            <%= render 'spree/admin/translations/products/form', options %>
+          <% when Spree::Taxon %>
+            <%= render 'spree/admin/translations/taxons/form', options %>
+          <% when Spree::Taxonomy %>
+            <%= render 'spree/admin/translations/taxonomies/form', options %>
+          <% when Spree::Store %>
+            <%= render 'spree/admin/translations/stores/form', options %>
+          <% end %>
+        </tbody>
+      </table>
+    <% end %>
+    <div class="form-actions">
+      <%= turbo_save_button_tag Spree.t('actions.update') %>
+      <%= link_to Spree.t('actions.cancel'), @back_path, class: 'btn btn-light ml-auto' %>
+    </div>
+  <% end %>
+<% else %>
+  <%= render partial: 'spree/admin/translations/translations_unavailable' %>
+<% end %>

data/app/views/spree/admin/translations/products/_form.html.erb

@@ -0,0 +1,23 @@
+<% resource.class.translatable_fields.each do |field| %>
+  <% if field == :meta_keywords %>
+    <% next %>
+  <% end %>
+  <tr>
+    <td class="text-left">
+      <%= Spree.t(field) %>
+    </td>
+    <% [@default_locale, selected_translation_locale].each do |translation_locale| %>
+      <% readonly = translation_locale == @default_locale %>
+      <td <% if readonly %>style="width: 40%;"<% else %>style="width: 60%;"<% end %>>
+        <% case field%>
+        <% when :description %>
+          <div class="border rounded mb-0">
+            <%= text_area_tag "translation[#{field}][#{translation_locale}]", resource.get_field_with_locale(translation_locale, field), { rows: 10, class: "form-control spree-rte", readonly: readonly, contenteditable: !readonly } %>
+          </div>
+        <% else %>
+          <%= text_field_tag "translation[#{field}][#{translation_locale}]", resource.get_field_with_locale(translation_locale, field), class: 'form-control', readonly: readonly %>
+        <% end %>
+      </td>
+    <% end %>
+  </tr>
+<% end %>

data/app/views/spree/admin/translations/stores/_form.html.erb

@@ -0,0 +1,23 @@
+<% resource.class.translatable_fields.each do |field| %>
+  <% if field == :meta_keywords %>
+    <% next %>
+  <% end %>
+  <tr>
+    <td class="text-left">
+      <%= Spree.t(field) %>
+    </td>
+    <% [@default_locale, selected_translation_locale].each do |translation_locale| %>
+      <% readonly = translation_locale == @default_locale %>
+      <td <% if readonly %>style="width: 40%;"<% else %>style="width: 60%;"<% end %>>
+        <% case field%>
+        <% when :description %>
+          <div class="trix-container mb-0">
+            <%= rich_text_area_tag "translation[#{field}][#{translation_locale}]", resource.get_field_with_locale(translation_locale, field), { contenteditable: !readonly } %>
+          </div>
+        <% else %>
+          <%= text_field_tag "translation[#{field}][#{translation_locale}]", resource.get_field_with_locale(translation_locale, field), class: 'form-control', readonly: readonly %>
+        <% end %>
+      </td>
+    <% end %>
+  </tr>
+<% end %>

data/app/views/spree/admin/translations/taxonomies/_form.html.erb

@@ -0,0 +1,20 @@
+<% resource.class.translatable_fields.each do |field| %>
+  <tr>
+    <td class="text-left">
+      <%= Spree.t(field) %>
+    </td>
+    <% [@default_locale, selected_translation_locale].each do |translation_locale| %>
+      <% readonly = translation_locale == @default_locale %>
+      <td <% if readonly %>style="width: 40%;"<% else %>style="width: 60%;"<% end %>>
+        <% case field%>
+        <% when :description %>
+          <div class="trix-container mb-0">
+            <%= rich_text_area_tag "translation[#{field}][#{translation_locale}]", resource.get_field_with_locale(translation_locale, field), { contenteditable: !readonly } %>
+          </div>
+        <% else %>
+          <%= text_field_tag "translation[#{field}][#{translation_locale}]", resource.get_field_with_locale(translation_locale, field), class: 'form-control', readonly: readonly %>
+        <% end %>
+      </td>
+    <% end %>
+  </tr>
+<% end %>

data/app/views/spree/admin/translations/taxons/_form.html.erb

@@ -0,0 +1,37 @@
+<% resource.class.translatable_fields.each do |field| %>
+  <% if field == :pretty_name %>
+    <% next %>
+  <% end %>
+  <tr>
+    <td class="text-left">
+      <%= Spree.t(field) %>
+    </td>
+    <% [@default_locale, selected_translation_locale].each do |translation_locale| %>
+      <% readonly = translation_locale == @default_locale %>
+      <td <% if readonly %>style="width: 40%;"<% else %>style="width: 60%;"<% end %>>
+        <% case field%>
+        <% when :description %>
+          <div class="trix-container mb-0">
+            <%= rich_text_area_tag "translation[#{field}][#{translation_locale}]", resource.get_field_with_locale(translation_locale, field), { contenteditable: !readonly } %>
+          </div>
+        <% when :permalink %>
+          <% parent_permalink = resource.parent.present? ? I18n.with_locale(translation_locale) { resource.parent.permalink } + "/" : "" %>
+          <div class="form-group">
+            <div class="input-group">
+              <% if parent_permalink.present? %>
+                <div class="input-group-prepend">
+                  <span class="input-group-text">
+                    <%= parent_permalink %>
+                  </span>
+                </div>
+              <% end %>
+              <%= text_field_tag "translation[#{field}][#{translation_locale}]", resource.get_field_with_locale(translation_locale, field)&.delete_prefix(parent_permalink), class: 'form-control', readonly: readonly %>
+            </div>
+          </div>
+        <% else %>
+          <%= text_field_tag "translation[#{field}][#{translation_locale}]", resource.get_field_with_locale(translation_locale, field), class: 'form-control', readonly: readonly %>
+        <% end %>
+      </td>
+    <% end %>
+  </tr>
+<% end %>