spree_admin 5.5.3 → 5.6.0.rc1

data/app/javascript/spree/admin/controllers/query_builder_controller.js

@@ -226,22 +226,10 @@ export default class extends Controller {
     const operatorSelect = filterRow.querySelector("[data-operator-select]")
     operatorSelect.innerHTML = ""
 
-    const operatorLabels = {
-      eq: "equals",
-      not_eq: "does not equal",
-      cont: "contains",
-      not_cont: "does not contain",
-      start: "starts with",
-      end: "ends with",
-      gt: "greater than",
-      gteq: "greater than or equal",
-      lt: "less than",
-      lteq: "less than or equal",
-      in: "is any of",
-      not_in: "is none of",
-      null: "is empty",
-      not_null: "is not empty"
-    }
+    // Labels come from the server already translated (see Filter.operators_for_select).
+    const operatorLabels = Object.fromEntries(
+      this.operatorsValue.map(op => [op.value, op.label])
+    )
 
     operators.forEach(op => {
       const option = document.createElement("option")
@@ -355,8 +343,21 @@ export default class extends Controller {
 
         if (fieldConfig.search_url) {
           wrapper.dataset.selectUrlValue = fieldConfig.search_url
-          // Use remote search mode so it doesn't pre-fetch and overwrite our preloaded options
-          wrapper.dataset.selectRemoteSearchValue = "true"
+
+          if (fieldConfig.preload_options) {
+            // Small, fixed option set: load it once and filter client-side on
+            // the localized `label` while submitting the underlying value.
+            wrapper.dataset.selectLabelFieldValue = "label"
+            wrapper.dataset.selectSearchFieldValue = "label"
+            // Preserve the server's localized-name ordering. The label is
+            // flag-prefixed, so sorting by it would order by flag codepoints
+            // (ISO) instead of name; "$order" keeps the received order.
+            wrapper.dataset.selectSortFieldValue = "$order"
+          } else {
+            // Remote search mode so it doesn't pre-fetch and overwrite our
+            // preloaded options (datasets here are large / server-limited).
+            wrapper.dataset.selectRemoteSearchValue = "true"
+          }
         }
 
         // Use name as value field for tags (tags_name ransack attribute expects tag names)
@@ -371,17 +372,27 @@ export default class extends Controller {
         input.dataset.selectTarget = "input"
         input.dataset.valueInput = "" // Mark as value input for serialization
 
-        // Restore existing values - we store as array of {id, name} objects
-        // Use remoteSearchActiveOption which properly preloads options and selects them
+        // Restore existing values - we store as array of {id, name} objects.
         if (existingValue !== null && existingValue !== undefined && Array.isArray(existingValue) && existingValue.length > 0) {
-          const preloadedOptions = existingValue.map(item => {
-            if (typeof item === 'object') {
-              return { id: useNameAsValue ? item.name : item.id, name: item.name }
-            } else {
-              return { id: item, name: item }
-            }
-          })
-          wrapper.dataset.selectRemoteSearchActiveOptionValue = JSON.stringify(preloadedOptions)
+          if (fieldConfig.preload_options) {
+            // The full option list is preloaded, so we only need the selected
+            // values; Tom Select resolves their labels from the loaded options.
+            const selectedValues = existingValue.map(item =>
+              String(typeof item === 'object' ? item.id : item)
+            )
+            wrapper.dataset.selectActiveOptionValue = JSON.stringify(selectedValues)
+          } else {
+            // Remote search: preload the selected options so they render with
+            // their labels without first issuing a search.
+            const preloadedOptions = existingValue.map(item => {
+              if (typeof item === 'object') {
+                return { id: useNameAsValue ? item.name : item.id, name: item.name }
+              } else {
+                return { id: item, name: item }
+              }
+            })
+            wrapper.dataset.selectRemoteSearchActiveOptionValue = JSON.stringify(preloadedOptions)
+          }
         }
 
         // Set up change listener on select element directly

data/app/javascript/spree/admin/controllers/variants_form_controller.js

@@ -72,6 +72,10 @@ export default class extends CheckboxSelectAll {
     }
 
     this.inventoryFormTarget = document.querySelector('.inventory-form');
+
+    // Drop stale removal inputs (e.g. restored from the Turbo cache) so a fresh
+    // session never re-submits removals the user didn't make in it.
+    this.syncRemovedVariantIdInputs()
   }
 
   toggleQuantityTracked() {
@@ -119,6 +123,37 @@ export default class extends CheckboxSelectAll {
     }
   }
 
+  // The set of persisted variant ids the user removed from the matrix. Submitted as
+  // `product[removed_variant_ids][]` — the server only ever destroys ids listed there,
+  // never variants that are merely missing from the re-submitted form.
+  get removedVariantIds() {
+    if (!this._removedVariantIds) this._removedVariantIds = new Set()
+
+    return this._removedVariantIds
+  }
+
+  markVariantRemoved(internalName) {
+    const variantId = this.variantIdsValue[internalName]
+    if (variantId) this.removedVariantIds.add(String(variantId))
+  }
+
+  markVariantKept(internalName) {
+    const variantId = this.variantIdsValue[internalName]
+    if (variantId) this.removedVariantIds.delete(String(variantId))
+  }
+
+  syncRemovedVariantIdInputs() {
+    this.element.querySelectorAll('input[name="product[removed_variant_ids][]"]').forEach((input) => input.remove())
+
+    this.removedVariantIds.forEach((variantId) => {
+      const input = document.createElement('input')
+      input.type = 'hidden'
+      input.name = 'product[removed_variant_ids][]'
+      input.value = variantId
+      this.element.appendChild(input)
+    })
+  }
+
   deleteSelected() {
     const newStockValue = this.stockValue
     const newPricesValue = this.pricesValue
@@ -126,6 +161,7 @@ export default class extends CheckboxSelectAll {
       const internalName = checkbox.value
 
       this.ignoredVariants.add(internalName)
+      this.markVariantRemoved(internalName)
       const variant = this.variantsContainerTarget.querySelector(`[data-variant-name="${internalName}"]`)
 
       const nestingLevel = internalName.split('/').length
@@ -157,7 +193,8 @@ export default class extends CheckboxSelectAll {
 
       delete newStockValue[internalName]
       delete newPricesValue[internalName]
-      variant.remove()
+      // the row may already be gone when deleting an option value re-rendered the matrix
+      variant?.remove()
     })
 
     this.stockValue = newStockValue
@@ -166,6 +203,7 @@ export default class extends CheckboxSelectAll {
     this.checkboxAllTarget.checked = false
     this.refresh()
     this.refreshParentInputs()
+    this.syncRemovedVariantIdInputs()
   }
 
   reorderOptions(event) {
@@ -498,6 +536,14 @@ export default class extends CheckboxSelectAll {
           }
           currentVariants.add(internalName)
 
+          // Reconcile the removal ledger with what this render keeps: leaf rows
+          // re-submit their variant id, parent (grouping) rows never do.
+          if (i === nestingLevel - 1) {
+            this.markVariantKept(internalName)
+          } else if (i === 0 && nestingLevel > 1) {
+            this.markVariantRemoved(internalName)
+          }
+
           const existingVariant = this.variantsContainerTarget.querySelector(`[data-variant-name="${internalName}"]`)
           if (existingVariant) {
             if (i === 0) {
@@ -599,6 +645,7 @@ export default class extends CheckboxSelectAll {
     this.variantsContainerTarget.querySelectorAll('[data-variants-form-target="variant"]').forEach((variant) => {
       const variantName = variant.dataset.variantName
       if (!currentVariants.has(variantName)) {
+        this.markVariantRemoved(variantName)
         variant.remove()
       }
     })
@@ -609,6 +656,7 @@ export default class extends CheckboxSelectAll {
     }
 
     this.refreshParentInputs()
+    this.syncRemovedVariantIdInputs()
   }
 
   refreshParentInputs() {

data/app/javascript/spree/admin/helpers/display_names.js

@@ -0,0 +1,54 @@
+/** Mirrors the React dashboard's `CODE — Localized Name` format. */
+export function formatCodeName(code, name) {
+  const upper = code.toUpperCase()
+  if (!name || name.toUpperCase() === upper) return upper
+  return `${upper} — ${name}`
+}
+
+// Intl.DisplayNames construction is the expensive part (locale resolution +
+// table setup); .of() is cheap. Cache one formatter per (type, locale) so
+// localizing a large select doesn't rebuild it for every option.
+const formatterCache = new Map()
+
+function displayNameFormatter(type, locale) {
+  const key = `${type}:${locale}`
+  if (formatterCache.has(key)) return formatterCache.get(key)
+
+  let formatter
+  try {
+    formatter = new Intl.DisplayNames([locale, 'en'], { type })
+  } catch {
+    formatter = null
+  }
+  formatterCache.set(key, formatter)
+  return formatter
+}
+
+/** Resolve a code via Intl.DisplayNames in the admin UI language. */
+export function intlDisplayName(type, code, locale) {
+  if (!code) return undefined
+
+  const formatter = displayNameFormatter(type, locale)
+  if (!formatter) return undefined
+
+  try {
+    return formatter.of(code)
+  } catch {
+    return undefined
+  }
+}
+
+/** Returns the admin UI locale from `<html lang>`, defaulting to `en` when unset. */
+export function adminUiLocale() {
+  return document.documentElement.lang || 'en'
+}
+
+/** Rewrite <option> labels using Intl.DisplayNames before Tom Select init. */
+export function localizeSelectOptions(select, type, locale = adminUiLocale()) {
+  for (const option of select.options) {
+    if (!option.value) continue
+
+    const name = intlDisplayName(type, option.value, locale)
+    if (name) option.textContent = formatCodeName(option.value, name)
+  }
+}

data/app/models/spree/admin/table/column.rb

@@ -44,6 +44,11 @@ module Spree
         attribute :operators, default: -> { [] }
         attribute :value_options
         attribute :search_url
+        # When true, the autocomplete filter loads the full option list from
+        # `search_url` once and filters it client-side on each option's `label`
+        # field (instead of querying the server per keystroke). Only suitable for
+        # small, fixed option sets whose endpoint returns a `label` attribute.
+        attribute :preload_options, :boolean, default: false
         attribute :sort_scope_asc
         attribute :sort_scope_desc
 
@@ -69,7 +74,16 @@ module Spree
 
         # Resolve label (handles i18n keys)
         def resolve_label
-          return I18n.t(label, default: label.split('.').last.humanize) if label.is_a?(String) && label.include?('.')
+          if label.is_a?(String) && label.include?('.')
+            # Dotted keys may live under the `spree` namespace (e.g. `admin.num_orders`,
+            # `price_list_statuses.active`) or at the I18n root (e.g. `activerecord.attributes.*`).
+            # Prefer the `spree`-scoped lookup, then fall back to the root lookup.
+            scoped = Spree.t(label, default: '')
+            return scoped if scoped.present?
+
+            return I18n.t(label, default: label.split('.').last.humanize)
+          end
+
           return label if label.is_a?(String) && label.present?
 
           key_to_translate = label || key

data/app/models/spree/admin/table/filter.rb

@@ -3,20 +3,20 @@ module Spree
     class Table
       class Filter
         OPERATORS = {
-          eq: { label: 'equals', predicate: '_eq' },
-          not_eq: { label: 'does not equal', predicate: '_not_eq' },
-          cont: { label: 'contains', predicate: '_cont' },
-          not_cont: { label: 'does not contain', predicate: '_not_cont' },
-          start: { label: 'starts with', predicate: '_start' },
-          end: { label: 'ends with', predicate: '_end' },
-          gt: { label: 'greater than', predicate: '_gt' },
-          gteq: { label: 'greater than or equal to', predicate: '_gteq' },
-          lt: { label: 'less than', predicate: '_lt' },
-          lteq: { label: 'less than or equal to', predicate: '_lteq' },
-          in: { label: 'is any of', predicate: '_in' },
-          not_in: { label: 'is none of', predicate: '_not_in' },
-          null: { label: 'is empty', predicate: '_null', no_value: true },
-          not_null: { label: 'is not empty', predicate: '_not_null', no_value: true }
+          eq: { predicate: '_eq' },
+          not_eq: { predicate: '_not_eq' },
+          cont: { predicate: '_cont' },
+          not_cont: { predicate: '_not_cont' },
+          start: { predicate: '_start' },
+          end: { predicate: '_end' },
+          gt: { predicate: '_gt' },
+          gteq: { predicate: '_gteq' },
+          lt: { predicate: '_lt' },
+          lteq: { predicate: '_lteq' },
+          in: { predicate: '_in' },
+          not_in: { predicate: '_not_in' },
+          null: { predicate: '_null', no_value: true },
+          not_null: { predicate: '_not_null', no_value: true }
         }.freeze
 
         attr_accessor :field, :operator, :value, :id
@@ -73,7 +73,7 @@ module Spree
         # Get human-readable operator label
         # @return [String]
         def operator_label
-          OPERATORS.dig(@operator, :label) || @operator.to_s.humanize
+          self.class.translate_operator(@operator)
         end
 
         # Check if this operator requires a value
@@ -107,9 +107,16 @@ module Spree
         # @return [Array<Hash>]
         def self.operators_for_select
           OPERATORS.map do |key, config|
-            { value: key.to_s, label: config[:label], no_value: config[:no_value] || false }
+            { value: key.to_s, label: translate_operator(key), no_value: config[:no_value] || false }
           end
         end
+
+        # Translate an operator key to its human-readable label
+        # @param operator [Symbol]
+        # @return [String]
+        def self.translate_operator(operator)
+          Spree.t("admin.table.operators.#{operator}", default: operator.to_s.humanize)
+        end
       end
     end
   end

data/app/models/spree/admin/table/query_builder.rb

@@ -80,7 +80,8 @@ module Spree
               type: column.filter_type.to_s,
               operators: column.operators.map(&:to_s),
               value_options: format_value_options(column.value_options),
-              search_url: resolve_search_url(column.search_url, view_context)
+              search_url: resolve_search_url(column.search_url, view_context),
+              preload_options: column.preload_options
             }
           end
         end
@@ -107,12 +108,20 @@ module Spree
 
           resolved_options.map do |opt|
             if opt.is_a?(Hash)
-              { value: opt[:value] || opt['value'], label: opt[:label] || opt['label'] }
+              { value: opt[:value] || opt['value'], label: resolve_option_label(opt[:label] || opt['label']) }
             else
               { value: opt.to_s, label: opt.to_s.humanize }
             end
           end
         end
+
+        # Translate a value-option label when it is given as an i18n key (a dotted
+        # string like 'admin.products.draft'); plain strings are returned as-is.
+        def resolve_option_label(label)
+          return label unless label.is_a?(String) && label.include?('.')
+
+          I18n.t(label, default: label.split('.').last.humanize)
+        end
       end
     end
   end

data/app/views/active_storage/_upload_form.html.erb

@@ -52,7 +52,7 @@
       </button>
 
       <% if show_delete_button %>
-        <button type="button" class="btn btn-danger ml-auto" data-action="active-storage-upload#remove" data-turbo-confirm="<%= Spree.t(:are_you_sure) %>">
+        <button type="button" class="btn btn-danger ms-auto" data-action="active-storage-upload#remove" data-turbo-confirm="<%= Spree.t(:are_you_sure) %>">
           <%= icon('trash') %>
 
           <%= Spree.t('actions.destroy') %>

data/app/views/layouts/spree/admin.html.erb

@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="<%= I18n.locale %>">
+<html lang="<%= I18n.locale %>" dir="<%= html_dir %>">
   <head>
     <%= render "spree/admin/shared/head" %>
     <%= render "spree/admin/shared/custom_head" %>

data/app/views/layouts/spree/admin_settings.html.erb

@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="<%= I18n.locale %>">
+<html lang="<%= I18n.locale %>" dir="<%= html_dir %>">
   <head>
     <%= render "spree/admin/shared/head" %>
   </head>

data/app/views/layouts/spree/admin_wizard.html.erb

@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="<%= I18n.locale %>">
+<html lang="<%= I18n.locale %>" dir="<%= html_dir %>">
   <head>
     <%= render "spree/admin/shared/head" %>
   </head>
@@ -14,7 +14,7 @@
       <%= link_to_with_icon 'arrow-back', Spree.t('admin.back_to_dashboard'), spree.admin_path, class: 'hover:bg-gray-100 flex justify-start gap-2 px-8 no-underline h-16 items-center' %>
 
       <% if content_for?(:steps) %>
-        <ol class="flex items-center list-none p-0 grow justify-between h-16 border-l border-gray-200" id="steps">
+        <ol class="flex items-center list-none p-0 grow justify-between h-16 border-s border-gray-200" id="steps">
           <%= yield :steps %>
         </ol>
       <% end %>

data/app/views/layouts/spree/minimal.html.erb

@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="<%= I18n.locale %>">
+<html lang="<%= I18n.locale %>" dir="<%= html_dir %>">
   <head>
     <%= render "spree/admin/shared/head" %>
   </head>

data/app/views/spree/admin/admin_users/_audit_log.html.erb

@@ -1,5 +1,5 @@
 <div class="text-gray-600 py-12 gap-4 flex flex-col items-center justify-center">
-  <p>Audit log is part of the Spree Enterprise offering.</p>
+  <p><%= Spree.t('admin.admin_users.audit_log_enterprise_notice') %></p>
 
-  <%= external_link_to 'Upgrade to Spree Enterprise', 'https://spreecommerce.org/pricing', class: 'btn btn-primary' %>
+  <%= external_link_to Spree.t('admin.admin_users.upgrade_to_enterprise'), 'https://spreecommerce.org/pricing', class: 'btn btn-primary' %>
 </div>

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

@@ -3,7 +3,7 @@
 
       <div class="rounded-md border p-6 mb-6 flex items-center gap-2">
         <%= render_avatar(@invitation.inviter, height: 32, width: 32) %>
-        <%= @invitation.inviter.name %> has invited you to join <strong><%= @invitation.resource.name %></strong>
+        <%= Spree.t('admin.invitations.invited_you_to_join_html', inviter: tag.strong(@invitation.inviter.name), resource: tag.strong(@invitation.resource.name)) %>
       </div>
 
       <%= render 'form', f: f %>

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

@@ -66,7 +66,7 @@
       <%= drawer_discard_button %>
       <%= link_to Spree.t('actions.destroy'), object_url(@asset),
           data: { turbo_method: :delete, turbo_confirm: Spree.t(:are_you_sure_delete), turbo_frame: '_top' },
-          class: 'btn btn-danger ml-auto' if can?(:destroy, @asset) %>
+          class: 'btn btn-danger ms-auto' if can?(:destroy, @asset) %>
     </div>
   <% end %>
 <% end %>

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

@@ -15,5 +15,15 @@
         { label: Spree.t('admin.channels.order_routing_strategy'),
           help_bubble: Spree.t('admin.channels.order_routing_strategy_hint'),
           include_blank: Spree.t('admin.channels.order_routing_strategy_inherit') } %>
+    <%= f.spree_select :preferred_storefront_access,
+        options_for_select(channel_storefront_access_options, f.object.preferred_storefront_access),
+        { label: Spree.t('admin.channels.storefront_access'),
+          help_bubble: Spree.t('admin.channels.storefront_access_hint'),
+          include_blank: Spree.t('admin.channels.storefront_access_inherit') } %>
+    <%= f.spree_select :preferred_guest_checkout,
+        options_for_select(channel_guest_checkout_options, f.object.preferred_guest_checkout&.to_s || ''),
+        { label: Spree.t('admin.channels.guest_checkout'),
+          help_bubble: Spree.t('admin.channels.guest_checkout_hint'),
+          include_blank: Spree.t('admin.channels.guest_checkout_inherit') } %>
   </div>
 </div>

data/app/views/spree/admin/dashboard/_setup_progress.html.erb

@@ -1,14 +1,14 @@
 <div class="card mb-6" id="setup_progress">
   <div class="card-body">
     <div class="mb-4">
-      Your overall setup progress
-      <span class="float-right badge badge-<%= current_store.setup_completed? ? 'success' : 'info' %>">
+      <%= Spree.t('admin.dashboard.setup_progress.title') %>
+      <span class="badge badge-<%= current_store.setup_completed? ? 'success' : 'info' %> inline-block">
         <% if current_store.setup_completed? %>
           <%= icon('check', class: 'text-green-700') %>
         <% end %>
 
-        <span>
-          <strong><%= current_store.setup_tasks_done %></strong> of <%= current_store.setup_tasks_total %> steps done
+        <span dir="auto">
+          <%= Spree.t('admin.dashboard.setup_progress.steps_done_html', done: current_store.setup_tasks_done, total: current_store.setup_tasks_total) %>
         </span>
       </span>
     </div>

data/app/views/spree/admin/dashboard/_setup_tasks.html.erb

@@ -1,20 +1,21 @@
 <div id="setup_tasks" class="flex flex-col gap-4">
   <% task_in_progress = nil %>
-  <% current_store.setup_tasks_list.each_with_index do |task, index| %>
-    <% done = current_store.setup_task_done?(task) %>
+  <% current_store.setup_tasks.each do |item| %>
+    <% task = item.name %>
+    <% done = item.done %>
     <% unless done %>
       <% task_in_progress ||= task %>
     <% end %>
     <% is_expanded = task_in_progress == task %>
 
     <div class="card overflow-hidden" data-controller="reveal" data-reveal-hidden-class="is-collapsed" id="setup_task_<%= task %>">
-      <div class="card-header card-header--collapsible border-0 h-auto no-underline flex items-center p-3 text-gray-900 font-normal w-full bg-transparent cursor-pointer focus:outline-none focus:ring-0 hover:bg-gray-50"
+      <div class="card-header card-header--collapsible border-0 h-auto no-underline flex items-center gap-2 p-3 text-gray-900 font-normal w-full bg-transparent cursor-pointer focus:outline-none focus:ring-0 hover:bg-gray-50"
            role="button"
            tabindex="0"
            data-action="click->reveal#toggle keydown.enter->reveal#toggle keydown.space->reveal#toggle">
         <%= onboarding_check_circle(done) %>
         <span class="ml-6 font-medium"><%= Spree.t("admin.store_setup_tasks.#{task}") %></span>
-        <%= icon('chevron-right', class: 'arrow ml-auto transition-transform duration-200') %>
+        <%= icon('chevron-right', class: 'arrow ms-auto transition-transform duration-200') %>
       </div>
       <div data-reveal-target="item" class="collapsible-content <%= 'is-collapsed' unless is_expanded %>">
         <div>

data/app/views/spree/admin/dashboard/_updater.html.erb

@@ -3,17 +3,17 @@
     <%= image_tag 'favicon_256x256.png', alt: 'Spree', width: 32, height: 32 %>
     <div class="flex flex-col">
       <p class="mb-1">
-        <strong>Spree <%= spree_updater.latest_release['name'] %></strong> is available.
-        <br />Your current version is <strong>Spree <%= spree_updater.current_release %></strong>. 
+        <%= Spree.t('admin.dashboard.updater.available_html', version: tag.strong("Spree #{spree_updater.latest_release['name']}")) %>
+        <br /><%= Spree.t('admin.dashboard.updater.current_version_html', version: tag.strong("Spree #{spree_updater.current_release}")) %>
       </p>
 
       <% if spree_updater.latest_release['url'] %>
         <div>
-          <%= external_link_to "View release notes", spree_updater.latest_release['url'], target: '_blank', class: 'btn btn-sm btn-secondary' %>
+          <%= external_link_to Spree.t('admin.dashboard.updater.view_release_notes'), spree_updater.latest_release['url'], target: '_blank', class: 'btn btn-sm btn-secondary' %>
         </div>
       <% end %>
     </div>
 
-    <%= link_to '', spree.admin_dismiss_updater_notice_path, data: { turbo_method: :patch }, class: 'btn-close ml-auto' %>
+    <%= link_to '', spree.admin_dismiss_updater_notice_path, data: { turbo_method: :patch }, class: 'btn-close ms-auto' %>
   </div>
 <% end %>

data/app/views/spree/admin/dashboard/_visits.html.erb

@@ -3,7 +3,7 @@
     <div class="card h-full">
       <div class="card-header">
         <h5 class="card-title">
-          Where are visitors coming from?
+          <%= Spree.t('admin.dashboard.visits.referrers_title') %>
         </h5>
       </div>
       <% if @top_referrers.any? %>
@@ -19,9 +19,9 @@
         <p class="m-12 text-center text-gray-600">
           <%= icon 'share', height: 50, class: 'mb-4', style: 'opacity: 0.5' %>
           <br />
-          <strong>No data</strong>
+          <strong><%= Spree.t('admin.dashboard.visits.no_data') %></strong>
           <br />
-          No data available for this period.
+          <%= Spree.t('admin.dashboard.visits.no_data_for_period') %>
         </p>
       <% end %>
     </div>
@@ -30,7 +30,7 @@
     <div class="card h-full">
       <div class="card-header">
         <h5 class="card-title">
-          Top landing pages
+          <%= Spree.t('admin.dashboard.visits.landing_pages_title') %>
         </h5>
       </div>
       <% if @top_landing_pages.any? %>
@@ -46,9 +46,9 @@
         <p class="m-12 text-center text-gray-600">
           <%= icon 'pointer', height: 50, class: 'mb-4', style: 'opacity: 0.5' %>
           <br />
-          <strong>No data</strong>
+          <strong><%= Spree.t('admin.dashboard.visits.no_data') %></strong>
           <br />
-          No data available for this period.
+          <%= Spree.t('admin.dashboard.visits.no_data_for_period') %>
         </p>
       <% end %>
     </div>
@@ -57,7 +57,7 @@
     <div class="card h-full">
       <div class="card-header">
         <h5 class="card-title">
-          Visitor location
+          <%= Spree.t('admin.dashboard.visits.locations_title') %>
         </h5>
       </div>
       <% if @top_locations.any? %>
@@ -80,9 +80,9 @@
         <p class="m-12 text-center text-gray-600">
           <%= icon 'world', height: 50, class: 'mb-4', style: 'opacity: 0.5' %>
           <br />
-          <strong>No data</strong>
+          <strong><%= Spree.t('admin.dashboard.visits.no_data') %></strong>
           <br />
-          No data available for this period.
+          <%= Spree.t('admin.dashboard.visits.no_data_for_period') %>
         </p>
       <% end %>
     </div>
@@ -91,7 +91,7 @@
     <div class="card">
       <div class="card-header">
         <h5 class="card-title">
-          Visitor devices
+          <%= Spree.t('admin.dashboard.visits.devices_title') %>
         </h5>
       </div>
       <% if @top_devices.count > 0 %>
@@ -102,9 +102,9 @@
         <p class="m-12 text-center text-gray-600">
           <%= icon 'device-mobile', height: 50, class: 'mb-4', style: 'opacity: 0.5' %>
           <br />
-          <strong>No data</strong>
+          <strong><%= Spree.t('admin.dashboard.visits.no_data') %></strong>
           <br />
-          No data available for this period.
+          <%= Spree.t('admin.dashboard.visits.no_data_for_period') %>
         </p>
       <% end %>
     </div>