From b6c9809125f2e03200fc94eb3cf85b898da638e5 Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Thu, 16 Jul 2026 19:06:57 +0100
Subject: [PATCH 01/19] Fix QA issues in the panel Customers section
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Index:
- KPI strip now shows real counts (total, new in 30 days, business,
  linked to a user account) instead of hardcoded placeholder values
- Search also matches linked user emails, as the placeholder promises
- Remove the non-functional Export button; Docs links to the docs site
- Row avatars build initials from first/last name, not the full name
  with title

Edit:
- Address forms (new and edit) share AddressFormFields, cover every
  address field (title, line 3, state, contact email/phone, tax id)
  and show inline validation errors — the edit form previously failed
  silently
- Unlink-user confirm button says "Unlink user" instead of "Delete"
- Activity timeline translates descriptions, formats timestamps, and
  picks icons for the customer events
- Title selects translate their labels and keep an unknown stored
  title as a selectable option instead of displaying blank

Core:
- Customer address create/update/delete and user link/unlink actions
  log an explicit activity on the customer (same pattern as order
  actions), so the panel timeline reflects them

Accessibility:
- FieldLabel renders a real <label for> when given a target id; all
  customer form inputs are now programmatically labelled
- Back link on the create page has an accessible name

Translations: new keys mirrored across all 16 locales.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../Customers/CreateCustomerAddress.php       |  14 +-
 .../Customers/DeleteCustomerAddress.php       |  10 +
 .../Actions/Customers/LinkCustomerUser.php    |   6 +
 .../Actions/Customers/UnlinkCustomerUser.php  |   6 +
 .../Customers/UpdateCustomerAddress.php       |   8 +
 .../js/components/ActivityTimeline.vue        |   9 +
 .../js/components/AddressFormFields.vue       | 152 +++++++++++++
 .../resources/js/components/FieldLabel.vue    |  10 +-
 .../panel/resources/js/components/Select.vue  |  13 +-
 .../resources/js/pages/customers/Create.vue   |  49 +++--
 .../resources/js/pages/customers/Edit.vue     | 203 ++++++------------
 .../resources/js/pages/customers/Index.vue    |  35 ++-
 .../panel/resources/lang/ar/customers.php     |  27 +++
 .../panel/resources/lang/bg/customers.php     |  27 +++
 .../panel/resources/lang/de/customers.php     |  27 +++
 .../panel/resources/lang/en/customers.php     |  27 +++
 .../panel/resources/lang/es/customers.php     |  27 +++
 .../panel/resources/lang/fa/customers.php     |  27 +++
 .../panel/resources/lang/fr/customers.php     |  27 +++
 .../panel/resources/lang/hr/customers.php     |  27 +++
 .../panel/resources/lang/hu/customers.php     |  27 +++
 .../panel/resources/lang/mn/customers.php     |  27 +++
 .../panel/resources/lang/nl/customers.php     |  27 +++
 .../panel/resources/lang/pl/customers.php     |  27 +++
 .../panel/resources/lang/pt_BR/customers.php  |  27 +++
 .../panel/resources/lang/ro/customers.php     |  27 +++
 .../panel/resources/lang/tr/customers.php     |  27 +++
 .../panel/resources/lang/vi/customers.php     |  27 +++
 .../Customers/CustomerIndexController.php     |  15 +-
 .../Feature/Customers/CustomerAddressTest.php |  42 ++++
 .../Feature/Customers/CustomerIndexTest.php   |  33 +++
 .../Feature/Customers/CustomerUserTest.php    |  18 ++
 32 files changed, 873 insertions(+), 182 deletions(-)
 create mode 100644 packages/panel/resources/js/components/AddressFormFields.vue

diff --git a/packages/core/src/Actions/Customers/CreateCustomerAddress.php b/packages/core/src/Actions/Customers/CreateCustomerAddress.php
index 1c747f36c8..9918fd4fc5 100644
--- a/packages/core/src/Actions/Customers/CreateCustomerAddress.php
+++ b/packages/core/src/Actions/Customers/CreateCustomerAddress.php
@@ -10,7 +10,17 @@ class CreateCustomerAddress implements CreatesCustomerAddress
 {
     public function execute(Customer $customer, array $attributes): Address
     {
-        /** @var Address */
-        return $customer->addresses()->create($attributes);
+        /** @var Address $address */
+        $address = $customer->addresses()->create($attributes);
+
+        // Explicit timeline entry on the customer, so address changes show
+        // up in the customer's activity log alongside created/updated.
+        activity()
+            ->causedBy(auth()->user())
+            ->performedOn($customer)
+            ->event('address-created')
+            ->log('address-created');
+
+        return $address;
     }
 }
diff --git a/packages/core/src/Actions/Customers/DeleteCustomerAddress.php b/packages/core/src/Actions/Customers/DeleteCustomerAddress.php
index d9e6bd19ae..3aa24e0972 100644
--- a/packages/core/src/Actions/Customers/DeleteCustomerAddress.php
+++ b/packages/core/src/Actions/Customers/DeleteCustomerAddress.php
@@ -9,6 +9,16 @@ class DeleteCustomerAddress implements DeletesCustomerAddress
 {
     public function execute(Address $address): void
     {
+        $customer = $address->customer;
+
         $address->delete();
+
+        if ($customer) {
+            activity()
+                ->causedBy(auth()->user())
+                ->performedOn($customer)
+                ->event('address-deleted')
+                ->log('address-deleted');
+        }
     }
 }
diff --git a/packages/core/src/Actions/Customers/LinkCustomerUser.php b/packages/core/src/Actions/Customers/LinkCustomerUser.php
index 046417dcfa..4fc74e3095 100644
--- a/packages/core/src/Actions/Customers/LinkCustomerUser.php
+++ b/packages/core/src/Actions/Customers/LinkCustomerUser.php
@@ -20,5 +20,11 @@ public function execute(Customer $customer, string $email): void
         $user = $userModel::where('email', $email)->firstOrFail();
 
         $customer->users()->syncWithoutDetaching([$user->getKey()]);
+
+        activity()
+            ->causedBy(auth()->user())
+            ->performedOn($customer)
+            ->event('user-linked')
+            ->log('user-linked');
     }
 }
diff --git a/packages/core/src/Actions/Customers/UnlinkCustomerUser.php b/packages/core/src/Actions/Customers/UnlinkCustomerUser.php
index c117a549ae..c31389e3f4 100644
--- a/packages/core/src/Actions/Customers/UnlinkCustomerUser.php
+++ b/packages/core/src/Actions/Customers/UnlinkCustomerUser.php
@@ -10,5 +10,11 @@ class UnlinkCustomerUser implements UnlinksCustomerUser
     public function execute(Customer $customer, int|string $userId): void
     {
         $customer->users()->detach($userId);
+
+        activity()
+            ->causedBy(auth()->user())
+            ->performedOn($customer)
+            ->event('user-unlinked')
+            ->log('user-unlinked');
     }
 }
diff --git a/packages/core/src/Actions/Customers/UpdateCustomerAddress.php b/packages/core/src/Actions/Customers/UpdateCustomerAddress.php
index 04c476d44d..0c48bfb070 100644
--- a/packages/core/src/Actions/Customers/UpdateCustomerAddress.php
+++ b/packages/core/src/Actions/Customers/UpdateCustomerAddress.php
@@ -11,6 +11,14 @@ public function execute(Address $address, array $attributes): Address
     {
         $address->update($attributes);
 
+        if ($address->customer) {
+            activity()
+                ->causedBy(auth()->user())
+                ->performedOn($address->customer)
+                ->event('address-updated')
+                ->log('address-updated');
+        }
+
         return $address;
     }
 }
diff --git a/packages/panel/resources/js/components/ActivityTimeline.vue b/packages/panel/resources/js/components/ActivityTimeline.vue
index 83f8d8d1a9..b0061cf378 100644
--- a/packages/panel/resources/js/components/ActivityTimeline.vue
+++ b/packages/panel/resources/js/components/ActivityTimeline.vue
@@ -74,6 +74,15 @@ const TYPE_META: Record<string, ToneMeta> = {
     group_removed: { icon: 'flag', tone: 'neutral' },
     address_added: { icon: 'pin', tone: 'neutral' },
     user_invited: { icon: 'mail', tone: 'neutral' },
+    // spatie/activitylog model events plus the customer action events.
+    created: { icon: 'userPlus', tone: 'sage' },
+    updated: { icon: 'edit', tone: 'neutral' },
+    deleted: { icon: 'trash', tone: 'danger' },
+    address_created: { icon: 'fileText', tone: 'neutral' },
+    address_updated: { icon: 'edit', tone: 'neutral' },
+    address_deleted: { icon: 'trash', tone: 'archived' },
+    user_linked: { icon: 'userPlus', tone: 'sage' },
+    user_unlinked: { icon: 'x', tone: 'archived' },
 };
 
 // intentionally omits 'archived' to match the prototype — it falls back to TONE.neutral below.
diff --git a/packages/panel/resources/js/components/AddressFormFields.vue b/packages/panel/resources/js/components/AddressFormFields.vue
new file mode 100644
index 0000000000..8bfa188198
--- /dev/null
+++ b/packages/panel/resources/js/components/AddressFormFields.vue
@@ -0,0 +1,152 @@
+<script setup lang="ts">
+import { useI18n } from 'vue-i18n';
+import Checkbox from './Checkbox.vue';
+import FieldLabel from './FieldLabel.vue';
+import Select from './Select.vue';
+import Textarea from './Textarea.vue';
+import TextInput from './TextInput.vue';
+
+export interface AddressFormValues {
+    title: string;
+    first_name: string;
+    last_name: string;
+    company_name: string;
+    tax_identifier: string;
+    line_one: string;
+    line_two: string;
+    line_three: string;
+    city: string;
+    state: string;
+    postcode: string;
+    country_id: number | string;
+    delivery_instructions: string;
+    contact_email: string;
+    contact_phone: string;
+    shipping_default: boolean;
+    billing_default: boolean;
+}
+
+/** An Inertia useForm over the address fields — values and errors are read and written directly. */
+type AddressForm = AddressFormValues & {
+    errors: Partial<Record<keyof AddressFormValues, string>>;
+};
+
+const props = defineProps<{
+    form: AddressForm;
+    countries: { id: number; name: string }[];
+    /** Prefixes input ids so two address forms on one page keep unique label associations. */
+    idPrefix: string;
+}>();
+
+const { t } = useI18n();
+
+const fieldId = (name: string): string => `${props.idPrefix}-${name}`;
+</script>
+
+<template>
+    <div class="flex flex-col gap-3">
+        <div class="grid grid-cols-2 gap-3">
+            <div>
+                <FieldLabel :for="fieldId('first-name')" required>{{ t('customers.field_first_name') }}</FieldLabel>
+                <TextInput :id="fieldId('first-name')" v-model="form.first_name" :invalid="!!form.errors.first_name" />
+                <div v-if="form.errors.first_name" class="mt-1 text-[11px] text-danger">{{ form.errors.first_name }}</div>
+            </div>
+            <div>
+                <FieldLabel :for="fieldId('last-name')" required>{{ t('customers.field_last_name') }}</FieldLabel>
+                <TextInput :id="fieldId('last-name')" v-model="form.last_name" :invalid="!!form.errors.last_name" />
+                <div v-if="form.errors.last_name" class="mt-1 text-[11px] text-danger">{{ form.errors.last_name }}</div>
+            </div>
+        </div>
+        <div class="grid grid-cols-2 gap-3">
+            <div>
+                <FieldLabel :for="fieldId('title')">{{ t('customers.field_title') }}</FieldLabel>
+                <TextInput :id="fieldId('title')" v-model="form.title" :placeholder="t('common.optional')" :invalid="!!form.errors.title" />
+                <div v-if="form.errors.title" class="mt-1 text-[11px] text-danger">{{ form.errors.title }}</div>
+            </div>
+            <div>
+                <FieldLabel :for="fieldId('company-name')">{{ t('customers.field_company_name') }}</FieldLabel>
+                <TextInput :id="fieldId('company-name')" v-model="form.company_name" :invalid="!!form.errors.company_name" />
+                <div v-if="form.errors.company_name" class="mt-1 text-[11px] text-danger">{{ form.errors.company_name }}</div>
+            </div>
+        </div>
+        <div>
+            <FieldLabel :for="fieldId('tax-identifier')">{{ t('customers.field_tax_identifier') }}</FieldLabel>
+            <TextInput :id="fieldId('tax-identifier')" v-model="form.tax_identifier" mono :invalid="!!form.errors.tax_identifier" />
+            <div v-if="form.errors.tax_identifier" class="mt-1 text-[11px] text-danger">{{ form.errors.tax_identifier }}</div>
+        </div>
+        <div>
+            <FieldLabel :for="fieldId('line-one')" required>{{ t('customers.field_line_one') }}</FieldLabel>
+            <TextInput :id="fieldId('line-one')" v-model="form.line_one" :invalid="!!form.errors.line_one" />
+            <div v-if="form.errors.line_one" class="mt-1 text-[11px] text-danger">{{ form.errors.line_one }}</div>
+        </div>
+        <div>
+            <FieldLabel :for="fieldId('line-two')">{{ t('customers.field_line_two') }}</FieldLabel>
+            <TextInput :id="fieldId('line-two')" v-model="form.line_two" :invalid="!!form.errors.line_two" />
+            <div v-if="form.errors.line_two" class="mt-1 text-[11px] text-danger">{{ form.errors.line_two }}</div>
+        </div>
+        <div>
+            <FieldLabel :for="fieldId('line-three')">{{ t('customers.field_line_three') }}</FieldLabel>
+            <TextInput :id="fieldId('line-three')" v-model="form.line_three" :invalid="!!form.errors.line_three" />
+            <div v-if="form.errors.line_three" class="mt-1 text-[11px] text-danger">{{ form.errors.line_three }}</div>
+        </div>
+        <div class="grid grid-cols-2 gap-3">
+            <div>
+                <FieldLabel :for="fieldId('city')" required>{{ t('customers.field_city') }}</FieldLabel>
+                <TextInput :id="fieldId('city')" v-model="form.city" :invalid="!!form.errors.city" />
+                <div v-if="form.errors.city" class="mt-1 text-[11px] text-danger">{{ form.errors.city }}</div>
+            </div>
+            <div>
+                <FieldLabel :for="fieldId('state')">{{ t('customers.field_state') }}</FieldLabel>
+                <TextInput :id="fieldId('state')" v-model="form.state" :invalid="!!form.errors.state" />
+                <div v-if="form.errors.state" class="mt-1 text-[11px] text-danger">{{ form.errors.state }}</div>
+            </div>
+        </div>
+        <div class="grid grid-cols-2 gap-3">
+            <div>
+                <FieldLabel :for="fieldId('postcode')">{{ t('customers.field_postcode') }}</FieldLabel>
+                <TextInput :id="fieldId('postcode')" v-model="form.postcode" :invalid="!!form.errors.postcode" />
+                <div v-if="form.errors.postcode" class="mt-1 text-[11px] text-danger">{{ form.errors.postcode }}</div>
+            </div>
+            <div>
+                <FieldLabel :for="fieldId('country')" required>{{ t('customers.field_country') }}</FieldLabel>
+                <Select
+                    :id="fieldId('country')"
+                    :model-value="form.country_id"
+                    :invalid="!!form.errors.country_id"
+                    @update:model-value="(value) => (form.country_id = value ? Number(value) : '')"
+                >
+                    <option value="">{{ t('customers.select_country') }}</option>
+                    <option v-for="country in countries" :key="country.id" :value="country.id">{{ country.name }}</option>
+                </Select>
+                <div v-if="form.errors.country_id" class="mt-1 text-[11px] text-danger">{{ form.errors.country_id }}</div>
+            </div>
+        </div>
+        <div class="grid grid-cols-2 gap-3">
+            <div>
+                <FieldLabel :for="fieldId('contact-email')">{{ t('customers.field_contact_email') }}</FieldLabel>
+                <TextInput :id="fieldId('contact-email')" v-model="form.contact_email" type="email" :invalid="!!form.errors.contact_email" />
+                <div v-if="form.errors.contact_email" class="mt-1 text-[11px] text-danger">{{ form.errors.contact_email }}</div>
+            </div>
+            <div>
+                <FieldLabel :for="fieldId('contact-phone')">{{ t('customers.field_contact_phone') }}</FieldLabel>
+                <TextInput :id="fieldId('contact-phone')" v-model="form.contact_phone" type="tel" :invalid="!!form.errors.contact_phone" />
+                <div v-if="form.errors.contact_phone" class="mt-1 text-[11px] text-danger">{{ form.errors.contact_phone }}</div>
+            </div>
+        </div>
+        <div>
+            <FieldLabel :for="fieldId('delivery-instructions')">{{ t('customers.field_delivery_instructions') }}</FieldLabel>
+            <Textarea :id="fieldId('delivery-instructions')" v-model="form.delivery_instructions" :rows="2" :invalid="!!form.errors.delivery_instructions" />
+            <div v-if="form.errors.delivery_instructions" class="mt-1 text-[11px] text-danger">{{ form.errors.delivery_instructions }}</div>
+        </div>
+        <div class="flex gap-4">
+            <label class="inline-flex items-center gap-2 text-[12.5px] text-ink-700 select-none cursor-pointer">
+                <Checkbox v-model="form.shipping_default" />
+                {{ t('customers.default_shipping') }}
+            </label>
+            <label class="inline-flex items-center gap-2 text-[12.5px] text-ink-700 select-none cursor-pointer">
+                <Checkbox v-model="form.billing_default" />
+                {{ t('customers.default_billing') }}
+            </label>
+        </div>
+    </div>
+</template>
diff --git a/packages/panel/resources/js/components/FieldLabel.vue b/packages/panel/resources/js/components/FieldLabel.vue
index fb4b58bdba..53b1a3b921 100644
--- a/packages/panel/resources/js/components/FieldLabel.vue
+++ b/packages/panel/resources/js/components/FieldLabel.vue
@@ -1,11 +1,15 @@
 <script setup lang="ts">
-defineProps<{ required?: boolean; hint?: string }>();
+const props = defineProps<{ required?: boolean; hint?: string; for?: string }>();
 </script>
 
 <template>
-    <div class="flex items-center gap-1.5 text-xs font-medium text-ink-700 mb-1.5">
+    <component
+        :is="props.for ? 'label' : 'div'"
+        :for="props.for"
+        class="flex items-center gap-1.5 text-xs font-medium text-ink-700 mb-1.5"
+    >
         <slot />
         <span v-if="required" class="text-danger font-semibold">*</span>
         <span v-if="hint" class="ml-auto text-[11px] font-normal text-ink-400">{{ hint }}</span>
-    </div>
+    </component>
 </template>
diff --git a/packages/panel/resources/js/components/Select.vue b/packages/panel/resources/js/components/Select.vue
index c09bc70f29..b7e8664727 100644
--- a/packages/panel/resources/js/components/Select.vue
+++ b/packages/panel/resources/js/components/Select.vue
@@ -1,6 +1,9 @@
 <script setup lang="ts">
-defineProps<{
+import { computed } from 'vue';
+
+const props = defineProps<{
     modelValue?: string | number;
+    invalid?: boolean;
 }>();
 
 const emit = defineEmits<{
@@ -8,8 +11,12 @@ const emit = defineEmits<{
     change: [event: Event];
 }>();
 
-const cls =
-    'w-full h-8 px-2.5 pr-7 border border-line-strong rounded-md bg-surface text-[13px] text-ink-900 appearance-none bg-no-repeat transition-[border-color,box-shadow] duration-100 hover:border-ink-300 focus:outline-none focus:border-sage focus:ring-3 focus:ring-sage/35';
+const cls = computed(() => [
+    'w-full h-8 px-2.5 pr-7 border rounded-md bg-surface text-[13px] text-ink-900 appearance-none bg-no-repeat transition-[border-color,box-shadow] duration-100 hover:border-ink-300 focus:outline-none focus:ring-3',
+    props.invalid
+        ? 'border-danger focus:border-danger focus:ring-danger/25'
+        : 'border-line-strong focus:border-sage focus:ring-sage/35',
+]);
 const style =
     "background-image: url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>\"); background-position: right 10px center";
 
diff --git a/packages/panel/resources/js/pages/customers/Create.vue b/packages/panel/resources/js/pages/customers/Create.vue
index 098f3db233..f1cfd8c885 100644
--- a/packages/panel/resources/js/pages/customers/Create.vue
+++ b/packages/panel/resources/js/pages/customers/Create.vue
@@ -34,7 +34,15 @@ const form = useForm({
 
 const { t } = useI18n();
 
-const titleOptions = ['', 'Mr', 'Ms', 'Mrs', 'Mx', 'Dr'];
+// Stored values stay canonical; only the visible labels are translated.
+const titleOptions = computed(() => [
+    { value: '', label: '—' },
+    { value: 'Mr', label: t('customers.title_mr') },
+    { value: 'Ms', label: t('customers.title_ms') },
+    { value: 'Mrs', label: t('customers.title_mrs') },
+    { value: 'Mx', label: t('customers.title_mx') },
+    { value: 'Dr', label: t('customers.title_dr') },
+]);
 
 const groupName = (id: number): string => props.customerGroups.find((group) => group.id === id)?.name ?? String(id);
 
@@ -63,7 +71,11 @@ const submit = (): void => {
         <div data-screen-label="New customer" class="contents">
             <PageHeader :title="t('customers.new_title')">
                 <template #icon>
-                    <Link :href="urls.index" class="text-ink-500 hover:text-ink-900 shrink-0 self-center">
+                    <Link
+                        :href="urls.index"
+                        class="text-ink-500 hover:text-ink-900 shrink-0 self-center"
+                        :aria-label="t('customers.back_to_customers')"
+                    >
                         <Icon name="arrowLeft" />
                     </Link>
                 </template>
@@ -80,33 +92,36 @@ const submit = (): void => {
                     </div>
 
                     <div class="grid grid-cols-1 sm:grid-cols-12 gap-3">
-                        <label class="flex flex-col gap-1 sm:col-span-2">
-                            <FieldLabel class="mb-0">{{ t('customers.field_title') }}</FieldLabel>
-                            <Select v-model="form.title">
-                                <option v-for="option in titleOptions" :key="option || 'none'" :value="option">{{ option || '—' }}</option>
+                        <div class="flex flex-col gap-1 sm:col-span-2">
+                            <FieldLabel for="customer-title" class="mb-0">{{ t('customers.field_title') }}</FieldLabel>
+                            <Select id="customer-title" v-model="form.title">
+                                <option v-for="option in titleOptions" :key="option.value || 'none'" :value="option.value">{{ option.label }}</option>
                             </Select>
-                        </label>
+                        </div>
                         <div class="sm:col-span-5">
-                            <FieldLabel required>{{ t('customers.field_first_name') }}</FieldLabel>
-                            <TextInput v-model="form.first_name" :invalid="!!form.errors.first_name" />
+                            <FieldLabel for="customer-first-name" required>{{ t('customers.field_first_name') }}</FieldLabel>
+                            <TextInput id="customer-first-name" v-model="form.first_name" :invalid="!!form.errors.first_name" />
                             <div v-if="form.errors.first_name" class="mt-1 text-[11px] text-danger">{{ form.errors.first_name }}</div>
                         </div>
                         <div class="sm:col-span-5">
-                            <FieldLabel required>{{ t('customers.field_last_name') }}</FieldLabel>
-                            <TextInput v-model="form.last_name" :invalid="!!form.errors.last_name" />
+                            <FieldLabel for="customer-last-name" required>{{ t('customers.field_last_name') }}</FieldLabel>
+                            <TextInput id="customer-last-name" v-model="form.last_name" :invalid="!!form.errors.last_name" />
                             <div v-if="form.errors.last_name" class="mt-1 text-[11px] text-danger">{{ form.errors.last_name }}</div>
                         </div>
                         <div class="sm:col-span-12">
-                            <FieldLabel>{{ t('customers.field_company_name') }}</FieldLabel>
-                            <TextInput v-model="form.company_name" :placeholder="t('common.optional')" :invalid="!!form.errors.company_name" />
+                            <FieldLabel for="customer-company-name">{{ t('customers.field_company_name') }}</FieldLabel>
+                            <TextInput id="customer-company-name" v-model="form.company_name" :placeholder="t('common.optional')" :invalid="!!form.errors.company_name" />
+                            <div v-if="form.errors.company_name" class="mt-1 text-[11px] text-danger">{{ form.errors.company_name }}</div>
                         </div>
                         <div class="sm:col-span-6">
-                            <FieldLabel>{{ t('customers.field_tax_identifier') }}</FieldLabel>
-                            <TextInput v-model="form.tax_identifier" mono placeholder="GB000000000" :invalid="!!form.errors.tax_identifier" />
+                            <FieldLabel for="customer-tax-identifier">{{ t('customers.field_tax_identifier') }}</FieldLabel>
+                            <TextInput id="customer-tax-identifier" v-model="form.tax_identifier" mono placeholder="GB000000000" :invalid="!!form.errors.tax_identifier" />
+                            <div v-if="form.errors.tax_identifier" class="mt-1 text-[11px] text-danger">{{ form.errors.tax_identifier }}</div>
                         </div>
                         <div class="sm:col-span-6">
-                            <FieldLabel>{{ t('customers.field_account_ref') }}</FieldLabel>
-                            <TextInput v-model="form.account_ref" mono placeholder="ACC-00000" :invalid="!!form.errors.account_ref" />
+                            <FieldLabel for="customer-account-ref">{{ t('customers.field_account_ref') }}</FieldLabel>
+                            <TextInput id="customer-account-ref" v-model="form.account_ref" mono placeholder="ACC-00000" :invalid="!!form.errors.account_ref" />
+                            <div v-if="form.errors.account_ref" class="mt-1 text-[11px] text-danger">{{ form.errors.account_ref }}</div>
                         </div>
                     </div>
 
diff --git a/packages/panel/resources/js/pages/customers/Edit.vue b/packages/panel/resources/js/pages/customers/Edit.vue
index c049e3cdcb..f90fed4d94 100644
--- a/packages/panel/resources/js/pages/customers/Edit.vue
+++ b/packages/panel/resources/js/pages/customers/Edit.vue
@@ -4,8 +4,8 @@ import { router, useForm, usePage } from '@inertiajs/vue3';
 import { useI18n } from 'vue-i18n';
 import Button from '../../components/Button.vue';
 import AddressCard from '../../components/AddressCard.vue';
+import AddressFormFields from '../../components/AddressFormFields.vue';
 import ActivityTimeline from '../../components/ActivityTimeline.vue';
-import Checkbox from '../../components/Checkbox.vue';
 import Combobox from '../../components/Combobox.vue';
 import ConfirmDialog from '../../components/ConfirmDialog.vue';
 import FieldLabel from '../../components/FieldLabel.vue';
@@ -18,7 +18,6 @@ import Select from '../../components/Select.vue';
 import SideCard from '../../components/SideCard.vue';
 import StatusBadge from '../../components/StatusBadge.vue';
 import Tabs from '../../components/Tabs.vue';
-import Textarea from '../../components/Textarea.vue';
 import TextInput from '../../components/TextInput.vue';
 import PanelLayout from '../../layouts/PanelLayout.vue';
 
@@ -89,7 +88,7 @@ const props = defineProps<{
     };
 }>();
 
-const { t } = useI18n();
+const { t, te } = useI18n();
 
 const flashSuccess = computed(() => (usePage().props.flash as { success?: string } | undefined)?.success);
 
@@ -107,7 +106,27 @@ const detailsForm = useForm({
     customer_group_ids: props.customer.customer_groups.map((group) => group.id),
 });
 
-const titleOptions = ['', 'Mr', 'Ms', 'Mrs', 'Mx', 'Dr'];
+// Stored values stay canonical; only the visible labels are translated. A stored
+// title outside the base list (e.g. entered at checkout) is kept as its own option
+// so it still displays and survives a save untouched.
+const titleOptions = computed(() => {
+    const options = [
+        { value: '', label: '—' },
+        { value: 'Mr', label: t('customers.title_mr') },
+        { value: 'Ms', label: t('customers.title_ms') },
+        { value: 'Mrs', label: t('customers.title_mrs') },
+        { value: 'Mx', label: t('customers.title_mx') },
+        { value: 'Dr', label: t('customers.title_dr') },
+    ];
+
+    const stored = props.customer.title;
+
+    if (stored && !options.some((option) => option.value === stored)) {
+        options.splice(1, 0, { value: stored, label: stored });
+    }
+
+    return options;
+});
 
 const groupName = (id: number): string => props.customerGroups.find((group) => group.id === id)?.name ?? String(id);
 
@@ -169,6 +188,10 @@ const confirmDescription = computed(() => {
     }
 });
 
+// Unlinking is not a deletion — the confirm button says so.
+const confirmLabel = computed(() =>
+    confirmTarget.value?.kind === 'user' ? t('customers.unlink_user') : t('common.delete'));
+
 const confirmDestroy = (): void => {
     const target = confirmTarget.value;
 
@@ -326,6 +349,22 @@ const userInitials = (user: LinkedUser): string =>
         .join('')
         .toUpperCase();
 
+// Activity tab: activity descriptions are lang keys where one exists (spatie's
+// created/updated plus the customer action events); anything else shows as-is.
+const activityLabel = (description: string): string => {
+    const key = `customers.activity_${description.replaceAll('-', '_')}`;
+
+    return te(key) ? t(key) : description;
+};
+
+const timelineEvents = computed(() =>
+    props.activities.map((activity) => ({
+        type: activity.description.replaceAll('-', '_'),
+        label: activityLabel(activity.description),
+        when: new Date(activity.created_at).toLocaleString(),
+        actor: activity.causer_name ?? '',
+    })));
+
 // Tabs
 const activeTab = ref<'addresses' | 'users' | 'activity'>('addresses');
 const tabDefs = computed(() => [
@@ -373,33 +412,36 @@ const tabDefs = computed(() => [
                             <Section :title="t('customers.personal_details')">
                                 <template #desc>{{ t('customers.personal_details_desc') }}</template>
                                 <div class="grid grid-cols-1 sm:grid-cols-12 gap-3">
-                                    <label class="flex flex-col gap-1 sm:col-span-2">
-                                        <span class="text-[11.5px] text-ink-500">{{ t('customers.field_title') }}</span>
-                                        <Select v-model="detailsForm.title">
-                                            <option v-for="option in titleOptions" :key="option || 'none'" :value="option">{{ option || '—' }}</option>
+                                    <div class="flex flex-col gap-1 sm:col-span-2">
+                                        <FieldLabel for="customer-title" class="mb-0">{{ t('customers.field_title') }}</FieldLabel>
+                                        <Select id="customer-title" v-model="detailsForm.title">
+                                            <option v-for="option in titleOptions" :key="option.value || 'none'" :value="option.value">{{ option.label }}</option>
                                         </Select>
-                                    </label>
+                                    </div>
                                     <div class="sm:col-span-5">
-                                        <FieldLabel required>{{ t('customers.field_first_name') }}</FieldLabel>
-                                        <TextInput v-model="detailsForm.first_name" :invalid="!!detailsForm.errors.first_name" />
+                                        <FieldLabel for="customer-first-name" required>{{ t('customers.field_first_name') }}</FieldLabel>
+                                        <TextInput id="customer-first-name" v-model="detailsForm.first_name" :invalid="!!detailsForm.errors.first_name" />
                                         <div v-if="detailsForm.errors.first_name" class="mt-1 text-[11px] text-danger">{{ detailsForm.errors.first_name }}</div>
                                     </div>
                                     <div class="sm:col-span-5">
-                                        <FieldLabel required>{{ t('customers.field_last_name') }}</FieldLabel>
-                                        <TextInput v-model="detailsForm.last_name" :invalid="!!detailsForm.errors.last_name" />
+                                        <FieldLabel for="customer-last-name" required>{{ t('customers.field_last_name') }}</FieldLabel>
+                                        <TextInput id="customer-last-name" v-model="detailsForm.last_name" :invalid="!!detailsForm.errors.last_name" />
                                         <div v-if="detailsForm.errors.last_name" class="mt-1 text-[11px] text-danger">{{ detailsForm.errors.last_name }}</div>
                                     </div>
                                     <div class="sm:col-span-12">
-                                        <FieldLabel>{{ t('customers.field_company_name') }}</FieldLabel>
-                                        <TextInput v-model="detailsForm.company_name" :placeholder="t('common.optional')" :invalid="!!detailsForm.errors.company_name" />
+                                        <FieldLabel for="customer-company-name">{{ t('customers.field_company_name') }}</FieldLabel>
+                                        <TextInput id="customer-company-name" v-model="detailsForm.company_name" :placeholder="t('common.optional')" :invalid="!!detailsForm.errors.company_name" />
+                                        <div v-if="detailsForm.errors.company_name" class="mt-1 text-[11px] text-danger">{{ detailsForm.errors.company_name }}</div>
                                     </div>
                                     <div class="sm:col-span-6">
-                                        <FieldLabel>{{ t('customers.field_tax_identifier') }}</FieldLabel>
-                                        <TextInput v-model="detailsForm.tax_identifier" mono :invalid="!!detailsForm.errors.tax_identifier" />
+                                        <FieldLabel for="customer-tax-identifier">{{ t('customers.field_tax_identifier') }}</FieldLabel>
+                                        <TextInput id="customer-tax-identifier" v-model="detailsForm.tax_identifier" mono :invalid="!!detailsForm.errors.tax_identifier" />
+                                        <div v-if="detailsForm.errors.tax_identifier" class="mt-1 text-[11px] text-danger">{{ detailsForm.errors.tax_identifier }}</div>
                                     </div>
                                     <div class="sm:col-span-6">
-                                        <FieldLabel>{{ t('customers.field_account_ref') }}</FieldLabel>
-                                        <TextInput v-model="detailsForm.account_ref" mono :invalid="!!detailsForm.errors.account_ref" />
+                                        <FieldLabel for="customer-account-ref">{{ t('customers.field_account_ref') }}</FieldLabel>
+                                        <TextInput id="customer-account-ref" v-model="detailsForm.account_ref" mono :invalid="!!detailsForm.errors.account_ref" />
+                                        <div v-if="detailsForm.errors.account_ref" class="mt-1 text-[11px] text-danger">{{ detailsForm.errors.account_ref }}</div>
                                     </div>
                                 </div>
                             </Section>
@@ -457,62 +499,7 @@ const tabDefs = computed(() => [
                                                 class="bg-surface border border-line rounded-md p-3.5 flex flex-col gap-3"
                                                 @submit.prevent="submitEditAddress(address)"
                                             >
-                                                <div class="grid grid-cols-2 gap-3">
-                                                    <div>
-                                                        <FieldLabel required>{{ t('customers.field_first_name') }}</FieldLabel>
-                                                        <TextInput v-model="addressForm.first_name" />
-                                                    </div>
-                                                    <div>
-                                                        <FieldLabel required>{{ t('customers.field_last_name') }}</FieldLabel>
-                                                        <TextInput v-model="addressForm.last_name" />
-                                                    </div>
-                                                </div>
-                                                <div>
-                                                    <FieldLabel>{{ t('customers.field_company_name') }}</FieldLabel>
-                                                    <TextInput v-model="addressForm.company_name" />
-                                                </div>
-                                                <div>
-                                                    <FieldLabel required>{{ t('customers.field_line_one') }}</FieldLabel>
-                                                    <TextInput v-model="addressForm.line_one" />
-                                                </div>
-                                                <div>
-                                                    <FieldLabel>{{ t('customers.field_line_two') }}</FieldLabel>
-                                                    <TextInput v-model="addressForm.line_two" />
-                                                </div>
-                                                <div class="grid grid-cols-2 gap-3">
-                                                    <div>
-                                                        <FieldLabel required>{{ t('customers.field_city') }}</FieldLabel>
-                                                        <TextInput v-model="addressForm.city" />
-                                                    </div>
-                                                    <div>
-                                                        <FieldLabel>{{ t('customers.field_postcode') }}</FieldLabel>
-                                                        <TextInput v-model="addressForm.postcode" />
-                                                    </div>
-                                                </div>
-                                                <div>
-                                                    <FieldLabel required>{{ t('customers.field_country') }}</FieldLabel>
-                                                    <Select
-                                                        :model-value="addressForm.country_id"
-                                                        @update:model-value="(value) => (addressForm.country_id = value ? Number(value) : '')"
-                                                    >
-                                                        <option value="">{{ t('customers.select_country') }}</option>
-                                                        <option v-for="country in countries" :key="country.id" :value="country.id">{{ country.name }}</option>
-                                                    </Select>
-                                                </div>
-                                                <div>
-                                                    <FieldLabel>{{ t('customers.field_delivery_instructions') }}</FieldLabel>
-                                                    <Textarea v-model="addressForm.delivery_instructions" :rows="2" />
-                                                </div>
-                                                <div class="flex gap-4">
-                                                    <label class="inline-flex items-center gap-2 text-[12.5px] text-ink-700 select-none cursor-pointer">
-                                                        <Checkbox v-model="addressForm.shipping_default" />
-                                                        {{ t('customers.default_shipping') }}
-                                                    </label>
-                                                    <label class="inline-flex items-center gap-2 text-[12.5px] text-ink-700 select-none cursor-pointer">
-                                                        <Checkbox v-model="addressForm.billing_default" />
-                                                        {{ t('customers.default_billing') }}
-                                                    </label>
-                                                </div>
+                                                <AddressFormFields :form="addressForm" :countries="countries" id-prefix="edit-address" />
                                                 <div class="flex gap-2">
                                                     <Button type="submit" variant="primary" size="sm" :disabled="addressForm.processing">{{ t('customers.save_address') }}</Button>
                                                     <Button type="button" size="sm" @click="cancelEditAddress">{{ t('common.cancel') }}</Button>
@@ -538,63 +525,7 @@ const tabDefs = computed(() => [
                                     >
                                         <h3 class="text-[13px] font-semibold text-ink-900 mb-3">{{ t('customers.add_address') }}</h3>
                                         <div class="flex flex-col gap-3">
-                                            <div class="grid grid-cols-2 gap-3">
-                                                <div>
-                                                    <FieldLabel required>{{ t('customers.field_first_name') }}</FieldLabel>
-                                                    <TextInput v-model="newAddressForm.first_name" :invalid="!!newAddressForm.errors.first_name" />
-                                                </div>
-                                                <div>
-                                                    <FieldLabel required>{{ t('customers.field_last_name') }}</FieldLabel>
-                                                    <TextInput v-model="newAddressForm.last_name" :invalid="!!newAddressForm.errors.last_name" />
-                                                </div>
-                                            </div>
-                                            <div>
-                                                <FieldLabel>{{ t('customers.field_company_name') }}</FieldLabel>
-                                                <TextInput v-model="newAddressForm.company_name" />
-                                            </div>
-                                            <div>
-                                                <FieldLabel required>{{ t('customers.field_line_one') }}</FieldLabel>
-                                                <TextInput v-model="newAddressForm.line_one" :invalid="!!newAddressForm.errors.line_one" />
-                                            </div>
-                                            <div>
-                                                <FieldLabel>{{ t('customers.field_line_two') }}</FieldLabel>
-                                                <TextInput v-model="newAddressForm.line_two" />
-                                            </div>
-                                            <div class="grid grid-cols-2 gap-3">
-                                                <div>
-                                                    <FieldLabel required>{{ t('customers.field_city') }}</FieldLabel>
-                                                    <TextInput v-model="newAddressForm.city" :invalid="!!newAddressForm.errors.city" />
-                                                </div>
-                                                <div>
-                                                    <FieldLabel>{{ t('customers.field_postcode') }}</FieldLabel>
-                                                    <TextInput v-model="newAddressForm.postcode" />
-                                                </div>
-                                            </div>
-                                            <div>
-                                                <FieldLabel required>{{ t('customers.field_country') }}</FieldLabel>
-                                                <Select
-                                                    :model-value="newAddressForm.country_id"
-                                                    @update:model-value="(value) => (newAddressForm.country_id = value ? Number(value) : '')"
-                                                >
-                                                    <option value="">{{ t('customers.select_country') }}</option>
-                                                    <option v-for="country in countries" :key="country.id" :value="country.id">{{ country.name }}</option>
-                                                </Select>
-                                                <div v-if="newAddressForm.errors.country_id" class="mt-1 text-[11px] text-danger">{{ newAddressForm.errors.country_id }}</div>
-                                            </div>
-                                            <div>
-                                                <FieldLabel>{{ t('customers.field_delivery_instructions') }}</FieldLabel>
-                                                <Textarea v-model="newAddressForm.delivery_instructions" :rows="2" />
-                                            </div>
-                                            <div class="flex gap-4">
-                                                <label class="inline-flex items-center gap-2 text-[12.5px] text-ink-700 select-none cursor-pointer">
-                                                    <Checkbox v-model="newAddressForm.shipping_default" />
-                                                    {{ t('customers.default_shipping') }}
-                                                </label>
-                                                <label class="inline-flex items-center gap-2 text-[12.5px] text-ink-700 select-none cursor-pointer">
-                                                    <Checkbox v-model="newAddressForm.billing_default" />
-                                                    {{ t('customers.default_billing') }}
-                                                </label>
-                                            </div>
+                                            <AddressFormFields :form="newAddressForm" :countries="countries" id-prefix="new-address" />
                                             <div class="flex gap-2">
                                                 <Button type="submit" variant="primary" size="sm" :disabled="newAddressForm.processing">{{ t('customers.add_address') }}</Button>
                                                 <Button type="button" size="sm" @click="showNewAddressForm = false">{{ t('common.cancel') }}</Button>
@@ -637,8 +568,8 @@ const tabDefs = computed(() => [
 
                                     <form class="mt-3 flex items-end gap-2 rounded-md border border-dashed border-line-strong p-4" @submit.prevent="submitLinkUser">
                                         <div class="flex-1">
-                                            <FieldLabel>{{ t('customers.link_user_label') }}</FieldLabel>
-                                            <TextInput v-model="linkUserForm.email" type="email" :invalid="!!linkUserForm.errors.email" />
+                                            <FieldLabel for="link-user-email">{{ t('customers.link_user_label') }}</FieldLabel>
+                                            <TextInput id="link-user-email" v-model="linkUserForm.email" type="email" :invalid="!!linkUserForm.errors.email" />
                                             <div v-if="linkUserForm.errors.email" class="mt-1 text-[11px] text-danger">{{ linkUserForm.errors.email }}</div>
                                         </div>
                                         <Button type="submit" :disabled="linkUserForm.processing">{{ t('customers.link_user_button') }}</Button>
@@ -646,7 +577,7 @@ const tabDefs = computed(() => [
                                 </template>
 
                                 <template #activity>
-                                    <ActivityTimeline :events="activities" :reverse="false" />
+                                    <ActivityTimeline :events="timelineEvents" :reverse="false" />
                                     <PageEmpty v-if="!activities.length" :title="t('customers.activity_empty')" />
                                 </template>
                             </Tabs>
@@ -715,7 +646,7 @@ const tabDefs = computed(() => [
                 :title="confirmTitle"
                 :description="confirmDescription"
                 tone="danger"
-                :confirm-label="t('common.delete')"
+                :confirm-label="confirmLabel"
                 @confirm="confirmDestroy"
             />
         </div>
diff --git a/packages/panel/resources/js/pages/customers/Index.vue b/packages/panel/resources/js/pages/customers/Index.vue
index 2088339ce7..ccc9021546 100644
--- a/packages/panel/resources/js/pages/customers/Index.vue
+++ b/packages/panel/resources/js/pages/customers/Index.vue
@@ -34,6 +34,8 @@ interface CustomerGroupOption {
 interface CustomerRow {
     id: number;
     full_name: string;
+    first_name: string;
+    last_name: string;
     company_name: string | null;
     account_ref: string | null;
     created_at: string;
@@ -80,6 +82,7 @@ const props = defineProps<{
     tableFilterValues: Record<string, string>;
     customerGroups: CustomerGroupOption[];
     totalCount: number;
+    kpis: { total: number; newLast30Days: number; business: number; withAccount: number };
     filters: { q?: string; customer_group_id?: string | number; type?: string; sort?: string; direction?: string };
     urls: { index: string; create: string };
 }>();
@@ -177,26 +180,20 @@ const clearFilters = (): void => {
     reload();
 };
 
-// KPI strip: values are placeholders for now; the dismissed state persists locally.
+// KPI strip; the dismissed state persists locally.
 const KPI_STORAGE_KEY = 'lunar.panel.customers.kpisDismissed';
 const kpisDismissed = ref(localStorage.getItem(KPI_STORAGE_KEY) === '1');
 watch(kpisDismissed, (value) => localStorage.setItem(KPI_STORAGE_KEY, value ? '1' : '0'));
 
 const kpis = computed(() => [
-    { label: 'Total customers', value: props.totalCount, hint: 'across all groups', tone: 'neutral' as const, icon: 'users', delta: { value: '+12', tone: 'sage' as const } },
-    { label: 'New (30d)', value: 6, hint: 'joined in the last 30 days', tone: 'sage' as const, icon: 'userPlus', delta: { value: '+5', tone: 'sage' as const } },
-    { label: 'B2B accounts', value: 10, hint: 'customers with a company', tone: 'neutral' as const, icon: 'building', delta: { value: '+1', tone: 'sage' as const } },
-    { label: 'Avg lifetime value', value: '£3,575.00', hint: 'across customers with orders', tone: 'sage' as const, icon: 'chart', delta: { value: '+4%', tone: 'sage' as const } },
+    { label: t('customers.kpi_total_label'), value: props.kpis.total, hint: t('customers.kpi_total_hint'), tone: 'neutral' as const, icon: 'users' },
+    { label: t('customers.kpi_new_label'), value: props.kpis.newLast30Days, hint: t('customers.kpi_new_hint'), tone: 'sage' as const, icon: 'userPlus' },
+    { label: t('customers.kpi_business_label'), value: props.kpis.business, hint: t('customers.kpi_business_hint'), tone: 'neutral' as const, icon: 'building' },
+    { label: t('customers.kpi_with_account_label'), value: props.kpis.withAccount, hint: t('customers.kpi_with_account_hint'), tone: 'sage' as const, icon: 'user' },
 ]);
 
-const initials = (name: string): string =>
-    name
-        .split(' ')
-        .filter(Boolean)
-        .map((part) => part[0])
-        .slice(0, 2)
-        .join('')
-        .toUpperCase();
+const initials = (firstName: string, lastName: string): string =>
+    ((firstName?.[0] ?? '') + (lastName?.[0] ?? '')).toUpperCase() || '?';
 
 const formatDate = (value: string): string => new Date(value).toLocaleDateString();
 </script>
@@ -206,7 +203,9 @@ const formatDate = (value: string): string => new Date(value).toLocaleDateString
         <div data-screen-label="Customers" class="contents">
             <Breadcrumbs :items="breadcrumbs">
                 <template #actions>
-                    <Button icon="help"><span class="hidden sm:inline">{{ t('common.docs') }}</span></Button>
+                    <a href="https://docs.lunarphp.com/" target="_blank" rel="noopener">
+                        <Button icon="help"><span class="hidden sm:inline">{{ t('common.docs') }}</span></Button>
+                    </a>
                 </template>
             </Breadcrumbs>
 
@@ -216,7 +215,6 @@ const formatDate = (value: string): string => new Date(value).toLocaleDateString
                 icon="users"
             >
                 <template #actions>
-                    <Button icon="download">{{ t('common.export') }}</Button>
                     <Link :href="urls.create">
                         <Button variant="primary" icon="plus">{{ t('customers.add_customer') }}</Button>
                     </Link>
@@ -230,7 +228,7 @@ const formatDate = (value: string): string => new Date(value).toLocaleDateString
                     {{ flashSuccess }}
                 </div>
 
-                <!-- KPI strip (values are placeholders); dismissable, restored via "Show KPIs". -->
+                <!-- KPI strip; dismissable, restored via "Show KPIs". -->
                 <div v-if="!kpisDismissed" class="mb-5 relative">
                     <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3">
                         <KpiCard
@@ -241,7 +239,6 @@ const formatDate = (value: string): string => new Date(value).toLocaleDateString
                             :hint="kpi.hint"
                             :tone="kpi.tone"
                             :icon="kpi.icon"
-                            :delta="kpi.delta"
                         />
                     </div>
                     <button
@@ -280,7 +277,7 @@ const formatDate = (value: string): string => new Date(value).toLocaleDateString
                         <div class="flex-1" />
                         <span class="text-[11.5px] text-ink-500 whitespace-nowrap">{{ t('customers.count_of', { shown: customers.total, total: totalCount }) }}</span>
                         <Button v-if="kpisDismissed" icon="chart" @click="kpisDismissed = false">
-                            <span class="hidden sm:inline">Show KPIs</span>
+                            <span class="hidden sm:inline">{{ t('customers.show_kpis') }}</span>
                         </Button>
                         <Link :href="urls.create" class="sm:hidden">
                             <Button variant="primary" icon="plus">{{ t('common.new') }}</Button>
@@ -317,7 +314,7 @@ const formatDate = (value: string): string => new Date(value).toLocaleDateString
                     <template #cell-full_name="{ row }">
                         <div class="min-w-0 flex items-center gap-2.5">
                             <div class="w-7 h-7 rounded-full border border-line bg-surface-2 grid place-items-center text-ink-700 text-[10.5px] font-semibold shrink-0">
-                                {{ initials(row.full_name as string) }}
+                                {{ initials(row.first_name as string, row.last_name as string) }}
                             </div>
                             <div class="min-w-0">
                                 <div class="text-[12.5px] text-ink-900 truncate">{{ row.full_name }}</div>
diff --git a/packages/panel/resources/lang/ar/customers.php b/packages/panel/resources/lang/ar/customers.php
index c6393af27b..6f87f558ad 100644
--- a/packages/panel/resources/lang/ar/customers.php
+++ b/packages/panel/resources/lang/ar/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'لا يوجد عملاء يطابقون هذه الفلاتر',
     'empty_body' => 'جرّب مسح البحث أو الفلاتر لرؤية المزيد من العملاء.',
     'clear_filters' => 'مسح الفلاتر',
+    'show_kpis' => 'عرض مؤشرات الأداء',
+    'kpi_total_label' => 'إجمالي العملاء',
+    'kpi_total_hint' => 'عبر جميع المجموعات',
+    'kpi_new_label' => 'جدد (30 يومًا)',
+    'kpi_new_hint' => 'انضموا خلال آخر 30 يومًا',
+    'kpi_business_label' => 'حسابات B2B',
+    'kpi_business_hint' => 'عملاء لديهم شركة',
+    'kpi_with_account_label' => 'يمكنه تسجيل الدخول',
+    'kpi_with_account_hint' => 'مرتبطون بحساب مستخدم',
 
     'column_customer' => 'العميل',
     'column_company' => 'الشركة',
@@ -30,10 +39,16 @@
     'joined' => 'انضم في {date}',
     'delete_customer' => 'حذف العميل',
     'create_customer' => 'إنشاء عميل',
+    'back_to_customers' => 'العودة إلى العملاء',
 
     'personal_details' => 'البيانات الشخصية',
     'personal_details_desc' => 'الاسم، الشركة، ومعرّفات الحساب المستخدمة عبر الطلبات والفواتير.',
     'field_title' => 'اللقب',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'الاسم الأول',
     'field_last_name' => 'اسم العائلة',
     'field_company_name' => 'اسم الشركة',
@@ -53,11 +68,15 @@
     'add_address' => 'إضافة عنوان',
     'field_line_one' => 'العنوان - السطر الأول',
     'field_line_two' => 'العنوان - السطر الثاني',
+    'field_line_three' => 'العنوان - السطر الثالث',
     'field_city' => 'المدينة',
+    'field_state' => 'المنطقة / المحافظة',
     'field_postcode' => 'الرمز البريدي',
     'field_country' => 'الدولة',
     'select_country' => 'اختر دولة',
     'field_delivery_instructions' => 'تعليمات التوصيل',
+    'field_contact_email' => 'البريد الإلكتروني للتواصل',
+    'field_contact_phone' => 'هاتف التواصل',
     'default_shipping' => 'الشحن الافتراضي',
     'default_billing' => 'الفوترة الافتراضية',
     'save_address' => 'حفظ العنوان',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'لم يتم العثور على مستخدم بهذا البريد الإلكتروني.',
 
     'activity_empty' => 'لا يوجد نشاط مسجل بعد',
+    'activity_created' => 'تم إنشاء العميل',
+    'activity_updated' => 'تم تحديث العميل',
+    'activity_deleted' => 'تم حذف العميل',
+    'activity_address_created' => 'تمت إضافة العنوان',
+    'activity_address_updated' => 'تم تحديث العنوان',
+    'activity_address_deleted' => 'تم حذف العنوان',
+    'activity_user_linked' => 'تم ربط المستخدم',
+    'activity_user_unlinked' => 'تم إلغاء ربط المستخدم',
 
     'at_a_glance' => 'نظرة سريعة',
     'side_type' => 'النوع',
diff --git a/packages/panel/resources/lang/bg/customers.php b/packages/panel/resources/lang/bg/customers.php
index 361dcb00f5..9f3b888be4 100644
--- a/packages/panel/resources/lang/bg/customers.php
+++ b/packages/panel/resources/lang/bg/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'Няма клиенти, отговарящи на тези филтри',
     'empty_body' => 'Опитайте да изчистите търсенето или филтрите, за да видите повече клиенти.',
     'clear_filters' => 'Изчисти филтрите',
+    'show_kpis' => 'Покажи KPI',
+    'kpi_total_label' => 'Общо клиенти',
+    'kpi_total_hint' => 'във всички групи',
+    'kpi_new_label' => 'Нови (30 дни)',
+    'kpi_new_hint' => 'присъединили се през последните 30 дни',
+    'kpi_business_label' => 'B2B акаунти',
+    'kpi_business_hint' => 'клиенти с фирма',
+    'kpi_with_account_label' => 'Може да влиза',
+    'kpi_with_account_hint' => 'свързани с потребителски акаунт',
 
     'column_customer' => 'Клиент',
     'column_company' => 'Фирма',
@@ -30,10 +39,16 @@
     'joined' => 'Присъединил се на {date}',
     'delete_customer' => 'Изтрий клиент',
     'create_customer' => 'Създай клиент',
+    'back_to_customers' => 'Обратно към клиентите',
 
     'personal_details' => 'Лични данни',
     'personal_details_desc' => 'Име, фирма и идентификатори на акаунта, използвани в поръчки и фактури.',
     'field_title' => 'Обръщение',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'Име',
     'field_last_name' => 'Фамилия',
     'field_company_name' => 'Име на фирма',
@@ -53,11 +68,15 @@
     'add_address' => 'Добави адрес',
     'field_line_one' => 'Адрес, ред 1',
     'field_line_two' => 'Адрес, ред 2',
+    'field_line_three' => 'Адрес, ред 3',
     'field_city' => 'Град',
+    'field_state' => 'Област / регион',
     'field_postcode' => 'Пощенски код',
     'field_country' => 'Държава',
     'select_country' => 'Изберете държава',
     'field_delivery_instructions' => 'Инструкции за доставка',
+    'field_contact_email' => 'Имейл за контакт',
+    'field_contact_phone' => 'Телефон за контакт',
     'default_shipping' => 'По подразбиране за доставка',
     'default_billing' => 'По подразбиране за фактуриране',
     'save_address' => 'Запази адрес',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'Не е намерен потребител с този имейл адрес.',
 
     'activity_empty' => 'Все още няма записана активност',
+    'activity_created' => 'Клиентът е създаден',
+    'activity_updated' => 'Клиентът е актуализиран',
+    'activity_deleted' => 'Клиентът е изтрит',
+    'activity_address_created' => 'Адресът е добавен',
+    'activity_address_updated' => 'Адресът е актуализиран',
+    'activity_address_deleted' => 'Адресът е изтрит',
+    'activity_user_linked' => 'Потребителят е свързан',
+    'activity_user_unlinked' => 'Връзката с потребителя е премахната',
 
     'at_a_glance' => 'На пръв поглед',
     'side_type' => 'Тип',
diff --git a/packages/panel/resources/lang/de/customers.php b/packages/panel/resources/lang/de/customers.php
index 24eeb04f88..b6879ecf87 100644
--- a/packages/panel/resources/lang/de/customers.php
+++ b/packages/panel/resources/lang/de/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'Keine Kunden entsprechen diesen Filtern',
     'empty_body' => 'Entfernen Sie die Suche oder Filter, um mehr Kunden zu sehen.',
     'clear_filters' => 'Filter zurücksetzen',
+    'show_kpis' => 'KPIs anzeigen',
+    'kpi_total_label' => 'Kunden gesamt',
+    'kpi_total_hint' => 'über alle Gruppen',
+    'kpi_new_label' => 'Neu (30 T.)',
+    'kpi_new_hint' => 'in den letzten 30 Tagen beigetreten',
+    'kpi_business_label' => 'B2B-Konten',
+    'kpi_business_hint' => 'Kunden mit Firma',
+    'kpi_with_account_label' => 'Anmeldefähig',
+    'kpi_with_account_hint' => 'mit einem Benutzerkonto verknüpft',
 
     'column_customer' => 'Kunde',
     'column_company' => 'Firma',
@@ -30,10 +39,16 @@
     'joined' => 'Beigetreten am {date}',
     'delete_customer' => 'Kunde löschen',
     'create_customer' => 'Kunde erstellen',
+    'back_to_customers' => 'Zurück zu Kunden',
 
     'personal_details' => 'Persönliche Daten',
     'personal_details_desc' => 'Name, Firma und Kontokennungen, die in Bestellungen und Rechnungen verwendet werden.',
     'field_title' => 'Titel',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'Vorname',
     'field_last_name' => 'Nachname',
     'field_company_name' => 'Firmenname',
@@ -53,11 +68,15 @@
     'add_address' => 'Adresse hinzufügen',
     'field_line_one' => 'Adresszeile 1',
     'field_line_two' => 'Adresszeile 2',
+    'field_line_three' => 'Adresszeile 3',
     'field_city' => 'Stadt',
+    'field_state' => 'Bundesland / Region',
     'field_postcode' => 'Postleitzahl',
     'field_country' => 'Land',
     'select_country' => 'Land auswählen',
     'field_delivery_instructions' => 'Lieferhinweise',
+    'field_contact_email' => 'Kontakt-E-Mail',
+    'field_contact_phone' => 'Kontakttelefon',
     'default_shipping' => 'Standardversand',
     'default_billing' => 'Standardrechnung',
     'save_address' => 'Adresse speichern',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'Es wurde kein Benutzer mit dieser E-Mail-Adresse gefunden.',
 
     'activity_empty' => 'Noch keine Aktivität aufgezeichnet',
+    'activity_created' => 'Kunde erstellt',
+    'activity_updated' => 'Kunde aktualisiert',
+    'activity_deleted' => 'Kunde gelöscht',
+    'activity_address_created' => 'Adresse hinzugefügt',
+    'activity_address_updated' => 'Adresse aktualisiert',
+    'activity_address_deleted' => 'Adresse gelöscht',
+    'activity_user_linked' => 'Benutzer verknüpft',
+    'activity_user_unlinked' => 'Benutzer getrennt',
 
     'at_a_glance' => 'Auf einen Blick',
     'side_type' => 'Typ',
diff --git a/packages/panel/resources/lang/en/customers.php b/packages/panel/resources/lang/en/customers.php
index 97ca47eb16..ea046061eb 100644
--- a/packages/panel/resources/lang/en/customers.php
+++ b/packages/panel/resources/lang/en/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'No customers match these filters',
     'empty_body' => 'Try clearing the search or filters to see more customers.',
     'clear_filters' => 'Clear filters',
+    'show_kpis' => 'Show KPIs',
+    'kpi_total_label' => 'Total customers',
+    'kpi_total_hint' => 'across all groups',
+    'kpi_new_label' => 'New (30d)',
+    'kpi_new_hint' => 'joined in the last 30 days',
+    'kpi_business_label' => 'B2B accounts',
+    'kpi_business_hint' => 'customers with a company',
+    'kpi_with_account_label' => 'Can sign in',
+    'kpi_with_account_hint' => 'linked to a user account',
 
     'column_customer' => 'Customer',
     'column_company' => 'Company',
@@ -30,10 +39,16 @@
     'joined' => 'Joined {date}',
     'delete_customer' => 'Delete customer',
     'create_customer' => 'Create customer',
+    'back_to_customers' => 'Back to customers',
 
     'personal_details' => 'Personal details',
     'personal_details_desc' => 'Name, company, and account identifiers used across orders and invoices.',
     'field_title' => 'Title',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'First name',
     'field_last_name' => 'Last name',
     'field_company_name' => 'Company name',
@@ -53,11 +68,15 @@
     'add_address' => 'Add address',
     'field_line_one' => 'Address line 1',
     'field_line_two' => 'Address line 2',
+    'field_line_three' => 'Address line 3',
     'field_city' => 'City',
+    'field_state' => 'State / county',
     'field_postcode' => 'Postcode',
     'field_country' => 'Country',
     'select_country' => 'Select a country',
     'field_delivery_instructions' => 'Delivery instructions',
+    'field_contact_email' => 'Contact email',
+    'field_contact_phone' => 'Contact phone',
     'default_shipping' => 'Default shipping',
     'default_billing' => 'Default billing',
     'save_address' => 'Save address',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'No user was found with that email address.',
 
     'activity_empty' => 'No activity recorded yet',
+    'activity_created' => 'Customer created',
+    'activity_updated' => 'Customer updated',
+    'activity_deleted' => 'Customer deleted',
+    'activity_address_created' => 'Address added',
+    'activity_address_updated' => 'Address updated',
+    'activity_address_deleted' => 'Address deleted',
+    'activity_user_linked' => 'User linked',
+    'activity_user_unlinked' => 'User unlinked',
 
     'at_a_glance' => 'At a glance',
     'side_type' => 'Type',
diff --git a/packages/panel/resources/lang/es/customers.php b/packages/panel/resources/lang/es/customers.php
index c202797445..adb893fb2b 100644
--- a/packages/panel/resources/lang/es/customers.php
+++ b/packages/panel/resources/lang/es/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'Ningún cliente coincide con estos filtros',
     'empty_body' => 'Prueba a borrar la búsqueda o los filtros para ver más clientes.',
     'clear_filters' => 'Borrar filtros',
+    'show_kpis' => 'Mostrar KPIs',
+    'kpi_total_label' => 'Total de clientes',
+    'kpi_total_hint' => 'en todos los grupos',
+    'kpi_new_label' => 'Nuevos (30 d)',
+    'kpi_new_hint' => 'registrados en los últimos 30 días',
+    'kpi_business_label' => 'Cuentas B2B',
+    'kpi_business_hint' => 'clientes con empresa',
+    'kpi_with_account_label' => 'Puede iniciar sesión',
+    'kpi_with_account_hint' => 'vinculados a una cuenta de usuario',
 
     'column_customer' => 'Cliente',
     'column_company' => 'Empresa',
@@ -30,10 +39,16 @@
     'joined' => 'Se unió el {date}',
     'delete_customer' => 'Eliminar cliente',
     'create_customer' => 'Crear cliente',
+    'back_to_customers' => 'Volver a clientes',
 
     'personal_details' => 'Datos personales',
     'personal_details_desc' => 'Nombre, empresa e identificadores de cuenta utilizados en pedidos y facturas.',
     'field_title' => 'Título',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'Nombre',
     'field_last_name' => 'Apellidos',
     'field_company_name' => 'Nombre de la empresa',
@@ -53,11 +68,15 @@
     'add_address' => 'Añadir dirección',
     'field_line_one' => 'Dirección línea 1',
     'field_line_two' => 'Dirección línea 2',
+    'field_line_three' => 'Dirección línea 3',
     'field_city' => 'Ciudad',
+    'field_state' => 'Estado / provincia',
     'field_postcode' => 'Código postal',
     'field_country' => 'País',
     'select_country' => 'Selecciona un país',
     'field_delivery_instructions' => 'Instrucciones de entrega',
+    'field_contact_email' => 'Correo de contacto',
+    'field_contact_phone' => 'Teléfono de contacto',
     'default_shipping' => 'Envío predeterminado',
     'default_billing' => 'Facturación predeterminada',
     'save_address' => 'Guardar dirección',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'No se ha encontrado ningún usuario con esa dirección de correo electrónico.',
 
     'activity_empty' => 'Aún no hay actividad registrada',
+    'activity_created' => 'Cliente creado',
+    'activity_updated' => 'Cliente actualizado',
+    'activity_deleted' => 'Cliente eliminado',
+    'activity_address_created' => 'Dirección añadida',
+    'activity_address_updated' => 'Dirección actualizada',
+    'activity_address_deleted' => 'Dirección eliminada',
+    'activity_user_linked' => 'Usuario vinculado',
+    'activity_user_unlinked' => 'Usuario desvinculado',
 
     'at_a_glance' => 'De un vistazo',
     'side_type' => 'Tipo',
diff --git a/packages/panel/resources/lang/fa/customers.php b/packages/panel/resources/lang/fa/customers.php
index f6864addbc..322d45ab3b 100644
--- a/packages/panel/resources/lang/fa/customers.php
+++ b/packages/panel/resources/lang/fa/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'هیچ مشتری‌ای با این فیلترها مطابقت ندارد',
     'empty_body' => 'برای مشاهده مشتریان بیشتر، جستجو یا فیلترها را پاک کنید.',
     'clear_filters' => 'پاک کردن فیلترها',
+    'show_kpis' => 'نمایش شاخص‌ها',
+    'kpi_total_label' => 'کل مشتریان',
+    'kpi_total_hint' => 'در همه گروه‌ها',
+    'kpi_new_label' => 'جدید (۳۰ روز)',
+    'kpi_new_hint' => 'در ۳۰ روز گذشته پیوسته‌اند',
+    'kpi_business_label' => 'حساب‌های B2B',
+    'kpi_business_hint' => 'مشتریان دارای شرکت',
+    'kpi_with_account_label' => 'امکان ورود',
+    'kpi_with_account_hint' => 'متصل به حساب کاربری',
 
     'column_customer' => 'مشتری',
     'column_company' => 'شرکت',
@@ -30,10 +39,16 @@
     'joined' => 'عضویت در {date}',
     'delete_customer' => 'حذف مشتری',
     'create_customer' => 'ایجاد مشتری',
+    'back_to_customers' => 'بازگشت به مشتریان',
 
     'personal_details' => 'اطلاعات شخصی',
     'personal_details_desc' => 'نام، شرکت و شناسه‌های حساب که در سفارش‌ها و فاکتورها استفاده می‌شوند.',
     'field_title' => 'عنوان',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'نام',
     'field_last_name' => 'نام خانوادگی',
     'field_company_name' => 'نام شرکت',
@@ -53,11 +68,15 @@
     'add_address' => 'افزودن آدرس',
     'field_line_one' => 'خط آدرس ۱',
     'field_line_two' => 'خط آدرس ۲',
+    'field_line_three' => 'خط آدرس ۳',
     'field_city' => 'شهر',
+    'field_state' => 'استان / منطقه',
     'field_postcode' => 'کد پستی',
     'field_country' => 'کشور',
     'select_country' => 'یک کشور انتخاب کنید',
     'field_delivery_instructions' => 'دستورالعمل‌های تحویل',
+    'field_contact_email' => 'ایمیل تماس',
+    'field_contact_phone' => 'تلفن تماس',
     'default_shipping' => 'ارسال پیش‌فرض',
     'default_billing' => 'صورت‌حساب پیش‌فرض',
     'save_address' => 'ذخیره آدرس',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'کاربری با این آدرس ایمیل یافت نشد.',
 
     'activity_empty' => 'هنوز فعالیتی ثبت نشده است',
+    'activity_created' => 'مشتری ایجاد شد',
+    'activity_updated' => 'مشتری به‌روزرسانی شد',
+    'activity_deleted' => 'مشتری حذف شد',
+    'activity_address_created' => 'آدرس افزوده شد',
+    'activity_address_updated' => 'آدرس به‌روزرسانی شد',
+    'activity_address_deleted' => 'آدرس حذف شد',
+    'activity_user_linked' => 'کاربر پیوند داده شد',
+    'activity_user_unlinked' => 'پیوند کاربر قطع شد',
 
     'at_a_glance' => 'نمای کلی',
     'side_type' => 'نوع',
diff --git a/packages/panel/resources/lang/fr/customers.php b/packages/panel/resources/lang/fr/customers.php
index 253202be86..57ec8d7482 100644
--- a/packages/panel/resources/lang/fr/customers.php
+++ b/packages/panel/resources/lang/fr/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'Aucun client ne correspond à ces filtres',
     'empty_body' => 'Essayez de supprimer la recherche ou les filtres pour voir plus de clients.',
     'clear_filters' => 'Effacer les filtres',
+    'show_kpis' => 'Afficher les KPI',
+    'kpi_total_label' => 'Total clients',
+    'kpi_total_hint' => 'tous groupes confondus',
+    'kpi_new_label' => 'Nouveaux (30 j)',
+    'kpi_new_hint' => 'inscrits au cours des 30 derniers jours',
+    'kpi_business_label' => 'Comptes B2B',
+    'kpi_business_hint' => 'clients avec une société',
+    'kpi_with_account_label' => 'Peut se connecter',
+    'kpi_with_account_hint' => 'liés à un compte utilisateur',
 
     'column_customer' => 'Client',
     'column_company' => 'Société',
@@ -30,10 +39,16 @@
     'joined' => 'Inscrit le {date}',
     'delete_customer' => 'Supprimer le client',
     'create_customer' => 'Créer le client',
+    'back_to_customers' => 'Retour aux clients',
 
     'personal_details' => 'Informations personnelles',
     'personal_details_desc' => 'Nom, société et identifiants de compte utilisés dans les commandes et les factures.',
     'field_title' => 'Civilité',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'Prénom',
     'field_last_name' => 'Nom de famille',
     'field_company_name' => 'Nom de la société',
@@ -53,11 +68,15 @@
     'add_address' => 'Ajouter une adresse',
     'field_line_one' => 'Adresse ligne 1',
     'field_line_two' => 'Adresse ligne 2',
+    'field_line_three' => 'Adresse ligne 3',
     'field_city' => 'Ville',
+    'field_state' => 'État / région',
     'field_postcode' => 'Code postal',
     'field_country' => 'Pays',
     'select_country' => 'Sélectionnez un pays',
     'field_delivery_instructions' => 'Instructions de livraison',
+    'field_contact_email' => 'E-mail de contact',
+    'field_contact_phone' => 'Téléphone de contact',
     'default_shipping' => 'Livraison par défaut',
     'default_billing' => 'Facturation par défaut',
     'save_address' => "Enregistrer l'adresse",
@@ -76,6 +95,14 @@
     'link_user_not_found' => "Aucun utilisateur n'a été trouvé avec cette adresse e-mail.",
 
     'activity_empty' => 'Aucune activité enregistrée pour le moment',
+    'activity_created' => 'Client créé',
+    'activity_updated' => 'Client mis à jour',
+    'activity_deleted' => 'Client supprimé',
+    'activity_address_created' => 'Adresse ajoutée',
+    'activity_address_updated' => 'Adresse mise à jour',
+    'activity_address_deleted' => 'Adresse supprimée',
+    'activity_user_linked' => 'Utilisateur associé',
+    'activity_user_unlinked' => 'Utilisateur dissocié',
 
     'at_a_glance' => "En un coup d'œil",
     'side_type' => 'Type',
diff --git a/packages/panel/resources/lang/hr/customers.php b/packages/panel/resources/lang/hr/customers.php
index 8e940ed45c..3d5d88ca1c 100644
--- a/packages/panel/resources/lang/hr/customers.php
+++ b/packages/panel/resources/lang/hr/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'Nijedan kupac ne odgovara ovim filtrima',
     'empty_body' => 'Pokušajte očistiti pretragu ili filtre kako biste vidjeli više kupaca.',
     'clear_filters' => 'Očisti filtre',
+    'show_kpis' => 'Prikaži KPI',
+    'kpi_total_label' => 'Ukupno kupaca',
+    'kpi_total_hint' => 'u svim grupama',
+    'kpi_new_label' => 'Novi (30 d)',
+    'kpi_new_hint' => 'pridružili se u zadnjih 30 dana',
+    'kpi_business_label' => 'B2B računi',
+    'kpi_business_hint' => 'kupci s tvrtkom',
+    'kpi_with_account_label' => 'Može se prijaviti',
+    'kpi_with_account_hint' => 'povezani s korisničkim računom',
 
     'column_customer' => 'Kupac',
     'column_company' => 'Tvrtka',
@@ -30,10 +39,16 @@
     'joined' => 'Pridružio se {date}',
     'delete_customer' => 'Izbriši kupca',
     'create_customer' => 'Kreiraj kupca',
+    'back_to_customers' => 'Natrag na kupce',
 
     'personal_details' => 'Osobni podaci',
     'personal_details_desc' => 'Ime, tvrtka i identifikatori računa koji se koriste u narudžbama i računima.',
     'field_title' => 'Titula',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'Ime',
     'field_last_name' => 'Prezime',
     'field_company_name' => 'Naziv tvrtke',
@@ -53,11 +68,15 @@
     'add_address' => 'Dodaj adresu',
     'field_line_one' => 'Adresa, redak 1',
     'field_line_two' => 'Adresa, redak 2',
+    'field_line_three' => 'Adresa, redak 3',
     'field_city' => 'Grad',
+    'field_state' => 'Županija / regija',
     'field_postcode' => 'Poštanski broj',
     'field_country' => 'Država',
     'select_country' => 'Odaberite državu',
     'field_delivery_instructions' => 'Upute za dostavu',
+    'field_contact_email' => 'Kontakt e-pošta',
+    'field_contact_phone' => 'Kontakt telefon',
     'default_shipping' => 'Zadana dostava',
     'default_billing' => 'Zadana naplata',
     'save_address' => 'Spremi adresu',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'Nije pronađen korisnik s tom e-poštom.',
 
     'activity_empty' => 'Još nema zabilježene aktivnosti',
+    'activity_created' => 'Kupac je kreiran',
+    'activity_updated' => 'Kupac je ažuriran',
+    'activity_deleted' => 'Kupac je izbrisan',
+    'activity_address_created' => 'Adresa je dodana',
+    'activity_address_updated' => 'Adresa je ažurirana',
+    'activity_address_deleted' => 'Adresa je izbrisana',
+    'activity_user_linked' => 'Korisnik je povezan',
+    'activity_user_unlinked' => 'Korisnik je odspojen',
 
     'at_a_glance' => 'Pregled',
     'side_type' => 'Vrsta',
diff --git a/packages/panel/resources/lang/hu/customers.php b/packages/panel/resources/lang/hu/customers.php
index e956b2edf2..296c4df511 100644
--- a/packages/panel/resources/lang/hu/customers.php
+++ b/packages/panel/resources/lang/hu/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'Nincs a szűrőknek megfelelő ügyfél',
     'empty_body' => 'Próbálja törölni a keresést vagy a szűrőket, hogy több ügyfelet lásson.',
     'clear_filters' => 'Szűrők törlése',
+    'show_kpis' => 'KPI-k megjelenítése',
+    'kpi_total_label' => 'Összes ügyfél',
+    'kpi_total_hint' => 'az összes csoportban',
+    'kpi_new_label' => 'Új (30 nap)',
+    'kpi_new_hint' => 'az elmúlt 30 napban csatlakozott',
+    'kpi_business_label' => 'B2B fiókok',
+    'kpi_business_hint' => 'céggel rendelkező ügyfelek',
+    'kpi_with_account_label' => 'Bejelentkezhet',
+    'kpi_with_account_hint' => 'felhasználói fiókhoz kapcsolva',
 
     'column_customer' => 'Ügyfél',
     'column_company' => 'Cég',
@@ -30,10 +39,16 @@
     'joined' => 'Csatlakozott: {date}',
     'delete_customer' => 'Ügyfél törlése',
     'create_customer' => 'Ügyfél létrehozása',
+    'back_to_customers' => 'Vissza az ügyfelekhez',
 
     'personal_details' => 'Személyes adatok',
     'personal_details_desc' => 'Név, cég és fiókazonosítók, amelyeket a rendelések és számlák során használnak.',
     'field_title' => 'Titulus',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'Keresztnév',
     'field_last_name' => 'Vezetéknév',
     'field_company_name' => 'Cégnév',
@@ -53,11 +68,15 @@
     'add_address' => 'Cím hozzáadása',
     'field_line_one' => 'Cím 1. sor',
     'field_line_two' => 'Cím 2. sor',
+    'field_line_three' => 'Cím 3. sor',
     'field_city' => 'Város',
+    'field_state' => 'Megye / régió',
     'field_postcode' => 'Irányítószám',
     'field_country' => 'Ország',
     'select_country' => 'Válasszon országot',
     'field_delivery_instructions' => 'Szállítási utasítások',
+    'field_contact_email' => 'Kapcsolattartó e-mail',
+    'field_contact_phone' => 'Kapcsolattartó telefon',
     'default_shipping' => 'Alapértelmezett szállítási cím',
     'default_billing' => 'Alapértelmezett számlázási cím',
     'save_address' => 'Cím mentése',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'Nem található felhasználó ezzel az e-mail címmel.',
 
     'activity_empty' => 'Még nincs rögzített tevékenység',
+    'activity_created' => 'Az ügyfél létrehozva',
+    'activity_updated' => 'Az ügyfél frissítve',
+    'activity_deleted' => 'Az ügyfél törölve',
+    'activity_address_created' => 'A cím hozzáadva',
+    'activity_address_updated' => 'A cím frissítve',
+    'activity_address_deleted' => 'A cím törölve',
+    'activity_user_linked' => 'A felhasználó összekapcsolva',
+    'activity_user_unlinked' => 'A felhasználó leválasztva',
 
     'at_a_glance' => 'Áttekintés',
     'side_type' => 'Típus',
diff --git a/packages/panel/resources/lang/mn/customers.php b/packages/panel/resources/lang/mn/customers.php
index 4c07d6e7a9..2d4db4c79e 100644
--- a/packages/panel/resources/lang/mn/customers.php
+++ b/packages/panel/resources/lang/mn/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'Эдгээр шүүлтүүрт тохирох харилцагч алга',
     'empty_body' => 'Илүү олон харилцагч харахын тулд хайлт эсвэл шүүлтүүрийг арилгаж үзнэ үү.',
     'clear_filters' => 'Шүүлтүүр арилгах',
+    'show_kpis' => 'KPI харуулах',
+    'kpi_total_label' => 'Нийт харилцагч',
+    'kpi_total_hint' => 'бүх бүлгээр',
+    'kpi_new_label' => 'Шинэ (30 хоног)',
+    'kpi_new_hint' => 'сүүлийн 30 хоногт нэгдсэн',
+    'kpi_business_label' => 'B2B данс',
+    'kpi_business_hint' => 'компанитай харилцагчид',
+    'kpi_with_account_label' => 'Нэвтрэх боломжтой',
+    'kpi_with_account_hint' => 'хэрэглэгчийн данстай холбогдсон',
 
     'column_customer' => 'Харилцагч',
     'column_company' => 'Компани',
@@ -30,10 +39,16 @@
     'joined' => '{date}-нд элссэн',
     'delete_customer' => 'Харилцагчийг устгах',
     'create_customer' => 'Харилцагч үүсгэх',
+    'back_to_customers' => 'Харилцагчид руу буцах',
 
     'personal_details' => 'Хувийн мэдээлэл',
     'personal_details_desc' => 'Захиалга болон нэхэмжлэхэд ашиглагддаг нэр, компани, бүртгэлийн танигчид.',
     'field_title' => 'Цол',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'Нэр',
     'field_last_name' => 'Овог',
     'field_company_name' => 'Компанийн нэр',
@@ -53,11 +68,15 @@
     'add_address' => 'Хаяг нэмэх',
     'field_line_one' => 'Хаягийн 1-р мөр',
     'field_line_two' => 'Хаягийн 2-р мөр',
+    'field_line_three' => 'Хаягийн 3-р мөр',
     'field_city' => 'Хот',
+    'field_state' => 'Аймаг / бүс',
     'field_postcode' => 'Шуудангийн код',
     'field_country' => 'Улс',
     'select_country' => 'Улс сонгоно уу',
     'field_delivery_instructions' => 'Хүргэлтийн заавар',
+    'field_contact_email' => 'Холбоо барих имэйл',
+    'field_contact_phone' => 'Холбоо барих утас',
     'default_shipping' => 'Үндсэн хүргэлтийн хаяг',
     'default_billing' => 'Үндсэн нэхэмжлэхийн хаяг',
     'save_address' => 'Хаяг хадгалах',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'Энэ и-мэйл хаягтай хэрэглэгч олдсонгүй.',
 
     'activity_empty' => 'Одоогоор бүртгэгдсэн үйл ажиллагаа алга',
+    'activity_created' => 'Харилцагч үүсгэгдлээ',
+    'activity_updated' => 'Харилцагч шинэчлэгдлээ',
+    'activity_deleted' => 'Харилцагч устгагдлаа',
+    'activity_address_created' => 'Хаяг нэмэгдлээ',
+    'activity_address_updated' => 'Хаяг шинэчлэгдлээ',
+    'activity_address_deleted' => 'Хаяг устгагдлаа',
+    'activity_user_linked' => 'Хэрэглэгч холбогдлоо',
+    'activity_user_unlinked' => 'Хэрэглэгчийн холбоос тасаллаа',
 
     'at_a_glance' => 'Ерөнхий тойм',
     'side_type' => 'Төрөл',
diff --git a/packages/panel/resources/lang/nl/customers.php b/packages/panel/resources/lang/nl/customers.php
index 71cdec5ffe..c67cad5fe8 100644
--- a/packages/panel/resources/lang/nl/customers.php
+++ b/packages/panel/resources/lang/nl/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'Geen klanten komen overeen met deze filters',
     'empty_body' => 'Wis de zoekopdracht of filters om meer klanten te zien.',
     'clear_filters' => 'Filters wissen',
+    'show_kpis' => 'KPI\'s tonen',
+    'kpi_total_label' => 'Totaal klanten',
+    'kpi_total_hint' => 'over alle groepen',
+    'kpi_new_label' => 'Nieuw (30 d)',
+    'kpi_new_hint' => 'aangesloten in de laatste 30 dagen',
+    'kpi_business_label' => 'B2B-accounts',
+    'kpi_business_hint' => 'klanten met een bedrijf',
+    'kpi_with_account_label' => 'Kan inloggen',
+    'kpi_with_account_hint' => 'gekoppeld aan een gebruikersaccount',
 
     'column_customer' => 'Klant',
     'column_company' => 'Bedrijf',
@@ -30,10 +39,16 @@
     'joined' => 'Lid geworden op {date}',
     'delete_customer' => 'Klant verwijderen',
     'create_customer' => 'Klant aanmaken',
+    'back_to_customers' => 'Terug naar klanten',
 
     'personal_details' => 'Persoonlijke gegevens',
     'personal_details_desc' => 'Naam, bedrijf en accountidentificatoren die worden gebruikt bij bestellingen en facturen.',
     'field_title' => 'Titel',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'Voornaam',
     'field_last_name' => 'Achternaam',
     'field_company_name' => 'Bedrijfsnaam',
@@ -53,11 +68,15 @@
     'add_address' => 'Adres toevoegen',
     'field_line_one' => 'Adresregel 1',
     'field_line_two' => 'Adresregel 2',
+    'field_line_three' => 'Adresregel 3',
     'field_city' => 'Plaats',
+    'field_state' => 'Provincie / regio',
     'field_postcode' => 'Postcode',
     'field_country' => 'Land',
     'select_country' => 'Selecteer een land',
     'field_delivery_instructions' => 'Bezorginstructies',
+    'field_contact_email' => 'Contact-e-mail',
+    'field_contact_phone' => 'Contacttelefoon',
     'default_shipping' => 'Standaard verzendadres',
     'default_billing' => 'Standaard factuuradres',
     'save_address' => 'Adres opslaan',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'Er is geen gebruiker gevonden met dat e-mailadres.',
 
     'activity_empty' => 'Nog geen activiteit geregistreerd',
+    'activity_created' => 'Klant aangemaakt',
+    'activity_updated' => 'Klant bijgewerkt',
+    'activity_deleted' => 'Klant verwijderd',
+    'activity_address_created' => 'Adres toegevoegd',
+    'activity_address_updated' => 'Adres bijgewerkt',
+    'activity_address_deleted' => 'Adres verwijderd',
+    'activity_user_linked' => 'Gebruiker gekoppeld',
+    'activity_user_unlinked' => 'Gebruiker ontkoppeld',
 
     'at_a_glance' => 'In één oogopslag',
     'side_type' => 'Type',
diff --git a/packages/panel/resources/lang/pl/customers.php b/packages/panel/resources/lang/pl/customers.php
index 5221b44e06..c4b0c55a2e 100644
--- a/packages/panel/resources/lang/pl/customers.php
+++ b/packages/panel/resources/lang/pl/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'Żaden klient nie pasuje do tych filtrów',
     'empty_body' => 'Wyczyść wyszukiwanie lub filtry, aby zobaczyć więcej klientów.',
     'clear_filters' => 'Wyczyść filtry',
+    'show_kpis' => 'Pokaż KPI',
+    'kpi_total_label' => 'Łącznie klientów',
+    'kpi_total_hint' => 'we wszystkich grupach',
+    'kpi_new_label' => 'Nowi (30 dni)',
+    'kpi_new_hint' => 'dołączyli w ciągu ostatnich 30 dni',
+    'kpi_business_label' => 'Konta B2B',
+    'kpi_business_hint' => 'klienci z firmą',
+    'kpi_with_account_label' => 'Może się logować',
+    'kpi_with_account_hint' => 'powiązani z kontem użytkownika',
 
     'column_customer' => 'Klient',
     'column_company' => 'Firma',
@@ -30,10 +39,16 @@
     'joined' => 'Dołączono {date}',
     'delete_customer' => 'Usuń klienta',
     'create_customer' => 'Utwórz klienta',
+    'back_to_customers' => 'Powrót do klientów',
 
     'personal_details' => 'Dane osobowe',
     'personal_details_desc' => 'Nazwa, firma i identyfikatory konta używane w zamówieniach i fakturach.',
     'field_title' => 'Tytuł',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'Imię',
     'field_last_name' => 'Nazwisko',
     'field_company_name' => 'Nazwa firmy',
@@ -53,11 +68,15 @@
     'add_address' => 'Dodaj adres',
     'field_line_one' => 'Adres, linia 1',
     'field_line_two' => 'Adres, linia 2',
+    'field_line_three' => 'Adres, linia 3',
     'field_city' => 'Miasto',
+    'field_state' => 'Województwo / region',
     'field_postcode' => 'Kod pocztowy',
     'field_country' => 'Kraj',
     'select_country' => 'Wybierz kraj',
     'field_delivery_instructions' => 'Instrukcje dostawy',
+    'field_contact_email' => 'E-mail kontaktowy',
+    'field_contact_phone' => 'Telefon kontaktowy',
     'default_shipping' => 'Domyślny adres wysyłki',
     'default_billing' => 'Domyślny adres rozliczeniowy',
     'save_address' => 'Zapisz adres',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'Nie znaleziono użytkownika o tym adresie e-mail.',
 
     'activity_empty' => 'Brak zarejestrowanej aktywności',
+    'activity_created' => 'Klient utworzony',
+    'activity_updated' => 'Klient zaktualizowany',
+    'activity_deleted' => 'Klient usunięty',
+    'activity_address_created' => 'Adres dodany',
+    'activity_address_updated' => 'Adres zaktualizowany',
+    'activity_address_deleted' => 'Adres usunięty',
+    'activity_user_linked' => 'Użytkownik połączony',
+    'activity_user_unlinked' => 'Użytkownik odłączony',
 
     'at_a_glance' => 'W skrócie',
     'side_type' => 'Typ',
diff --git a/packages/panel/resources/lang/pt_BR/customers.php b/packages/panel/resources/lang/pt_BR/customers.php
index 406ac017ba..86f4d31009 100644
--- a/packages/panel/resources/lang/pt_BR/customers.php
+++ b/packages/panel/resources/lang/pt_BR/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'Nenhum cliente corresponde a esses filtros',
     'empty_body' => 'Tente limpar a busca ou os filtros para ver mais clientes.',
     'clear_filters' => 'Limpar filtros',
+    'show_kpis' => 'Mostrar KPIs',
+    'kpi_total_label' => 'Total de clientes',
+    'kpi_total_hint' => 'em todos os grupos',
+    'kpi_new_label' => 'Novos (30 d)',
+    'kpi_new_hint' => 'cadastrados nos últimos 30 dias',
+    'kpi_business_label' => 'Contas B2B',
+    'kpi_business_hint' => 'clientes com empresa',
+    'kpi_with_account_label' => 'Pode entrar',
+    'kpi_with_account_hint' => 'vinculados a uma conta de usuário',
 
     'column_customer' => 'Cliente',
     'column_company' => 'Empresa',
@@ -30,10 +39,16 @@
     'joined' => 'Ingressou em {date}',
     'delete_customer' => 'Excluir cliente',
     'create_customer' => 'Criar cliente',
+    'back_to_customers' => 'Voltar para clientes',
 
     'personal_details' => 'Dados pessoais',
     'personal_details_desc' => 'Nome, empresa e identificadores de conta usados em pedidos e faturas.',
     'field_title' => 'Título',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'Nome',
     'field_last_name' => 'Sobrenome',
     'field_company_name' => 'Nome da empresa',
@@ -53,11 +68,15 @@
     'add_address' => 'Adicionar endereço',
     'field_line_one' => 'Endereço linha 1',
     'field_line_two' => 'Endereço linha 2',
+    'field_line_three' => 'Endereço linha 3',
     'field_city' => 'Cidade',
+    'field_state' => 'Estado / região',
     'field_postcode' => 'CEP',
     'field_country' => 'País',
     'select_country' => 'Selecione um país',
     'field_delivery_instructions' => 'Instruções de entrega',
+    'field_contact_email' => 'E-mail de contato',
+    'field_contact_phone' => 'Telefone de contato',
     'default_shipping' => 'Envio padrão',
     'default_billing' => 'Cobrança padrão',
     'save_address' => 'Salvar endereço',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'Nenhum usuário foi encontrado com esse endereço de e-mail.',
 
     'activity_empty' => 'Nenhuma atividade registrada ainda',
+    'activity_created' => 'Cliente criado',
+    'activity_updated' => 'Cliente atualizado',
+    'activity_deleted' => 'Cliente excluído',
+    'activity_address_created' => 'Endereço adicionado',
+    'activity_address_updated' => 'Endereço atualizado',
+    'activity_address_deleted' => 'Endereço excluído',
+    'activity_user_linked' => 'Usuário vinculado',
+    'activity_user_unlinked' => 'Usuário desvinculado',
 
     'at_a_glance' => 'Resumo',
     'side_type' => 'Tipo',
diff --git a/packages/panel/resources/lang/ro/customers.php b/packages/panel/resources/lang/ro/customers.php
index 332e85ef8f..b5f4308b5b 100644
--- a/packages/panel/resources/lang/ro/customers.php
+++ b/packages/panel/resources/lang/ro/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'Niciun client nu corespunde acestor filtre',
     'empty_body' => 'Încearcă să ștergi căutarea sau filtrele pentru a vedea mai mulți clienți.',
     'clear_filters' => 'Șterge filtrele',
+    'show_kpis' => 'Afișează KPI',
+    'kpi_total_label' => 'Total clienți',
+    'kpi_total_hint' => 'în toate grupurile',
+    'kpi_new_label' => 'Noi (30 z)',
+    'kpi_new_hint' => 'înscriși în ultimele 30 de zile',
+    'kpi_business_label' => 'Conturi B2B',
+    'kpi_business_hint' => 'clienți cu companie',
+    'kpi_with_account_label' => 'Se poate autentifica',
+    'kpi_with_account_hint' => 'legați de un cont de utilizator',
 
     'column_customer' => 'Client',
     'column_company' => 'Companie',
@@ -30,10 +39,16 @@
     'joined' => 'Înregistrat la {date}',
     'delete_customer' => 'Șterge clientul',
     'create_customer' => 'Creează client',
+    'back_to_customers' => 'Înapoi la clienți',
 
     'personal_details' => 'Detalii personale',
     'personal_details_desc' => 'Numele, compania și identificatorii contului folosiți în comenzi și facturi.',
     'field_title' => 'Titlu',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'Prenume',
     'field_last_name' => 'Nume de familie',
     'field_company_name' => 'Numele companiei',
@@ -53,11 +68,15 @@
     'add_address' => 'Adaugă adresă',
     'field_line_one' => 'Adresa, linia 1',
     'field_line_two' => 'Adresa, linia 2',
+    'field_line_three' => 'Adresa, linia 3',
     'field_city' => 'Oraș',
+    'field_state' => 'Județ / regiune',
     'field_postcode' => 'Cod poștal',
     'field_country' => 'Țară',
     'select_country' => 'Selectează o țară',
     'field_delivery_instructions' => 'Instrucțiuni de livrare',
+    'field_contact_email' => 'E-mail de contact',
+    'field_contact_phone' => 'Telefon de contact',
     'default_shipping' => 'Livrare implicită',
     'default_billing' => 'Facturare implicită',
     'save_address' => 'Salvează adresa',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'Niciun utilizator nu a fost găsit cu această adresă de e-mail.',
 
     'activity_empty' => 'Nicio activitate înregistrată încă',
+    'activity_created' => 'Client creat',
+    'activity_updated' => 'Client actualizat',
+    'activity_deleted' => 'Client șters',
+    'activity_address_created' => 'Adresă adăugată',
+    'activity_address_updated' => 'Adresă actualizată',
+    'activity_address_deleted' => 'Adresă ștearsă',
+    'activity_user_linked' => 'Utilizator asociat',
+    'activity_user_unlinked' => 'Utilizator dezasociat',
 
     'at_a_glance' => 'Pe scurt',
     'side_type' => 'Tip',
diff --git a/packages/panel/resources/lang/tr/customers.php b/packages/panel/resources/lang/tr/customers.php
index 980365b754..0b49c865cb 100644
--- a/packages/panel/resources/lang/tr/customers.php
+++ b/packages/panel/resources/lang/tr/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'Bu filtrelerle eşleşen müşteri yok',
     'empty_body' => 'Daha fazla müşteri görmek için aramayı veya filtreleri temizlemeyi deneyin.',
     'clear_filters' => 'Filtreleri temizle',
+    'show_kpis' => 'KPI\'ları göster',
+    'kpi_total_label' => 'Toplam müşteri',
+    'kpi_total_hint' => 'tüm gruplarda',
+    'kpi_new_label' => 'Yeni (30 g)',
+    'kpi_new_hint' => 'son 30 günde katıldı',
+    'kpi_business_label' => 'B2B hesapları',
+    'kpi_business_hint' => 'şirketi olan müşteriler',
+    'kpi_with_account_label' => 'Giriş yapabilir',
+    'kpi_with_account_hint' => 'bir kullanıcı hesabına bağlı',
 
     'column_customer' => 'Müşteri',
     'column_company' => 'Şirket',
@@ -30,10 +39,16 @@
     'joined' => '{date} tarihinde katıldı',
     'delete_customer' => 'Müşteriyi sil',
     'create_customer' => 'Müşteri oluştur',
+    'back_to_customers' => 'Müşterilere geri dön',
 
     'personal_details' => 'Kişisel bilgiler',
     'personal_details_desc' => 'Siparişlerde ve faturalarda kullanılan ad, şirket ve hesap tanımlayıcıları.',
     'field_title' => 'Unvan',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'Ad',
     'field_last_name' => 'Soyad',
     'field_company_name' => 'Şirket adı',
@@ -53,11 +68,15 @@
     'add_address' => 'Adres ekle',
     'field_line_one' => 'Adres satırı 1',
     'field_line_two' => 'Adres satırı 2',
+    'field_line_three' => 'Adres satırı 3',
     'field_city' => 'Şehir',
+    'field_state' => 'İl / bölge',
     'field_postcode' => 'Posta kodu',
     'field_country' => 'Ülke',
     'select_country' => 'Bir ülke seçin',
     'field_delivery_instructions' => 'Teslimat talimatları',
+    'field_contact_email' => 'İletişim e-postası',
+    'field_contact_phone' => 'İletişim telefonu',
     'default_shipping' => 'Varsayılan gönderim',
     'default_billing' => 'Varsayılan fatura',
     'save_address' => 'Adresi kaydet',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'Bu e-posta adresine sahip bir kullanıcı bulunamadı.',
 
     'activity_empty' => 'Henüz kaydedilmiş etkinlik yok',
+    'activity_created' => 'Müşteri oluşturuldu',
+    'activity_updated' => 'Müşteri güncellendi',
+    'activity_deleted' => 'Müşteri silindi',
+    'activity_address_created' => 'Adres eklendi',
+    'activity_address_updated' => 'Adres güncellendi',
+    'activity_address_deleted' => 'Adres silindi',
+    'activity_user_linked' => 'Kullanıcı bağlandı',
+    'activity_user_unlinked' => 'Kullanıcı bağlantısı kaldırıldı',
 
     'at_a_glance' => 'Genel bakış',
     'side_type' => 'Tür',
diff --git a/packages/panel/resources/lang/vi/customers.php b/packages/panel/resources/lang/vi/customers.php
index d8c2bd17dc..edffd70c2c 100644
--- a/packages/panel/resources/lang/vi/customers.php
+++ b/packages/panel/resources/lang/vi/customers.php
@@ -19,6 +19,15 @@
     'empty_title' => 'Không có khách hàng nào khớp với các bộ lọc này',
     'empty_body' => 'Hãy thử xóa tìm kiếm hoặc bộ lọc để xem thêm khách hàng.',
     'clear_filters' => 'Xóa bộ lọc',
+    'show_kpis' => 'Hiện KPI',
+    'kpi_total_label' => 'Tổng khách hàng',
+    'kpi_total_hint' => 'trên tất cả các nhóm',
+    'kpi_new_label' => 'Mới (30 ngày)',
+    'kpi_new_hint' => 'tham gia trong 30 ngày qua',
+    'kpi_business_label' => 'Tài khoản B2B',
+    'kpi_business_hint' => 'khách hàng có công ty',
+    'kpi_with_account_label' => 'Có thể đăng nhập',
+    'kpi_with_account_hint' => 'liên kết với tài khoản người dùng',
 
     'column_customer' => 'Khách hàng',
     'column_company' => 'Công ty',
@@ -30,10 +39,16 @@
     'joined' => 'Đã tham gia {date}',
     'delete_customer' => 'Xóa khách hàng',
     'create_customer' => 'Tạo khách hàng',
+    'back_to_customers' => 'Quay lại khách hàng',
 
     'personal_details' => 'Thông tin cá nhân',
     'personal_details_desc' => 'Tên, công ty và các mã định danh tài khoản được sử dụng trong đơn hàng và hóa đơn.',
     'field_title' => 'Danh xưng',
+    'title_mr' => 'Mr',
+    'title_ms' => 'Ms',
+    'title_mrs' => 'Mrs',
+    'title_mx' => 'Mx',
+    'title_dr' => 'Dr',
     'field_first_name' => 'Tên',
     'field_last_name' => 'Họ',
     'field_company_name' => 'Tên công ty',
@@ -53,11 +68,15 @@
     'add_address' => 'Thêm địa chỉ',
     'field_line_one' => 'Địa chỉ dòng 1',
     'field_line_two' => 'Địa chỉ dòng 2',
+    'field_line_three' => 'Địa chỉ dòng 3',
     'field_city' => 'Thành phố',
+    'field_state' => 'Tỉnh / bang',
     'field_postcode' => 'Mã bưu điện',
     'field_country' => 'Quốc gia',
     'select_country' => 'Chọn một quốc gia',
     'field_delivery_instructions' => 'Hướng dẫn giao hàng',
+    'field_contact_email' => 'Email liên hệ',
+    'field_contact_phone' => 'Điện thoại liên hệ',
     'default_shipping' => 'Giao hàng mặc định',
     'default_billing' => 'Thanh toán mặc định',
     'save_address' => 'Lưu địa chỉ',
@@ -76,6 +95,14 @@
     'link_user_not_found' => 'Không tìm thấy người dùng nào với địa chỉ email đó.',
 
     'activity_empty' => 'Chưa có hoạt động nào được ghi lại',
+    'activity_created' => 'Đã tạo khách hàng',
+    'activity_updated' => 'Đã cập nhật khách hàng',
+    'activity_deleted' => 'Đã xóa khách hàng',
+    'activity_address_created' => 'Đã thêm địa chỉ',
+    'activity_address_updated' => 'Đã cập nhật địa chỉ',
+    'activity_address_deleted' => 'Đã xóa địa chỉ',
+    'activity_user_linked' => 'Đã liên kết người dùng',
+    'activity_user_unlinked' => 'Đã hủy liên kết người dùng',
 
     'at_a_glance' => 'Tổng quan',
     'side_type' => 'Loại',
diff --git a/packages/panel/src/Http/Controllers/Customers/CustomerIndexController.php b/packages/panel/src/Http/Controllers/Customers/CustomerIndexController.php
index 33bdc8f5f1..c6711412a4 100644
--- a/packages/panel/src/Http/Controllers/Customers/CustomerIndexController.php
+++ b/packages/panel/src/Http/Controllers/Customers/CustomerIndexController.php
@@ -46,7 +46,8 @@ public function index(Request $request): Response
                         ->orWhere('last_name', 'like', $like)
                         ->orWhere('company_name', 'like', $like)
                         ->orWhere('tax_identifier', 'like', $like)
-                        ->orWhere('account_ref', 'like', $like);
+                        ->orWhere('account_ref', 'like', $like)
+                        ->orWhereHas('users', fn ($query) => $query->where('email', 'like', $like));
 
                     $resolver->applySearchQueries($query, $term);
                 });
@@ -66,6 +67,8 @@ public function index(Request $request): Response
                 $row = [
                     'id' => $customer->id,
                     'full_name' => $customer->full_name,
+                    'first_name' => $customer->first_name,
+                    'last_name' => $customer->last_name,
                     'company_name' => $customer->company_name,
                     'account_ref' => $customer->account_ref,
                     'created_at' => $customer->created_at,
@@ -84,11 +87,19 @@ public function index(Request $request): Response
                 return $row;
             });
 
+        $totalCount = Customer::count();
+
         return Inertia::render('customers/Index', [
             'customers' => $customers,
             ...$this->tableProps($resolver, $this->columns, $request),
             'customerGroups' => CustomerGroup::all(['id', 'name']),
-            'totalCount' => Customer::count(),
+            'totalCount' => $totalCount,
+            'kpis' => [
+                'total' => $totalCount,
+                'newLast30Days' => Customer::where('created_at', '>=', now()->subDays(30))->count(),
+                'business' => Customer::whereNotNull('company_name')->where('company_name', '!=', '')->count(),
+                'withAccount' => Customer::has('users')->count(),
+            ],
             'filters' => $request->only(['q', 'customer_group_id', 'type', 'sort', 'direction']),
             'urls' => [
                 'index' => route('panel.customers.index'),
diff --git a/tests/panel/Feature/Customers/CustomerAddressTest.php b/tests/panel/Feature/Customers/CustomerAddressTest.php
index 4298ccfc31..8bc54156d9 100644
--- a/tests/panel/Feature/Customers/CustomerAddressTest.php
+++ b/tests/panel/Feature/Customers/CustomerAddressTest.php
@@ -76,3 +76,45 @@
 
     expect(Address::find($address->id))->toBeNull();
 });
+
+it('records address changes on the customer activity log', function () {
+    // The panel TestCase disables activity logging globally; this test is about the log.
+    activity()->enableLogging();
+
+    $staff = Staff::factory()->create(['admin' => true]);
+    $this->actingAs($staff, 'staff');
+
+    $customer = Customer::factory()->create();
+    $country = Country::factory()->create();
+
+    $this->post(route('panel.customers.addresses.store', $customer), [
+        'first_name' => 'Ada',
+        'last_name' => 'Lovelace',
+        'line_one' => '1 Analytical Engine Way',
+        'city' => 'London',
+        'country_id' => $country->id,
+    ]);
+
+    $address = $customer->addresses()->sole();
+
+    $this->put(route('panel.customers.addresses.update', [$customer, $address]), [
+        'first_name' => 'Ada',
+        'last_name' => 'Lovelace',
+        'line_one' => '2 Analytical Engine Way',
+        'city' => 'London',
+        'country_id' => $country->id,
+    ]);
+
+    $this->delete(route('panel.customers.addresses.destroy', [$customer, $address]));
+
+    $descriptions = $customer->activities()->pluck('description');
+
+    expect($descriptions)->toContain('address-created')
+        ->toContain('address-updated')
+        ->toContain('address-deleted');
+
+    $created = $customer->activities()->where('description', 'address-created')->sole();
+
+    expect($created->causer)->toBeInstanceOf(Staff::class)
+        ->and($created->causer->id)->toBe($staff->id);
+});
diff --git a/tests/panel/Feature/Customers/CustomerIndexTest.php b/tests/panel/Feature/Customers/CustomerIndexTest.php
index af8a9d56a6..d9a65bb906 100644
--- a/tests/panel/Feature/Customers/CustomerIndexTest.php
+++ b/tests/panel/Feature/Customers/CustomerIndexTest.php
@@ -4,6 +4,7 @@
 use Lunar\Core\Models\Customer;
 use Lunar\Core\Models\CustomerGroup;
 use Lunar\Core\Models\Staff;
+use Lunar\Tests\Core\Stubs\User;
 use Lunar\Tests\Panel\TestCase;
 
 uses(TestCase::class);
@@ -79,6 +80,38 @@
         ->assertInertia(fn (Assert $page) => $page->where('filters.sort', 'meta'));
 });
 
+it('searches customers by linked user email', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    $match = Customer::factory()->create(['first_name' => 'Ada', 'last_name' => 'Lovelace']);
+    $match->users()->attach(User::factory()->create(['email' => 'ada@example.com']));
+    Customer::factory()->create(['first_name' => 'Grace', 'last_name' => 'Hopper']);
+
+    $this->get(route('panel.customers.index', ['q' => 'ada@example.com']))
+        ->assertInertia(fn (Assert $page) => $page
+            ->has('customers.data', 1)
+            ->where('customers.data.0.id', $match->id)
+        );
+});
+
+it('exposes real KPI counts', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    Customer::factory()->create(['company_name' => 'Acme Ltd']);
+    Customer::factory()->create(['company_name' => null, 'created_at' => now()->subDays(40)]);
+
+    $withUser = Customer::factory()->create(['company_name' => null]);
+    $withUser->users()->attach(User::factory()->create());
+
+    $this->get(route('panel.customers.index'))
+        ->assertInertia(fn (Assert $page) => $page
+            ->where('kpis.total', 3)
+            ->where('kpis.newLast30Days', 2)
+            ->where('kpis.business', 1)
+            ->where('kpis.withAccount', 1)
+        );
+});
+
 it('paginates the customer index', function () {
     $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
 
diff --git a/tests/panel/Feature/Customers/CustomerUserTest.php b/tests/panel/Feature/Customers/CustomerUserTest.php
index 867f54d443..82692fd6ed 100644
--- a/tests/panel/Feature/Customers/CustomerUserTest.php
+++ b/tests/panel/Feature/Customers/CustomerUserTest.php
@@ -56,3 +56,21 @@
 
     expect($customer->users()->count())->toBe(0);
 });
+
+it('records user link changes on the customer activity log', function () {
+    // The panel TestCase disables activity logging globally; this test is about the log.
+    activity()->enableLogging();
+
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    $customer = Customer::factory()->create();
+    $user = User::factory()->create(['email' => 'ada@example.com']);
+
+    $this->post(route('panel.customers.users.store', $customer), ['email' => 'ada@example.com']);
+    $this->delete(route('panel.customers.users.destroy', ['customer' => $customer, 'user' => $user->id]));
+
+    $descriptions = $customer->activities()->pluck('description');
+
+    expect($descriptions)->toContain('user-linked')
+        ->toContain('user-unlinked');
+});

From 25454d8c928d1219825366f5755578ef8711cb0c Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Thu, 16 Jul 2026 19:13:14 +0100
Subject: [PATCH 02/19] Add breadcrumbs to the customer create and edit pages

Both pages went straight to PageHeader; they now render the same
breadcrumb bar as the index (Sales > Customers > current page) with
the Docs link in the actions slot.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../panel/resources/js/pages/customers/Create.vue | 15 +++++++++++++++
 .../panel/resources/js/pages/customers/Edit.vue   | 15 +++++++++++++++
 2 files changed, 30 insertions(+)

diff --git a/packages/panel/resources/js/pages/customers/Create.vue b/packages/panel/resources/js/pages/customers/Create.vue
index f1cfd8c885..c0f3aa4231 100644
--- a/packages/panel/resources/js/pages/customers/Create.vue
+++ b/packages/panel/resources/js/pages/customers/Create.vue
@@ -2,6 +2,7 @@
 import { computed, ref } from 'vue';
 import { Link, useForm } from '@inertiajs/vue3';
 import { useI18n } from 'vue-i18n';
+import Breadcrumbs, { type BreadcrumbItem } from '../../components/Breadcrumbs.vue';
 import Button from '../../components/Button.vue';
 import Combobox from '../../components/Combobox.vue';
 import FieldLabel from '../../components/FieldLabel.vue';
@@ -34,6 +35,12 @@ const form = useForm({
 
 const { t } = useI18n();
 
+const breadcrumbs = computed<BreadcrumbItem[]>(() => [
+    { label: t('nav.sales') },
+    { label: t('nav.customers'), href: props.urls.index },
+    { label: t('customers.new_title'), current: true },
+]);
+
 // Stored values stay canonical; only the visible labels are translated.
 const titleOptions = computed(() => [
     { value: '', label: '—' },
@@ -69,6 +76,14 @@ const submit = (): void => {
 <template>
     <PanelLayout>
         <div data-screen-label="New customer" class="contents">
+            <Breadcrumbs :items="breadcrumbs">
+                <template #actions>
+                    <a href="https://docs.lunarphp.com/" target="_blank" rel="noopener">
+                        <Button icon="help"><span class="hidden sm:inline">{{ t('common.docs') }}</span></Button>
+                    </a>
+                </template>
+            </Breadcrumbs>
+
             <PageHeader :title="t('customers.new_title')">
                 <template #icon>
                     <Link
diff --git a/packages/panel/resources/js/pages/customers/Edit.vue b/packages/panel/resources/js/pages/customers/Edit.vue
index f90fed4d94..e195027325 100644
--- a/packages/panel/resources/js/pages/customers/Edit.vue
+++ b/packages/panel/resources/js/pages/customers/Edit.vue
@@ -6,6 +6,7 @@ import Button from '../../components/Button.vue';
 import AddressCard from '../../components/AddressCard.vue';
 import AddressFormFields from '../../components/AddressFormFields.vue';
 import ActivityTimeline from '../../components/ActivityTimeline.vue';
+import Breadcrumbs, { type BreadcrumbItem } from '../../components/Breadcrumbs.vue';
 import Combobox from '../../components/Combobox.vue';
 import ConfirmDialog from '../../components/ConfirmDialog.vue';
 import FieldLabel from '../../components/FieldLabel.vue';
@@ -95,6 +96,12 @@ const flashSuccess = computed(() => (usePage().props.flash as { success?: string
 const initials = (): string => ((props.customer.first_name?.[0] ?? '?') + (props.customer.last_name?.[0] ?? '')).toUpperCase();
 const fullName = computed(() => [props.customer.title, props.customer.first_name, props.customer.last_name].filter(Boolean).join(' '));
 
+const breadcrumbs = computed<BreadcrumbItem[]>(() => [
+    { label: t('nav.sales') },
+    { label: t('nav.customers'), href: props.urls.index },
+    { label: fullName.value, current: true },
+]);
+
 // Personal details + customer groups
 const detailsForm = useForm({
     title: props.customer.title ?? '',
@@ -377,6 +384,14 @@ const tabDefs = computed(() => [
 <template>
     <PanelLayout>
         <div data-screen-label="Customer detail" class="contents">
+            <Breadcrumbs :items="breadcrumbs">
+                <template #actions>
+                    <a href="https://docs.lunarphp.com/" target="_blank" rel="noopener">
+                        <Button icon="help"><span class="hidden sm:inline">{{ t('common.docs') }}</span></Button>
+                    </a>
+                </template>
+            </Breadcrumbs>
+
             <PageHeader :title="fullName">
                 <template #icon>
                     <div class="w-11 h-11 rounded-full overflow-hidden shrink-0 bg-surface-2 border border-line grid place-items-center text-ink-700 text-[13px] font-semibold">

From 60daddc7a0f049374c1ef71384112e0ef49d7827 Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Thu, 16 Jul 2026 19:36:07 +0100
Subject: [PATCH 03/19] Bring the customer edit page up to the design prototype

- Header shows the linked user's email when the customer has exactly
  one storefront user; it stays out of the edit form (the user record
  owns it)
- Lifetime stats side card: total spend, order count, average order,
  and latest order date over placed orders, reported in the default
  currency via each order's captured exchange rate (the prototype's
  duplicate top-of-page stat strip is intentionally not implemented)
- Order history tab: read-only list of placed orders (reference, date,
  lifecycle status, total); rows link nowhere until an Orders section
  exists
- Notes side card with inline editing, backed by a new nullable
  customers.notes column (new migration on top of the flat baseline)
  and a panel notes endpoint
- UpdatesCustomer now takes a nullable group set: null leaves group
  membership untouched (used by the notes endpoint), an empty array
  still clears it
- No "email customer" action, per review
- Spec 0049 updated: order history and purchase stats are no longer
  deferred

Translations: new keys mirrored across all 16 locales.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 ...16_000001_add_notes_to_customers_table.php |  22 +++
 .../src/Actions/Customers/UpdateCustomer.php  |  11 +-
 .../Actions/Customers/UpdatesCustomer.php     |   4 +-
 packages/core/src/Models/Customer.php         |   1 +
 .../resources/js/pages/customers/Edit.vue     | 139 +++++++++++++++++-
 .../panel/resources/lang/ar/customers.php     |  19 +++
 .../panel/resources/lang/bg/customers.php     |  19 +++
 .../panel/resources/lang/de/customers.php     |  19 +++
 .../panel/resources/lang/en/customers.php     |  19 +++
 .../panel/resources/lang/es/customers.php     |  19 +++
 .../panel/resources/lang/fa/customers.php     |  19 +++
 .../panel/resources/lang/fr/customers.php     |  19 +++
 .../panel/resources/lang/hr/customers.php     |  19 +++
 .../panel/resources/lang/hu/customers.php     |  19 +++
 .../panel/resources/lang/mn/customers.php     |  19 +++
 .../panel/resources/lang/nl/customers.php     |  19 +++
 .../panel/resources/lang/pl/customers.php     |  19 +++
 .../panel/resources/lang/pt_BR/customers.php  |  19 +++
 .../panel/resources/lang/ro/customers.php     |  19 +++
 .../panel/resources/lang/tr/customers.php     |  19 +++
 .../panel/resources/lang/vi/customers.php     |  19 +++
 .../Customers/CustomerEditController.php      |  43 ++++++
 .../Customers/CustomerNotesController.php     |  18 +++
 .../Customers/CustomerNotesRequest.php        |  18 +++
 .../panel/src/Sections/Sales/SalesSection.php |   2 +
 specs/0049-inertia-panel.md                   |   9 +-
 .../Actions/Customers/UpdateCustomerTest.php  |  12 +-
 .../Feature/Customers/CustomerEditTest.php    |  41 ++++++
 .../Feature/Customers/CustomerNotesTest.php   |  61 ++++++++
 29 files changed, 673 insertions(+), 12 deletions(-)
 create mode 100644 packages/core/database/migrations/2026_07_16_000001_add_notes_to_customers_table.php
 create mode 100644 packages/panel/src/Http/Controllers/Customers/CustomerNotesController.php
 create mode 100644 packages/panel/src/Http/Requests/Customers/CustomerNotesRequest.php
 create mode 100644 tests/panel/Feature/Customers/CustomerNotesTest.php

diff --git a/packages/core/database/migrations/2026_07_16_000001_add_notes_to_customers_table.php b/packages/core/database/migrations/2026_07_16_000001_add_notes_to_customers_table.php
new file mode 100644
index 0000000000..d335904c8b
--- /dev/null
+++ b/packages/core/database/migrations/2026_07_16_000001_add_notes_to_customers_table.php
@@ -0,0 +1,22 @@
+<?php
+
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+use Lunar\Core\Database\Migration;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::table($this->prefix.'customers', function (Blueprint $table) {
+            $table->text('notes')->nullable();
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::table($this->prefix.'customers', function (Blueprint $table) {
+            $table->dropColumn('notes');
+        });
+    }
+};
diff --git a/packages/core/src/Actions/Customers/UpdateCustomer.php b/packages/core/src/Actions/Customers/UpdateCustomer.php
index be7e3866bb..e9a34bebe3 100644
--- a/packages/core/src/Actions/Customers/UpdateCustomer.php
+++ b/packages/core/src/Actions/Customers/UpdateCustomer.php
@@ -6,16 +6,19 @@
 use Lunar\Core\Models\Customer;
 
 /**
- * Update a customer's attributes and sync it to the given customer groups —
- * an empty set clears any groups the customer currently belongs to.
+ * Update a customer's attributes and, when a group set is given, sync it to
+ * those customer groups — an empty set clears any current groups, while null
+ * leaves group membership untouched.
  */
 class UpdateCustomer implements UpdatesCustomer
 {
-    public function execute(Customer $customer, array $attributes, array $customerGroupIds = []): Customer
+    public function execute(Customer $customer, array $attributes, ?array $customerGroupIds = null): Customer
     {
         $customer->update($attributes);
 
-        $customer->customerGroups()->sync($customerGroupIds);
+        if ($customerGroupIds !== null) {
+            $customer->customerGroups()->sync($customerGroupIds);
+        }
 
         return $customer;
     }
diff --git a/packages/core/src/Contracts/Actions/Customers/UpdatesCustomer.php b/packages/core/src/Contracts/Actions/Customers/UpdatesCustomer.php
index 5339d11f04..27f8bf6034 100644
--- a/packages/core/src/Contracts/Actions/Customers/UpdatesCustomer.php
+++ b/packages/core/src/Contracts/Actions/Customers/UpdatesCustomer.php
@@ -8,7 +8,7 @@ interface UpdatesCustomer
 {
     /**
      * @param  array<string, mixed>  $attributes
-     * @param  array<int, int>  $customerGroupIds
+     * @param  ?array<int, int>  $customerGroupIds  null leaves group membership untouched; an empty array clears it
      */
-    public function execute(Customer $customer, array $attributes, array $customerGroupIds = []): Customer;
+    public function execute(Customer $customer, array $attributes, ?array $customerGroupIds = null): Customer;
 }
diff --git a/packages/core/src/Models/Customer.php b/packages/core/src/Models/Customer.php
index 071f4276d3..d66becebef 100644
--- a/packages/core/src/Models/Customer.php
+++ b/packages/core/src/Models/Customer.php
@@ -26,6 +26,7 @@
  * @property ?string $company_name
  * @property ?string $tax_identifier
  * @property ?string $account_ref
+ * @property ?string $notes
  * @property ?array $attribute_data
  * @property ?array $meta
  * @property ?Carbon $created_at
diff --git a/packages/panel/resources/js/pages/customers/Edit.vue b/packages/panel/resources/js/pages/customers/Edit.vue
index e195027325..e18c17ef8f 100644
--- a/packages/panel/resources/js/pages/customers/Edit.vue
+++ b/packages/panel/resources/js/pages/customers/Edit.vue
@@ -19,6 +19,7 @@ import Select from '../../components/Select.vue';
 import SideCard from '../../components/SideCard.vue';
 import StatusBadge from '../../components/StatusBadge.vue';
 import Tabs from '../../components/Tabs.vue';
+import Textarea from '../../components/Textarea.vue';
 import TextInput from '../../components/TextInput.vue';
 import PanelLayout from '../../layouts/PanelLayout.vue';
 
@@ -63,6 +64,15 @@ interface ActivityEntry {
     causer_name: string | null;
 }
 
+interface OrderRow {
+    id: number;
+    reference: string;
+    status: string;
+    status_label: string;
+    placed_at: string;
+    total: string;
+}
+
 const props = defineProps<{
     customer: {
         id: number;
@@ -72,6 +82,7 @@ const props = defineProps<{
         company_name: string | null;
         tax_identifier: string | null;
         account_ref: string | null;
+        notes: string | null;
         created_at: string;
         customer_groups: OptionItem[];
     };
@@ -80,12 +91,20 @@ const props = defineProps<{
     addresses: Address[];
     users: LinkedUser[];
     activities: ActivityEntry[];
+    orders: OrderRow[];
+    stats: {
+        orders: number;
+        totalSpend: string | null;
+        avgOrder: string | null;
+        latestOrderAt: string | null;
+    };
     urls: {
         index: string;
         update: string;
         destroy: string;
         addressesStore: string;
         usersStore: string;
+        notesUpdate: string;
     };
 }>();
 
@@ -102,6 +121,9 @@ const breadcrumbs = computed<BreadcrumbItem[]>(() => [
     { label: fullName.value, current: true },
 ]);
 
+// Most customers have a single storefront user; surface its email in the header.
+const headerEmail = computed(() => (props.users.length === 1 ? props.users[0].email : null));
+
 // Personal details + customer groups
 const detailsForm = useForm({
     title: props.customer.title ?? '',
@@ -372,11 +394,47 @@ const timelineEvents = computed(() =>
         actor: activity.causer_name ?? '',
     })));
 
+// Notes side card: view by default, pencil toggles an inline editor.
+const notesEditing = ref(false);
+const notesForm = useForm({ notes: props.customer.notes ?? '' });
+
+const startEditNotes = (): void => {
+    notesForm.clearErrors();
+    notesForm.notes = props.customer.notes ?? '';
+    notesEditing.value = true;
+};
+
+const submitNotes = (): void => {
+    notesForm.put(props.urls.notesUpdate, {
+        preserveScroll: true,
+        onSuccess: () => {
+            notesEditing.value = false;
+        },
+    });
+};
+
+// Order history tab
+const orderStatusTone = (status: string): 'sage' | 'archived' | 'danger' | 'neutral' => {
+    switch (status) {
+        case 'open':
+            return 'sage';
+        case 'closed':
+            return 'archived';
+        case 'cancelled':
+            return 'danger';
+        default:
+            return 'neutral';
+    }
+};
+
+const formatDate = (value: string): string => new Date(value).toLocaleDateString();
+
 // Tabs
-const activeTab = ref<'addresses' | 'users' | 'activity'>('addresses');
+const activeTab = ref<'addresses' | 'users' | 'orders' | 'activity'>('addresses');
 const tabDefs = computed(() => [
     { value: 'addresses', label: t('customers.tab_addresses'), count: props.addresses.length },
     { value: 'users', label: t('customers.tab_users'), count: props.users.length },
+    { value: 'orders', label: t('customers.tab_order_history'), count: props.stats.orders },
     { value: 'activity', label: t('customers.tab_activity') },
 ]);
 </script>
@@ -400,6 +458,8 @@ const tabDefs = computed(() => [
                 </template>
                 <template #description>
                     <div class="flex gap-2 items-center flex-wrap">
+                        <span v-if="headerEmail" class="text-ink-700">{{ headerEmail }}</span>
+                        <span v-if="headerEmail" class="text-ink-500">·</span>
                         <span v-if="customer.company_name" class="text-ink-700">{{ customer.company_name }}</span>
                         <span v-if="customer.company_name" class="text-ink-500">·</span>
                         <template v-for="group in customer.customer_groups" :key="group.id">
@@ -591,6 +651,32 @@ const tabDefs = computed(() => [
                                     </form>
                                 </template>
 
+                                <template #orders>
+                                    <div v-if="orders.length" class="bg-surface border border-line rounded-xl shadow-sm overflow-hidden">
+                                        <table class="w-full border-collapse text-[13px]">
+                                            <thead>
+                                                <tr class="text-[11px] uppercase tracking-[0.06em] text-ink-500 font-medium bg-surface-2 border-b border-line">
+                                                    <th class="text-left font-medium px-4 py-2.5">{{ t('customers.order_reference') }}</th>
+                                                    <th class="text-left font-medium px-4 py-2.5">{{ t('customers.order_date') }}</th>
+                                                    <th class="text-left font-medium px-4 py-2.5">{{ t('customers.order_status') }}</th>
+                                                    <th class="text-right font-medium px-4 py-2.5">{{ t('customers.order_total') }}</th>
+                                                </tr>
+                                            </thead>
+                                            <tbody>
+                                                <tr v-for="order in orders" :key="order.id" class="border-b border-line last:border-b-0">
+                                                    <td class="px-4 py-2.5 align-middle font-mono text-[12px] text-ink-900">{{ order.reference }}</td>
+                                                    <td class="px-4 py-2.5 align-middle text-ink-700 [font-variant-numeric:tabular-nums]">{{ formatDate(order.placed_at) }}</td>
+                                                    <td class="px-4 py-2.5 align-middle">
+                                                        <StatusBadge size="sm" :tone="orderStatusTone(order.status)">{{ order.status_label }}</StatusBadge>
+                                                    </td>
+                                                    <td class="px-4 py-2.5 align-middle text-right text-ink-900 [font-variant-numeric:tabular-nums]">{{ order.total }}</td>
+                                                </tr>
+                                            </tbody>
+                                        </table>
+                                    </div>
+                                    <PageEmpty v-else :title="t('customers.orders_empty_title')">{{ t('customers.orders_empty_body') }}</PageEmpty>
+                                </template>
+
                                 <template #activity>
                                     <ActivityTimeline :events="timelineEvents" :reverse="false" />
                                     <PageEmpty v-if="!activities.length" :title="t('customers.activity_empty')" />
@@ -625,6 +711,27 @@ const tabDefs = computed(() => [
                                 </div>
                             </SideCard>
 
+                            <SideCard :title="t('customers.lifetime_stats')">
+                                <div class="flex flex-col gap-2 text-[12px]">
+                                    <div class="flex items-center justify-between gap-2">
+                                        <span class="text-ink-500">{{ t('customers.stat_total_spend') }}</span>
+                                        <span class="text-ink-900 font-medium [font-variant-numeric:tabular-nums]">{{ stats.totalSpend ?? '—' }}</span>
+                                    </div>
+                                    <div class="flex items-center justify-between gap-2">
+                                        <span class="text-ink-500">{{ t('customers.stat_orders') }}</span>
+                                        <span class="text-ink-900 font-medium [font-variant-numeric:tabular-nums]">{{ stats.orders }}</span>
+                                    </div>
+                                    <div class="flex items-center justify-between gap-2">
+                                        <span class="text-ink-500">{{ t('customers.stat_avg_order') }}</span>
+                                        <span class="text-ink-900 font-medium [font-variant-numeric:tabular-nums]">{{ stats.avgOrder ?? '—' }}</span>
+                                    </div>
+                                    <div class="flex items-center justify-between gap-2">
+                                        <span class="text-ink-500">{{ t('customers.stat_latest_order') }}</span>
+                                        <span class="text-ink-900 font-medium [font-variant-numeric:tabular-nums]">{{ stats.latestOrderAt ? formatDate(stats.latestOrderAt) : '—' }}</span>
+                                    </div>
+                                </div>
+                            </SideCard>
+
                             <SideCard :title="t('customers.default_addresses')">
                                 <div class="flex flex-col gap-3">
                                     <div>
@@ -651,6 +758,36 @@ const tabDefs = computed(() => [
                                     </div>
                                 </div>
                             </SideCard>
+
+                            <SideCard :title="t('customers.notes')">
+                                <template #actions>
+                                    <Button
+                                        v-if="!notesEditing"
+                                        variant="ghost"
+                                        size="sm"
+                                        icon="edit"
+                                        :aria-label="t('customers.edit_notes')"
+                                        @click="startEditNotes"
+                                    />
+                                </template>
+                                <form v-if="notesEditing" class="flex flex-col gap-2" @submit.prevent="submitNotes">
+                                    <Textarea
+                                        v-model="notesForm.notes"
+                                        :rows="4"
+                                        :aria-label="t('customers.notes')"
+                                        :invalid="!!notesForm.errors.notes"
+                                    />
+                                    <div v-if="notesForm.errors.notes" class="text-[11px] text-danger">{{ notesForm.errors.notes }}</div>
+                                    <div class="flex gap-2">
+                                        <Button type="submit" variant="primary" size="sm" :disabled="notesForm.processing">{{ t('common.save_changes') }}</Button>
+                                        <Button type="button" size="sm" @click="notesEditing = false">{{ t('common.cancel') }}</Button>
+                                    </div>
+                                </form>
+                                <template v-else>
+                                    <p v-if="customer.notes" class="m-0 text-[12.5px] text-ink-700 leading-[1.55] whitespace-pre-line">{{ customer.notes }}</p>
+                                    <p v-else class="m-0 text-[12px] text-ink-500 italic">{{ t('customers.notes_empty') }}</p>
+                                </template>
+                            </SideCard>
                         </div>
                     </aside>
                 </div>
diff --git a/packages/panel/resources/lang/ar/customers.php b/packages/panel/resources/lang/ar/customers.php
index 6f87f558ad..3ced2d7aab 100644
--- a/packages/panel/resources/lang/ar/customers.php
+++ b/packages/panel/resources/lang/ar/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'العناوين',
     'tab_users' => 'المستخدمون',
+    'tab_order_history' => 'سجل الطلبات',
     'tab_activity' => 'النشاط',
 
     'add_address' => 'إضافة عنوان',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'لا توجد عناوين محفوظة',
     'addresses_empty_body' => 'ستظهر هنا العناوين المُدخلة عند إتمام الطلب.',
 
+    'order_reference' => 'المرجع',
+    'order_date' => 'التاريخ',
+    'order_status' => 'الحالة',
+    'order_total' => 'الإجمالي',
+    'orders_empty_title' => 'لا توجد طلبات بعد',
+    'orders_empty_body' => 'ستظهر طلبات هذا العميل هنا.',
+
     'users_intro' => 'الأشخاص الذين يمكنهم تسجيل الدخول كهذا العميل.',
     'unlink_user' => 'إلغاء ربط المستخدم',
     'users_empty_title' => 'لا يوجد مستخدمون بعد',
@@ -114,6 +122,16 @@
     'shipping' => 'الشحن',
     'none_set' => 'لم يتم التعيين.',
 
+    'lifetime_stats' => 'إحصاءات العميل',
+    'stat_total_spend' => 'إجمالي الإنفاق',
+    'stat_orders' => 'الطلبات',
+    'stat_avg_order' => 'متوسط الطلب',
+    'stat_latest_order' => 'آخر طلب',
+
+    'notes' => 'ملاحظات',
+    'notes_empty' => 'لا توجد ملاحظات بعد.',
+    'edit_notes' => 'تعديل الملاحظات',
+
     'confirm_delete_customer' => 'هل أنت متأكد من أنك تريد حذف هذا العميل؟',
     'confirm_delete_customer_title' => 'هل تريد حذف هذا العميل؟',
     'confirm_delete_customer_body' => 'لا يمكن التراجع عن هذا الإجراء.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'تم حذف العنوان.',
     'flash_user_linked' => 'تم ربط المستخدم.',
     'flash_user_unlinked' => 'تم إلغاء ربط المستخدم.',
+    'flash_notes_updated' => 'تم تحديث الملاحظات.',
 ];
diff --git a/packages/panel/resources/lang/bg/customers.php b/packages/panel/resources/lang/bg/customers.php
index 9f3b888be4..eec2481ba4 100644
--- a/packages/panel/resources/lang/bg/customers.php
+++ b/packages/panel/resources/lang/bg/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Адреси',
     'tab_users' => 'Потребители',
+    'tab_order_history' => 'История на поръчките',
     'tab_activity' => 'Активност',
 
     'add_address' => 'Добави адрес',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'Няма запазени адреси',
     'addresses_empty_body' => 'Адресите, въведени при плащане, ще се показват тук.',
 
+    'order_reference' => 'Референция',
+    'order_date' => 'Дата',
+    'order_status' => 'Статус',
+    'order_total' => 'Общо',
+    'orders_empty_title' => 'Все още няма поръчки',
+    'orders_empty_body' => 'Поръчките на този клиент ще се показват тук.',
+
     'users_intro' => 'Хора, които могат да влизат в системата като този клиент.',
     'unlink_user' => 'Премахни връзката с потребител',
     'users_empty_title' => 'Все още няма потребители',
@@ -114,6 +122,16 @@
     'shipping' => 'Доставка',
     'none_set' => 'Не е зададено.',
 
+    'lifetime_stats' => 'Статистика на клиента',
+    'stat_total_spend' => 'Общи разходи',
+    'stat_orders' => 'Поръчки',
+    'stat_avg_order' => 'Средна поръчка',
+    'stat_latest_order' => 'Последна поръчка',
+
+    'notes' => 'Бележки',
+    'notes_empty' => 'Все още няма бележки.',
+    'edit_notes' => 'Редактиране на бележките',
+
     'confirm_delete_customer' => 'Сигурни ли сте, че искате да изтриете този клиент?',
     'confirm_delete_customer_title' => 'Изтриване на този клиент?',
     'confirm_delete_customer_body' => 'Това не може да бъде отменено.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'Адресът е изтрит.',
     'flash_user_linked' => 'Потребителят е свързан.',
     'flash_user_unlinked' => 'Връзката с потребителя е премахната.',
+    'flash_notes_updated' => 'Бележките са актуализирани.',
 ];
diff --git a/packages/panel/resources/lang/de/customers.php b/packages/panel/resources/lang/de/customers.php
index b6879ecf87..8d7c4d9a39 100644
--- a/packages/panel/resources/lang/de/customers.php
+++ b/packages/panel/resources/lang/de/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Adressen',
     'tab_users' => 'Benutzer',
+    'tab_order_history' => 'Bestellverlauf',
     'tab_activity' => 'Aktivität',
 
     'add_address' => 'Adresse hinzufügen',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'Keine gespeicherten Adressen',
     'addresses_empty_body' => 'An der Kasse eingegebene Adressen werden hier angezeigt.',
 
+    'order_reference' => 'Referenz',
+    'order_date' => 'Datum',
+    'order_status' => 'Status',
+    'order_total' => 'Summe',
+    'orders_empty_title' => 'Noch keine Bestellungen',
+    'orders_empty_body' => 'Bestellungen dieses Kunden erscheinen hier.',
+
     'users_intro' => 'Personen, die sich als dieser Kunde anmelden können.',
     'unlink_user' => 'Benutzer trennen',
     'users_empty_title' => 'Noch keine Benutzer',
@@ -114,6 +122,16 @@
     'shipping' => 'Versand',
     'none_set' => 'Nicht festgelegt.',
 
+    'lifetime_stats' => 'Kundenstatistik',
+    'stat_total_spend' => 'Gesamtausgaben',
+    'stat_orders' => 'Bestellungen',
+    'stat_avg_order' => 'Ø Bestellwert',
+    'stat_latest_order' => 'Letzte Bestellung',
+
+    'notes' => 'Notizen',
+    'notes_empty' => 'Noch keine Notizen.',
+    'edit_notes' => 'Notizen bearbeiten',
+
     'confirm_delete_customer' => 'Möchten Sie diesen Kunden wirklich löschen?',
     'confirm_delete_customer_title' => 'Diesen Kunden löschen?',
     'confirm_delete_customer_body' => 'Dies kann nicht rückgängig gemacht werden.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'Adresse gelöscht.',
     'flash_user_linked' => 'Benutzer verknüpft.',
     'flash_user_unlinked' => 'Benutzer getrennt.',
+    'flash_notes_updated' => 'Notizen aktualisiert.',
 ];
diff --git a/packages/panel/resources/lang/en/customers.php b/packages/panel/resources/lang/en/customers.php
index ea046061eb..1a9bf995b3 100644
--- a/packages/panel/resources/lang/en/customers.php
+++ b/packages/panel/resources/lang/en/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Addresses',
     'tab_users' => 'Users',
+    'tab_order_history' => 'Order history',
     'tab_activity' => 'Activity',
 
     'add_address' => 'Add address',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'No saved addresses',
     'addresses_empty_body' => 'Addresses entered at checkout will appear here.',
 
+    'order_reference' => 'Reference',
+    'order_date' => 'Date',
+    'order_status' => 'Status',
+    'order_total' => 'Total',
+    'orders_empty_title' => 'No orders yet',
+    'orders_empty_body' => 'Orders placed by this customer will appear here.',
+
     'users_intro' => 'People who can sign in as this customer.',
     'unlink_user' => 'Unlink user',
     'users_empty_title' => 'No users yet',
@@ -114,6 +122,16 @@
     'shipping' => 'Shipping',
     'none_set' => 'None set.',
 
+    'lifetime_stats' => 'Lifetime stats',
+    'stat_total_spend' => 'Total spend',
+    'stat_orders' => 'Orders',
+    'stat_avg_order' => 'Avg order',
+    'stat_latest_order' => 'Latest order',
+
+    'notes' => 'Notes',
+    'notes_empty' => 'No notes yet.',
+    'edit_notes' => 'Edit notes',
+
     'confirm_delete_customer' => 'Are you sure you want to delete this customer?',
     'confirm_delete_customer_title' => 'Delete this customer?',
     'confirm_delete_customer_body' => 'This cannot be undone.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'Address deleted.',
     'flash_user_linked' => 'User linked.',
     'flash_user_unlinked' => 'User unlinked.',
+    'flash_notes_updated' => 'Notes updated.',
 ];
diff --git a/packages/panel/resources/lang/es/customers.php b/packages/panel/resources/lang/es/customers.php
index adb893fb2b..ed63ccb0ab 100644
--- a/packages/panel/resources/lang/es/customers.php
+++ b/packages/panel/resources/lang/es/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Direcciones',
     'tab_users' => 'Usuarios',
+    'tab_order_history' => 'Historial de pedidos',
     'tab_activity' => 'Actividad',
 
     'add_address' => 'Añadir dirección',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'Sin direcciones guardadas',
     'addresses_empty_body' => 'Las direcciones introducidas al finalizar la compra aparecerán aquí.',
 
+    'order_reference' => 'Referencia',
+    'order_date' => 'Fecha',
+    'order_status' => 'Estado',
+    'order_total' => 'Total',
+    'orders_empty_title' => 'Aún no hay pedidos',
+    'orders_empty_body' => 'Los pedidos de este cliente aparecerán aquí.',
+
     'users_intro' => 'Personas que pueden iniciar sesión como este cliente.',
     'unlink_user' => 'Desvincular usuario',
     'users_empty_title' => 'Aún no hay usuarios',
@@ -114,6 +122,16 @@
     'shipping' => 'Envío',
     'none_set' => 'Ninguna establecida.',
 
+    'lifetime_stats' => 'Estadísticas históricas',
+    'stat_total_spend' => 'Gasto total',
+    'stat_orders' => 'Pedidos',
+    'stat_avg_order' => 'Pedido medio',
+    'stat_latest_order' => 'Último pedido',
+
+    'notes' => 'Notas',
+    'notes_empty' => 'Aún no hay notas.',
+    'edit_notes' => 'Editar notas',
+
     'confirm_delete_customer' => '¿Estás seguro de que quieres eliminar este cliente?',
     'confirm_delete_customer_title' => '¿Eliminar este cliente?',
     'confirm_delete_customer_body' => 'Esta acción no se puede deshacer.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'Dirección eliminada.',
     'flash_user_linked' => 'Usuario vinculado.',
     'flash_user_unlinked' => 'Usuario desvinculado.',
+    'flash_notes_updated' => 'Notas actualizadas.',
 ];
diff --git a/packages/panel/resources/lang/fa/customers.php b/packages/panel/resources/lang/fa/customers.php
index 322d45ab3b..8fc835f13d 100644
--- a/packages/panel/resources/lang/fa/customers.php
+++ b/packages/panel/resources/lang/fa/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'آدرس‌ها',
     'tab_users' => 'کاربران',
+    'tab_order_history' => 'تاریخچه سفارش‌ها',
     'tab_activity' => 'فعالیت',
 
     'add_address' => 'افزودن آدرس',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'هیچ آدرس ذخیره‌شده‌ای نیست',
     'addresses_empty_body' => 'آدرس‌های واردشده هنگام تسویه‌حساب در اینجا نمایش داده می‌شوند.',
 
+    'order_reference' => 'مرجع',
+    'order_date' => 'تاریخ',
+    'order_status' => 'وضعیت',
+    'order_total' => 'مجموع',
+    'orders_empty_title' => 'هنوز سفارشی وجود ندارد',
+    'orders_empty_body' => 'سفارش‌های این مشتری اینجا نمایش داده می‌شوند.',
+
     'users_intro' => 'افرادی که می‌توانند به‌عنوان این مشتری وارد شوند.',
     'unlink_user' => 'قطع پیوند کاربر',
     'users_empty_title' => 'هنوز کاربری وجود ندارد',
@@ -114,6 +122,16 @@
     'shipping' => 'ارسال',
     'none_set' => 'تنظیم نشده است.',
 
+    'lifetime_stats' => 'آمار مشتری',
+    'stat_total_spend' => 'مجموع خرید',
+    'stat_orders' => 'سفارش‌ها',
+    'stat_avg_order' => 'میانگین سفارش',
+    'stat_latest_order' => 'آخرین سفارش',
+
+    'notes' => 'یادداشت‌ها',
+    'notes_empty' => 'هنوز یادداشتی وجود ندارد.',
+    'edit_notes' => 'ویرایش یادداشت‌ها',
+
     'confirm_delete_customer' => 'آیا مطمئن هستید که می‌خواهید این مشتری را حذف کنید؟',
     'confirm_delete_customer_title' => 'این مشتری حذف شود؟',
     'confirm_delete_customer_body' => 'این عملیات قابل بازگشت نیست.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'آدرس حذف شد.',
     'flash_user_linked' => 'کاربر پیوند داده شد.',
     'flash_user_unlinked' => 'پیوند کاربر قطع شد.',
+    'flash_notes_updated' => 'یادداشت‌ها به‌روزرسانی شد.',
 ];
diff --git a/packages/panel/resources/lang/fr/customers.php b/packages/panel/resources/lang/fr/customers.php
index 57ec8d7482..b8c5021b1d 100644
--- a/packages/panel/resources/lang/fr/customers.php
+++ b/packages/panel/resources/lang/fr/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Adresses',
     'tab_users' => 'Utilisateurs',
+    'tab_order_history' => 'Historique des commandes',
     'tab_activity' => 'Activité',
 
     'add_address' => 'Ajouter une adresse',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'Aucune adresse enregistrée',
     'addresses_empty_body' => 'Les adresses saisies lors du paiement apparaîtront ici.',
 
+    'order_reference' => 'Référence',
+    'order_date' => 'Date',
+    'order_status' => 'Statut',
+    'order_total' => 'Total',
+    'orders_empty_title' => 'Aucune commande pour le moment',
+    'orders_empty_body' => 'Les commandes passées par ce client apparaîtront ici.',
+
     'users_intro' => 'Personnes pouvant se connecter en tant que ce client.',
     'unlink_user' => "Dissocier l'utilisateur",
     'users_empty_title' => 'Aucun utilisateur pour le moment',
@@ -114,6 +122,16 @@
     'shipping' => 'Livraison',
     'none_set' => 'Aucune définie.',
 
+    'lifetime_stats' => 'Statistiques cumulées',
+    'stat_total_spend' => 'Dépenses totales',
+    'stat_orders' => 'Commandes',
+    'stat_avg_order' => 'Panier moyen',
+    'stat_latest_order' => 'Dernière commande',
+
+    'notes' => 'Notes',
+    'notes_empty' => 'Aucune note pour le moment.',
+    'edit_notes' => 'Modifier les notes',
+
     'confirm_delete_customer' => 'Êtes-vous sûr de vouloir supprimer ce client ?',
     'confirm_delete_customer_title' => 'Supprimer ce client ?',
     'confirm_delete_customer_body' => 'Cette action est irréversible.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'Adresse supprimée.',
     'flash_user_linked' => 'Utilisateur associé.',
     'flash_user_unlinked' => 'Utilisateur dissocié.',
+    'flash_notes_updated' => 'Notes mises à jour.',
 ];
diff --git a/packages/panel/resources/lang/hr/customers.php b/packages/panel/resources/lang/hr/customers.php
index 3d5d88ca1c..e7af07e3f8 100644
--- a/packages/panel/resources/lang/hr/customers.php
+++ b/packages/panel/resources/lang/hr/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Adrese',
     'tab_users' => 'Korisnici',
+    'tab_order_history' => 'Povijest narudžbi',
     'tab_activity' => 'Aktivnost',
 
     'add_address' => 'Dodaj adresu',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'Nema spremljenih adresa',
     'addresses_empty_body' => 'Adrese unesene prilikom plaćanja pojavit će se ovdje.',
 
+    'order_reference' => 'Referenca',
+    'order_date' => 'Datum',
+    'order_status' => 'Status',
+    'order_total' => 'Ukupno',
+    'orders_empty_title' => 'Još nema narudžbi',
+    'orders_empty_body' => 'Narudžbe ovog kupca pojavit će se ovdje.',
+
     'users_intro' => 'Osobe koje se mogu prijaviti kao ovaj kupac.',
     'unlink_user' => 'Odspoji korisnika',
     'users_empty_title' => 'Još nema korisnika',
@@ -114,6 +122,16 @@
     'shipping' => 'Dostava',
     'none_set' => 'Nije postavljeno.',
 
+    'lifetime_stats' => 'Statistika kupca',
+    'stat_total_spend' => 'Ukupna potrošnja',
+    'stat_orders' => 'Narudžbe',
+    'stat_avg_order' => 'Prosj. narudžba',
+    'stat_latest_order' => 'Zadnja narudžba',
+
+    'notes' => 'Bilješke',
+    'notes_empty' => 'Još nema bilješki.',
+    'edit_notes' => 'Uredi bilješke',
+
     'confirm_delete_customer' => 'Jeste li sigurni da želite izbrisati ovog kupca?',
     'confirm_delete_customer_title' => 'Izbrisati ovog kupca?',
     'confirm_delete_customer_body' => 'Ovo se ne može poništiti.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'Adresa je izbrisana.',
     'flash_user_linked' => 'Korisnik je povezan.',
     'flash_user_unlinked' => 'Korisnik je odspojen.',
+    'flash_notes_updated' => 'Bilješke ažurirane.',
 ];
diff --git a/packages/panel/resources/lang/hu/customers.php b/packages/panel/resources/lang/hu/customers.php
index 296c4df511..c95a4f19f5 100644
--- a/packages/panel/resources/lang/hu/customers.php
+++ b/packages/panel/resources/lang/hu/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Címek',
     'tab_users' => 'Felhasználók',
+    'tab_order_history' => 'Rendelési előzmények',
     'tab_activity' => 'Tevékenység',
 
     'add_address' => 'Cím hozzáadása',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'Nincsenek mentett címek',
     'addresses_empty_body' => 'A fizetéskor megadott címek itt fognak megjelenni.',
 
+    'order_reference' => 'Hivatkozás',
+    'order_date' => 'Dátum',
+    'order_status' => 'Állapot',
+    'order_total' => 'Összesen',
+    'orders_empty_title' => 'Még nincs rendelés',
+    'orders_empty_body' => 'Az ügyfél rendelései itt jelennek meg.',
+
     'users_intro' => 'Azok a személyek, akik bejelentkezhetnek ennek az ügyfélnek a nevében.',
     'unlink_user' => 'Felhasználó leválasztása',
     'users_empty_title' => 'Még nincsenek felhasználók',
@@ -114,6 +122,16 @@
     'shipping' => 'Szállítás',
     'none_set' => 'Nincs beállítva.',
 
+    'lifetime_stats' => 'Ügyfélstatisztika',
+    'stat_total_spend' => 'Összes költés',
+    'stat_orders' => 'Rendelések',
+    'stat_avg_order' => 'Átl. rendelés',
+    'stat_latest_order' => 'Legutóbbi rendelés',
+
+    'notes' => 'Jegyzetek',
+    'notes_empty' => 'Még nincs jegyzet.',
+    'edit_notes' => 'Jegyzetek szerkesztése',
+
     'confirm_delete_customer' => 'Biztosan törli ezt az ügyfelet?',
     'confirm_delete_customer_title' => 'Törli ezt az ügyfelet?',
     'confirm_delete_customer_body' => 'Ez a művelet nem vonható vissza.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'A cím törölve.',
     'flash_user_linked' => 'A felhasználó összekapcsolva.',
     'flash_user_unlinked' => 'A felhasználó leválasztva.',
+    'flash_notes_updated' => 'Jegyzetek frissítve.',
 ];
diff --git a/packages/panel/resources/lang/mn/customers.php b/packages/panel/resources/lang/mn/customers.php
index 2d4db4c79e..2c5504569d 100644
--- a/packages/panel/resources/lang/mn/customers.php
+++ b/packages/panel/resources/lang/mn/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Хаягууд',
     'tab_users' => 'Хэрэглэгчид',
+    'tab_order_history' => 'Захиалгын түүх',
     'tab_activity' => 'Үйл ажиллагаа',
 
     'add_address' => 'Хаяг нэмэх',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'Хадгалсан хаяг алга',
     'addresses_empty_body' => 'Тооцоо хийхэд оруулсан хаягууд эндээс харагдана.',
 
+    'order_reference' => 'Дугаар',
+    'order_date' => 'Огноо',
+    'order_status' => 'Төлөв',
+    'order_total' => 'Нийт',
+    'orders_empty_title' => 'Одоогоор захиалга алга',
+    'orders_empty_body' => 'Энэ харилцагчийн захиалгууд энд харагдана.',
+
     'users_intro' => 'Энэ харилцагчаар нэвтрэх боломжтой хүмүүс.',
     'unlink_user' => 'Хэрэглэгчийг салгах',
     'users_empty_title' => 'Хэрэглэгч алга байна',
@@ -114,6 +122,16 @@
     'shipping' => 'Хүргэлт',
     'none_set' => 'Тохируулаагүй.',
 
+    'lifetime_stats' => 'Харилцагчийн статистик',
+    'stat_total_spend' => 'Нийт зарцуулалт',
+    'stat_orders' => 'Захиалгууд',
+    'stat_avg_order' => 'Дундаж захиалга',
+    'stat_latest_order' => 'Сүүлийн захиалга',
+
+    'notes' => 'Тэмдэглэл',
+    'notes_empty' => 'Одоогоор тэмдэглэл алга.',
+    'edit_notes' => 'Тэмдэглэл засах',
+
     'confirm_delete_customer' => 'Та энэ харилцагчийг устгахдаа итгэлтэй байна уу?',
     'confirm_delete_customer_title' => 'Энэ харилцагчийг устгах уу?',
     'confirm_delete_customer_body' => 'Үүнийг буцаах боломжгүй.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'Хаяг устгагдлаа.',
     'flash_user_linked' => 'Хэрэглэгч холбогдлоо.',
     'flash_user_unlinked' => 'Хэрэглэгчийн холбоос тасаллаа.',
+    'flash_notes_updated' => 'Тэмдэглэл шинэчлэгдлээ.',
 ];
diff --git a/packages/panel/resources/lang/nl/customers.php b/packages/panel/resources/lang/nl/customers.php
index c67cad5fe8..aa253c86d4 100644
--- a/packages/panel/resources/lang/nl/customers.php
+++ b/packages/panel/resources/lang/nl/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Adressen',
     'tab_users' => 'Gebruikers',
+    'tab_order_history' => 'Bestelgeschiedenis',
     'tab_activity' => 'Activiteit',
 
     'add_address' => 'Adres toevoegen',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'Geen opgeslagen adressen',
     'addresses_empty_body' => 'Adressen die tijdens het afrekenen zijn ingevoerd, verschijnen hier.',
 
+    'order_reference' => 'Referentie',
+    'order_date' => 'Datum',
+    'order_status' => 'Status',
+    'order_total' => 'Totaal',
+    'orders_empty_title' => 'Nog geen bestellingen',
+    'orders_empty_body' => 'Bestellingen van deze klant verschijnen hier.',
+
     'users_intro' => 'Personen die kunnen inloggen als deze klant.',
     'unlink_user' => 'Gebruiker ontkoppelen',
     'users_empty_title' => 'Nog geen gebruikers',
@@ -114,6 +122,16 @@
     'shipping' => 'Verzending',
     'none_set' => 'Niet ingesteld.',
 
+    'lifetime_stats' => 'Totaalstatistieken',
+    'stat_total_spend' => 'Totale uitgaven',
+    'stat_orders' => 'Bestellingen',
+    'stat_avg_order' => 'Gem. bestelling',
+    'stat_latest_order' => 'Laatste bestelling',
+
+    'notes' => 'Notities',
+    'notes_empty' => 'Nog geen notities.',
+    'edit_notes' => 'Notities bewerken',
+
     'confirm_delete_customer' => 'Weet je zeker dat je deze klant wilt verwijderen?',
     'confirm_delete_customer_title' => 'Deze klant verwijderen?',
     'confirm_delete_customer_body' => 'Dit kan niet ongedaan worden gemaakt.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'Adres verwijderd.',
     'flash_user_linked' => 'Gebruiker gekoppeld.',
     'flash_user_unlinked' => 'Gebruiker ontkoppeld.',
+    'flash_notes_updated' => 'Notities bijgewerkt.',
 ];
diff --git a/packages/panel/resources/lang/pl/customers.php b/packages/panel/resources/lang/pl/customers.php
index c4b0c55a2e..76bef5b7a6 100644
--- a/packages/panel/resources/lang/pl/customers.php
+++ b/packages/panel/resources/lang/pl/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Adresy',
     'tab_users' => 'Użytkownicy',
+    'tab_order_history' => 'Historia zamówień',
     'tab_activity' => 'Aktywność',
 
     'add_address' => 'Dodaj adres',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'Brak zapisanych adresów',
     'addresses_empty_body' => 'Adresy podane podczas realizacji zamówienia pojawią się tutaj.',
 
+    'order_reference' => 'Referencja',
+    'order_date' => 'Data',
+    'order_status' => 'Status',
+    'order_total' => 'Suma',
+    'orders_empty_title' => 'Brak zamówień',
+    'orders_empty_body' => 'Zamówienia tego klienta pojawią się tutaj.',
+
     'users_intro' => 'Osoby, które mogą logować się jako ten klient.',
     'unlink_user' => 'Odłącz użytkownika',
     'users_empty_title' => 'Brak użytkowników',
@@ -114,6 +122,16 @@
     'shipping' => 'Wysyłkowy',
     'none_set' => 'Nie ustawiono.',
 
+    'lifetime_stats' => 'Statystyki klienta',
+    'stat_total_spend' => 'Łączne wydatki',
+    'stat_orders' => 'Zamówienia',
+    'stat_avg_order' => 'Śr. zamówienie',
+    'stat_latest_order' => 'Ostatnie zamówienie',
+
+    'notes' => 'Notatki',
+    'notes_empty' => 'Brak notatek.',
+    'edit_notes' => 'Edytuj notatki',
+
     'confirm_delete_customer' => 'Czy na pewno chcesz usunąć tego klienta?',
     'confirm_delete_customer_title' => 'Usunąć tego klienta?',
     'confirm_delete_customer_body' => 'Tej czynności nie można cofnąć.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'Adres usunięty.',
     'flash_user_linked' => 'Użytkownik połączony.',
     'flash_user_unlinked' => 'Użytkownik odłączony.',
+    'flash_notes_updated' => 'Notatki zaktualizowane.',
 ];
diff --git a/packages/panel/resources/lang/pt_BR/customers.php b/packages/panel/resources/lang/pt_BR/customers.php
index 86f4d31009..58e1d71dd7 100644
--- a/packages/panel/resources/lang/pt_BR/customers.php
+++ b/packages/panel/resources/lang/pt_BR/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Endereços',
     'tab_users' => 'Usuários',
+    'tab_order_history' => 'Histórico de pedidos',
     'tab_activity' => 'Atividade',
 
     'add_address' => 'Adicionar endereço',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'Nenhum endereço salvo',
     'addresses_empty_body' => 'Os endereços informados no checkout aparecerão aqui.',
 
+    'order_reference' => 'Referência',
+    'order_date' => 'Data',
+    'order_status' => 'Status',
+    'order_total' => 'Total',
+    'orders_empty_title' => 'Nenhum pedido ainda',
+    'orders_empty_body' => 'Os pedidos deste cliente aparecerão aqui.',
+
     'users_intro' => 'Pessoas que podem entrar como esse cliente.',
     'unlink_user' => 'Desvincular usuário',
     'users_empty_title' => 'Nenhum usuário ainda',
@@ -114,6 +122,16 @@
     'shipping' => 'Envio',
     'none_set' => 'Nenhum definido.',
 
+    'lifetime_stats' => 'Estatísticas do cliente',
+    'stat_total_spend' => 'Gasto total',
+    'stat_orders' => 'Pedidos',
+    'stat_avg_order' => 'Pedido médio',
+    'stat_latest_order' => 'Último pedido',
+
+    'notes' => 'Notas',
+    'notes_empty' => 'Nenhuma nota ainda.',
+    'edit_notes' => 'Editar notas',
+
     'confirm_delete_customer' => 'Tem certeza de que deseja excluir este cliente?',
     'confirm_delete_customer_title' => 'Excluir este cliente?',
     'confirm_delete_customer_body' => 'Isso não pode ser desfeito.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'Endereço excluído.',
     'flash_user_linked' => 'Usuário vinculado.',
     'flash_user_unlinked' => 'Usuário desvinculado.',
+    'flash_notes_updated' => 'Notas atualizadas.',
 ];
diff --git a/packages/panel/resources/lang/ro/customers.php b/packages/panel/resources/lang/ro/customers.php
index b5f4308b5b..398a71e122 100644
--- a/packages/panel/resources/lang/ro/customers.php
+++ b/packages/panel/resources/lang/ro/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Adrese',
     'tab_users' => 'Utilizatori',
+    'tab_order_history' => 'Istoric comenzi',
     'tab_activity' => 'Activitate',
 
     'add_address' => 'Adaugă adresă',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'Nicio adresă salvată',
     'addresses_empty_body' => 'Adresele introduse la finalizarea comenzii vor apărea aici.',
 
+    'order_reference' => 'Referință',
+    'order_date' => 'Dată',
+    'order_status' => 'Stare',
+    'order_total' => 'Total',
+    'orders_empty_title' => 'Nicio comandă încă',
+    'orders_empty_body' => 'Comenzile acestui client vor apărea aici.',
+
     'users_intro' => 'Persoanele care se pot conecta ca acest client.',
     'unlink_user' => 'Dezasociază utilizatorul',
     'users_empty_title' => 'Niciun utilizator încă',
@@ -114,6 +122,16 @@
     'shipping' => 'Livrare',
     'none_set' => 'Niciuna setată.',
 
+    'lifetime_stats' => 'Statistici client',
+    'stat_total_spend' => 'Cheltuieli totale',
+    'stat_orders' => 'Comenzi',
+    'stat_avg_order' => 'Comandă medie',
+    'stat_latest_order' => 'Ultima comandă',
+
+    'notes' => 'Notițe',
+    'notes_empty' => 'Nicio notiță încă.',
+    'edit_notes' => 'Editează notițele',
+
     'confirm_delete_customer' => 'Ești sigur că vrei să ștergi acest client?',
     'confirm_delete_customer_title' => 'Ștergi acest client?',
     'confirm_delete_customer_body' => 'Această acțiune nu poate fi anulată.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'Adresă ștearsă.',
     'flash_user_linked' => 'Utilizator asociat.',
     'flash_user_unlinked' => 'Utilizator dezasociat.',
+    'flash_notes_updated' => 'Notițe actualizate.',
 ];
diff --git a/packages/panel/resources/lang/tr/customers.php b/packages/panel/resources/lang/tr/customers.php
index 0b49c865cb..2bce6348db 100644
--- a/packages/panel/resources/lang/tr/customers.php
+++ b/packages/panel/resources/lang/tr/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Adresler',
     'tab_users' => 'Kullanıcılar',
+    'tab_order_history' => 'Sipariş geçmişi',
     'tab_activity' => 'Etkinlik',
 
     'add_address' => 'Adres ekle',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'Kayıtlı adres yok',
     'addresses_empty_body' => 'Ödeme sırasında girilen adresler burada görünecek.',
 
+    'order_reference' => 'Referans',
+    'order_date' => 'Tarih',
+    'order_status' => 'Durum',
+    'order_total' => 'Toplam',
+    'orders_empty_title' => 'Henüz sipariş yok',
+    'orders_empty_body' => 'Bu müşterinin siparişleri burada görünecek.',
+
     'users_intro' => 'Bu müşteri olarak giriş yapabilecek kişiler.',
     'unlink_user' => 'Kullanıcı bağlantısını kaldır',
     'users_empty_title' => 'Henüz kullanıcı yok',
@@ -114,6 +122,16 @@
     'shipping' => 'Gönderim',
     'none_set' => 'Ayarlanmadı.',
 
+    'lifetime_stats' => 'Müşteri istatistikleri',
+    'stat_total_spend' => 'Toplam harcama',
+    'stat_orders' => 'Siparişler',
+    'stat_avg_order' => 'Ort. sipariş',
+    'stat_latest_order' => 'Son sipariş',
+
+    'notes' => 'Notlar',
+    'notes_empty' => 'Henüz not yok.',
+    'edit_notes' => 'Notları düzenle',
+
     'confirm_delete_customer' => 'Bu müşteriyi silmek istediğinizden emin misiniz?',
     'confirm_delete_customer_title' => 'Bu müşteri silinsin mi?',
     'confirm_delete_customer_body' => 'Bu işlem geri alınamaz.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'Adres silindi.',
     'flash_user_linked' => 'Kullanıcı bağlandı.',
     'flash_user_unlinked' => 'Kullanıcı bağlantısı kaldırıldı.',
+    'flash_notes_updated' => 'Notlar güncellendi.',
 ];
diff --git a/packages/panel/resources/lang/vi/customers.php b/packages/panel/resources/lang/vi/customers.php
index edffd70c2c..9c98cc802d 100644
--- a/packages/panel/resources/lang/vi/customers.php
+++ b/packages/panel/resources/lang/vi/customers.php
@@ -63,6 +63,7 @@
 
     'tab_addresses' => 'Địa chỉ',
     'tab_users' => 'Người dùng',
+    'tab_order_history' => 'Lịch sử đơn hàng',
     'tab_activity' => 'Hoạt động',
 
     'add_address' => 'Thêm địa chỉ',
@@ -86,6 +87,13 @@
     'addresses_empty_title' => 'Chưa có địa chỉ nào được lưu',
     'addresses_empty_body' => 'Các địa chỉ nhập tại trang thanh toán sẽ xuất hiện ở đây.',
 
+    'order_reference' => 'Mã tham chiếu',
+    'order_date' => 'Ngày',
+    'order_status' => 'Trạng thái',
+    'order_total' => 'Tổng',
+    'orders_empty_title' => 'Chưa có đơn hàng',
+    'orders_empty_body' => 'Đơn hàng của khách này sẽ hiển thị ở đây.',
+
     'users_intro' => 'Những người có thể đăng nhập với tư cách là khách hàng này.',
     'unlink_user' => 'Hủy liên kết người dùng',
     'users_empty_title' => 'Chưa có người dùng nào',
@@ -114,6 +122,16 @@
     'shipping' => 'Giao hàng',
     'none_set' => 'Chưa được thiết lập.',
 
+    'lifetime_stats' => 'Thống kê khách hàng',
+    'stat_total_spend' => 'Tổng chi tiêu',
+    'stat_orders' => 'Đơn hàng',
+    'stat_avg_order' => 'Đơn trung bình',
+    'stat_latest_order' => 'Đơn gần nhất',
+
+    'notes' => 'Ghi chú',
+    'notes_empty' => 'Chưa có ghi chú.',
+    'edit_notes' => 'Sửa ghi chú',
+
     'confirm_delete_customer' => 'Bạn có chắc chắn muốn xóa khách hàng này không?',
     'confirm_delete_customer_title' => 'Xóa khách hàng này?',
     'confirm_delete_customer_body' => 'Hành động này không thể hoàn tác.',
@@ -130,4 +148,5 @@
     'flash_address_deleted' => 'Đã xóa địa chỉ.',
     'flash_user_linked' => 'Đã liên kết người dùng.',
     'flash_user_unlinked' => 'Đã hủy liên kết người dùng.',
+    'flash_notes_updated' => 'Đã cập nhật ghi chú.',
 ];
diff --git a/packages/panel/src/Http/Controllers/Customers/CustomerEditController.php b/packages/panel/src/Http/Controllers/Customers/CustomerEditController.php
index eca5122862..20223bbfdd 100644
--- a/packages/panel/src/Http/Controllers/Customers/CustomerEditController.php
+++ b/packages/panel/src/Http/Controllers/Customers/CustomerEditController.php
@@ -7,10 +7,13 @@
 use Inertia\Response;
 use Lunar\Core\Contracts\Actions\Customers\DeletesCustomer;
 use Lunar\Core\Contracts\Actions\Customers\UpdatesCustomer;
+use Lunar\Core\DataObjects\PriceValue;
 use Lunar\Core\Models\Address;
 use Lunar\Core\Models\Country;
+use Lunar\Core\Models\Currency;
 use Lunar\Core\Models\Customer;
 use Lunar\Core\Models\CustomerGroup;
+use Lunar\Core\Models\Order;
 use Lunar\Panel\Http\Requests\Customers\CustomerRequest;
 use Spatie\Activitylog\Models\Activity;
 
@@ -64,6 +67,42 @@ public function edit(Customer $customer): Response
                 'causer_name' => $activity->causer?->full_name ?? $activity->causer?->name ?? null,
             ]);
 
+        $placedOrders = $customer->orders()->whereNotNull('placed_at');
+
+        $orderCount = (clone $placedOrders)->count();
+
+        // Lifetime spend reported in the default currency; per-order totals are
+        // stored in the order's own currency, so divide by the exchange rate
+        // captured when the order was placed.
+        $totalSpend = (int) round((float) (clone $placedOrders)
+            ->selectRaw('COALESCE(SUM(total / NULLIF(exchange_rate, 0)), 0) AS spend')
+            ->value('spend'));
+
+        $stats = [
+            'orders' => $orderCount,
+            'totalSpend' => null,
+            'avgOrder' => null,
+            'latestOrderAt' => (clone $placedOrders)->max('placed_at'),
+        ];
+
+        if ($orderCount && ($defaultCurrency = Currency::getDefault())) {
+            $stats['totalSpend'] = (new PriceValue($totalSpend, $defaultCurrency))->format();
+            $stats['avgOrder'] = (new PriceValue((int) round($totalSpend / $orderCount), $defaultCurrency))->format();
+        }
+
+        $orders = (clone $placedOrders)
+            ->latest('placed_at')
+            ->limit(25)
+            ->get()
+            ->map(fn (Order $order) => [
+                'id' => $order->id,
+                'reference' => $order->reference,
+                'status' => $order->lifecycleStatus(),
+                'status_label' => __('lunar::states.order.'.$order->lifecycleStatus()),
+                'placed_at' => $order->placed_at,
+                'total' => $order->format('total'),
+            ]);
+
         return Inertia::render('customers/Edit', [
             'customer' => [
                 'id' => $customer->id,
@@ -73,6 +112,7 @@ public function edit(Customer $customer): Response
                 'company_name' => $customer->company_name,
                 'tax_identifier' => $customer->tax_identifier,
                 'account_ref' => $customer->account_ref,
+                'notes' => $customer->notes,
                 'created_at' => $customer->created_at,
                 'customer_groups' => $customer->customerGroups->map(fn (CustomerGroup $group) => [
                     'id' => $group->id,
@@ -84,12 +124,15 @@ public function edit(Customer $customer): Response
             'addresses' => $addresses,
             'users' => $users,
             'activities' => $activities,
+            'orders' => $orders,
+            'stats' => $stats,
             'urls' => [
                 'index' => route('panel.customers.index'),
                 'update' => route('panel.customers.update', $customer),
                 'destroy' => route('panel.customers.destroy', $customer),
                 'addressesStore' => route('panel.customers.addresses.store', $customer),
                 'usersStore' => route('panel.customers.users.store', $customer),
+                'notesUpdate' => route('panel.customers.notes.update', $customer),
             ],
         ]);
     }
diff --git a/packages/panel/src/Http/Controllers/Customers/CustomerNotesController.php b/packages/panel/src/Http/Controllers/Customers/CustomerNotesController.php
new file mode 100644
index 0000000000..230d86de04
--- /dev/null
+++ b/packages/panel/src/Http/Controllers/Customers/CustomerNotesController.php
@@ -0,0 +1,18 @@
+<?php
+
+namespace Lunar\Panel\Http\Controllers\Customers;
+
+use Illuminate\Http\RedirectResponse;
+use Lunar\Core\Contracts\Actions\Customers\UpdatesCustomer;
+use Lunar\Core\Models\Customer;
+use Lunar\Panel\Http\Requests\Customers\CustomerNotesRequest;
+
+class CustomerNotesController
+{
+    public function update(CustomerNotesRequest $request, Customer $customer, UpdatesCustomer $updatesCustomer): RedirectResponse
+    {
+        $updatesCustomer->execute($customer, $request->validated());
+
+        return back()->with('success', __('panel::customers.flash_notes_updated'));
+    }
+}
diff --git a/packages/panel/src/Http/Requests/Customers/CustomerNotesRequest.php b/packages/panel/src/Http/Requests/Customers/CustomerNotesRequest.php
new file mode 100644
index 0000000000..f6aeb8e980
--- /dev/null
+++ b/packages/panel/src/Http/Requests/Customers/CustomerNotesRequest.php
@@ -0,0 +1,18 @@
+<?php
+
+namespace Lunar\Panel\Http\Requests\Customers;
+
+use Illuminate\Foundation\Http\FormRequest;
+
+class CustomerNotesRequest extends FormRequest
+{
+    /**
+     * @return array<string, array<int, string>>
+     */
+    public function rules(): array
+    {
+        return [
+            'notes' => ['present', 'nullable', 'string', 'max:65535'],
+        ];
+    }
+}
diff --git a/packages/panel/src/Sections/Sales/SalesSection.php b/packages/panel/src/Sections/Sales/SalesSection.php
index ea46320950..749b62cae5 100644
--- a/packages/panel/src/Sections/Sales/SalesSection.php
+++ b/packages/panel/src/Sections/Sales/SalesSection.php
@@ -8,6 +8,7 @@
 use Lunar\Panel\Http\Controllers\Customers\CustomerCreateController;
 use Lunar\Panel\Http\Controllers\Customers\CustomerEditController;
 use Lunar\Panel\Http\Controllers\Customers\CustomerIndexController;
+use Lunar\Panel\Http\Controllers\Customers\CustomerNotesController;
 use Lunar\Panel\Http\Controllers\Customers\CustomerUserController;
 use Lunar\Panel\Navigation\NavigationItem;
 use Lunar\Panel\Navigation\NavigationRegistry;
@@ -63,6 +64,7 @@ public function routes(): ?Closure
                 Route::get('/{customer}/edit', [CustomerEditController::class, 'edit'])->name('edit');
                 Route::put('/{customer}', [CustomerEditController::class, 'update'])->name('update');
                 Route::delete('/{customer}', [CustomerEditController::class, 'destroy'])->name('destroy');
+                Route::put('/{customer}/notes', [CustomerNotesController::class, 'update'])->name('notes.update');
 
                 Route::scopeBindings()->group(function (): void {
                     Route::post('/{customer}/addresses', [CustomerAddressController::class, 'store'])->name('addresses.store');
diff --git a/specs/0049-inertia-panel.md b/specs/0049-inertia-panel.md
index b86b68f1c0..22269a2cf9 100644
--- a/specs/0049-inertia-panel.md
+++ b/specs/0049-inertia-panel.md
@@ -267,10 +267,11 @@ Against the core `staff` guard (`Lunar\Core\Models\Staff`), configurable via
 - **Customers** (a `sales` section) — index with search, customer-group filter, sort, and
   pagination on `DataTable`; create; detail/edit with personal details (title, names,
   company, tax identifier, account ref), customer-group assignment, and tabs for Saved
-  addresses (CRUD), Users (link/unlink to storefront users), and Activity (activity log);
-  delete with confirmation. The prototype's order-history tab and purchase-stat KPIs are
-  deferred until Orders exists; dynamic attribute rendering (`attribute_data`) is deferred
-  because it pulls in the whole field-type system. The layout leaves room for both.
+  addresses (CRUD), Users (link/unlink to storefront users), Order history (read-only list
+  over the core Order model), and Activity (activity log); lifetime purchase stats and an
+  editable notes card in the sidebar; delete with confirmation. Order rows do not link
+  anywhere until an Orders section exists; dynamic attribute rendering (`attribute_data`)
+  is deferred because it pulls in the whole field-type system.
 - **Settings layout** — the settings shell with its own grouped, permission-filtered
   sidebar driven by the settings-navigation registry, matching the design prototype's
   `SettingsNav`.
diff --git a/tests/core/Unit/Actions/Customers/UpdateCustomerTest.php b/tests/core/Unit/Actions/Customers/UpdateCustomerTest.php
index 6e3e986646..bd2f4d2ff7 100644
--- a/tests/core/Unit/Actions/Customers/UpdateCustomerTest.php
+++ b/tests/core/Unit/Actions/Customers/UpdateCustomerTest.php
@@ -52,7 +52,17 @@
     $group = CustomerGroup::factory()->create();
     $customer->customerGroups()->attach($group);
 
-    app(UpdateCustomer::class)->execute($customer, []);
+    app(UpdateCustomer::class)->execute($customer, [], []);
 
     expect($customer->customerGroups()->get())->toHaveCount(0);
 });
+
+test('leaves customer groups untouched when no set is given', function () {
+    $customer = Customer::factory()->create();
+    $group = CustomerGroup::factory()->create();
+    $customer->customerGroups()->attach($group);
+
+    app(UpdateCustomer::class)->execute($customer, ['first_name' => 'Peter']);
+
+    expect($customer->customerGroups()->get())->toHaveCount(1);
+});
diff --git a/tests/panel/Feature/Customers/CustomerEditTest.php b/tests/panel/Feature/Customers/CustomerEditTest.php
index 677cad780e..34e8fc6f21 100644
--- a/tests/panel/Feature/Customers/CustomerEditTest.php
+++ b/tests/panel/Feature/Customers/CustomerEditTest.php
@@ -2,8 +2,10 @@
 
 use Inertia\Testing\AssertableInertia as Assert;
 use Lunar\Core\Models\Address;
+use Lunar\Core\Models\Currency;
 use Lunar\Core\Models\Customer;
 use Lunar\Core\Models\CustomerGroup;
+use Lunar\Core\Models\Order;
 use Lunar\Core\Models\Staff;
 use Lunar\Tests\Core\Stubs\User;
 use Lunar\Tests\Panel\TestCase;
@@ -42,6 +44,45 @@
         );
 });
 
+it('exposes lifetime stats and order history for placed orders', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    Currency::factory()->create(['code' => 'GBP', 'default' => true, 'exchange_rate' => 1]);
+
+    $customer = Customer::factory()->create();
+
+    Order::factory()->placed()->for($customer)->create(['total' => 10000, 'exchange_rate' => 1]);
+    Order::factory()->placed()->for($customer)->create(['total' => 5000, 'exchange_rate' => 1]);
+    Order::factory()->for($customer)->create(['total' => 99999, 'placed_at' => null]);
+
+    $this->get(route('panel.customers.edit', $customer))
+        ->assertInertia(fn (Assert $page) => $page
+            ->where('stats.orders', 2)
+            ->where('stats.totalSpend', '£150.00')
+            ->where('stats.avgOrder', '£75.00')
+            ->whereNot('stats.latestOrderAt', null)
+            ->has('orders', 2)
+            ->has('orders.0', fn (Assert $order) => $order
+                ->hasAll(['id', 'reference', 'status', 'status_label', 'placed_at', 'total'])
+            )
+        );
+});
+
+it('reports empty lifetime stats when the customer has no placed orders', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    $customer = Customer::factory()->create();
+
+    $this->get(route('panel.customers.edit', $customer))
+        ->assertInertia(fn (Assert $page) => $page
+            ->where('stats.orders', 0)
+            ->where('stats.totalSpend', null)
+            ->where('stats.avgOrder', null)
+            ->where('stats.latestOrderAt', null)
+            ->has('orders', 0)
+        );
+});
+
 it('updates a customer and syncs its customer groups', function () {
     $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
 
diff --git a/tests/panel/Feature/Customers/CustomerNotesTest.php b/tests/panel/Feature/Customers/CustomerNotesTest.php
new file mode 100644
index 0000000000..07b3c9a134
--- /dev/null
+++ b/tests/panel/Feature/Customers/CustomerNotesTest.php
@@ -0,0 +1,61 @@
+<?php
+
+use Lunar\Core\Models\Customer;
+use Lunar\Core\Models\CustomerGroup;
+use Lunar\Core\Models\Staff;
+use Lunar\Tests\Panel\TestCase;
+
+uses(TestCase::class);
+
+it('updates the customer notes', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    $customer = Customer::factory()->create(['notes' => null]);
+
+    $this->put(route('panel.customers.notes.update', $customer), [
+        'notes' => 'Contact via email only; no marketing calls.',
+    ])->assertRedirect()
+        ->assertSessionHas('success', 'Notes updated.');
+
+    expect($customer->refresh()->notes)->toBe('Contact via email only; no marketing calls.');
+});
+
+it('clears the customer notes when null is given', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    $customer = Customer::factory()->create(['notes' => 'Old note.']);
+
+    $this->put(route('panel.customers.notes.update', $customer), ['notes' => null]);
+
+    expect($customer->refresh()->notes)->toBeNull();
+});
+
+it('leaves customer group membership untouched when updating notes', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    $customer = Customer::factory()->create();
+    $group = CustomerGroup::factory()->create();
+    $customer->customerGroups()->sync([$group->id]);
+
+    $this->put(route('panel.customers.notes.update', $customer), ['notes' => 'A note.']);
+
+    expect($customer->customerGroups()->get()->pluck('id')->all())->toBe([$group->id]);
+});
+
+it('requires the notes field to be present', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    $customer = Customer::factory()->create();
+
+    $this->put(route('panel.customers.notes.update', $customer), [])
+        ->assertSessionHasErrors(['notes']);
+});
+
+it('exposes the notes on the edit page', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    $customer = Customer::factory()->create(['notes' => 'VIP customer.']);
+
+    $this->get(route('panel.customers.edit', $customer))
+        ->assertInertia(fn ($page) => $page->where('customer.notes', 'VIP customer.'));
+});

From f792f3800ab297c55fcbdbbd62d1ea87969f1bef Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Thu, 16 Jul 2026 19:42:59 +0100
Subject: [PATCH 04/19] Show a user count in the customer header for multi-user
 customers

With one linked user the header shows their email; with several there
is no single address to show, so it shows "{n} users" instead
(pluralised via vue-i18n, keys in all 16 locales).

Also fold the customers.notes column into the flat baseline migration:
while v2 is in alpha, schema changes update the existing migrations
rather than adding change migrations (CLAUDE.md updated to match).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 CLAUDE.md                                     |  2 +-
 ...26_01_01_000008_create_customers_table.php |  1 +
 ...16_000001_add_notes_to_customers_table.php | 22 -------------------
 .../resources/js/pages/customers/Edit.vue     | 14 +++++++++---
 .../panel/resources/lang/ar/customers.php     |  2 ++
 .../panel/resources/lang/bg/customers.php     |  2 ++
 .../panel/resources/lang/de/customers.php     |  2 ++
 .../panel/resources/lang/en/customers.php     |  2 ++
 .../panel/resources/lang/es/customers.php     |  2 ++
 .../panel/resources/lang/fa/customers.php     |  2 ++
 .../panel/resources/lang/fr/customers.php     |  2 ++
 .../panel/resources/lang/hr/customers.php     |  2 ++
 .../panel/resources/lang/hu/customers.php     |  2 ++
 .../panel/resources/lang/mn/customers.php     |  2 ++
 .../panel/resources/lang/nl/customers.php     |  2 ++
 .../panel/resources/lang/pl/customers.php     |  2 ++
 .../panel/resources/lang/pt_BR/customers.php  |  2 ++
 .../panel/resources/lang/ro/customers.php     |  2 ++
 .../panel/resources/lang/tr/customers.php     |  2 ++
 .../panel/resources/lang/vi/customers.php     |  2 ++
 20 files changed, 45 insertions(+), 26 deletions(-)
 delete mode 100644 packages/core/database/migrations/2026_07_16_000001_add_notes_to_customers_table.php

diff --git a/CLAUDE.md b/CLAUDE.md
index baf0a6857c..7dec9f45e4 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -34,7 +34,7 @@ When asked to start a new piece of work that isn't already specced, write the sp
 
 - **Translations**: 16 locales live under each sub-package's `resources/lang/` (`ar, bg, de, en, es, fa, fr, hr, hu, mn, nl, pl, pt_BR, ro, tr, vi`). When adding or renaming a translation key, update **every** locale — English first, then mirror the key (English value is acceptable as a placeholder) across the other 15.
 - **Public contract surface**: this package is consumed by downstream apps. Treat anything outside `Models/Concerns/`, `Support/`, and internal namespaces as a contract — breaking changes require a spec and a Rector rule in the `upgrade` package.
-- **Migrations**: v2 ships a flat baseline. Schema changes go in a new migration; do not edit the baseline. The `upgrade` package handles v1 → v2 transformations.
+- **Migrations**: v2 ships a flat baseline. While v2 is in alpha, fold schema changes into the existing baseline migrations rather than adding change migrations; once v2 is released, schema changes go in new migrations instead. The `upgrade` package handles v1 → v2 transformations.
 - **Filament**: v5 with the schemas refactor applied. Use schemas, not the deprecated wrapper traits.
 - **Comments**: describe code in its own vocabulary — use the terms the API actually exposes (a `Fulfilment` is a "fulfilment", not a "parcel"). Don't introduce a metaphor that appears nowhere in the code. Keep comments and docblocks ASCII-only, except the established house style — em dash (`—`), arrow (`→`) in state-transition notes, and ellipsis (`…`). No other non-ASCII symbols (`§`, `Σ`, `⟹`, `≥`, emoji, …); spell them out (`section A`, `sum of`, `implies`, `>=`). This applies to comments, docblocks, and user-facing strings — the `resources/lang/` translation files are the only place non-ASCII text belongs.
 - **Namespace**: `Lunar\Core\…` for core, `Lunar\Admin\…`, `Lunar\Search\…`, etc. for other sub-packages.
diff --git a/packages/core/database/migrations/2026_01_01_000008_create_customers_table.php b/packages/core/database/migrations/2026_01_01_000008_create_customers_table.php
index 0965ab2656..1cefb594d3 100644
--- a/packages/core/database/migrations/2026_01_01_000008_create_customers_table.php
+++ b/packages/core/database/migrations/2026_01_01_000008_create_customers_table.php
@@ -20,6 +20,7 @@ public function up(): void
             $table->timestamps();
             $table->jsonb('attribute_data')->nullable();
             $table->string('account_ref')->nullable()->index();
+            $table->text('notes')->nullable();
         });
     }
 
diff --git a/packages/core/database/migrations/2026_07_16_000001_add_notes_to_customers_table.php b/packages/core/database/migrations/2026_07_16_000001_add_notes_to_customers_table.php
deleted file mode 100644
index d335904c8b..0000000000
--- a/packages/core/database/migrations/2026_07_16_000001_add_notes_to_customers_table.php
+++ /dev/null
@@ -1,22 +0,0 @@
-<?php
-
-use Illuminate\Database\Schema\Blueprint;
-use Illuminate\Support\Facades\Schema;
-use Lunar\Core\Database\Migration;
-
-return new class extends Migration
-{
-    public function up(): void
-    {
-        Schema::table($this->prefix.'customers', function (Blueprint $table) {
-            $table->text('notes')->nullable();
-        });
-    }
-
-    public function down(): void
-    {
-        Schema::table($this->prefix.'customers', function (Blueprint $table) {
-            $table->dropColumn('notes');
-        });
-    }
-};
diff --git a/packages/panel/resources/js/pages/customers/Edit.vue b/packages/panel/resources/js/pages/customers/Edit.vue
index e18c17ef8f..bcea03e896 100644
--- a/packages/panel/resources/js/pages/customers/Edit.vue
+++ b/packages/panel/resources/js/pages/customers/Edit.vue
@@ -122,7 +122,15 @@ const breadcrumbs = computed<BreadcrumbItem[]>(() => [
 ]);
 
 // Most customers have a single storefront user; surface its email in the header.
-const headerEmail = computed(() => (props.users.length === 1 ? props.users[0].email : null));
+// With several linked users there is no single address to show, so fall back
+// to the user count.
+const headerUsers = computed(() => {
+    if (props.users.length === 1) {
+        return props.users[0].email;
+    }
+
+    return props.users.length > 1 ? t('customers.user_count', props.users.length) : null;
+});
 
 // Personal details + customer groups
 const detailsForm = useForm({
@@ -458,8 +466,8 @@ const tabDefs = computed(() => [
                 </template>
                 <template #description>
                     <div class="flex gap-2 items-center flex-wrap">
-                        <span v-if="headerEmail" class="text-ink-700">{{ headerEmail }}</span>
-                        <span v-if="headerEmail" class="text-ink-500">·</span>
+                        <span v-if="headerUsers" class="text-ink-700">{{ headerUsers }}</span>
+                        <span v-if="headerUsers" class="text-ink-500">·</span>
                         <span v-if="customer.company_name" class="text-ink-700">{{ customer.company_name }}</span>
                         <span v-if="customer.company_name" class="text-ink-500">·</span>
                         <template v-for="group in customer.customer_groups" :key="group.id">
diff --git a/packages/panel/resources/lang/ar/customers.php b/packages/panel/resources/lang/ar/customers.php
index 3ced2d7aab..9231283165 100644
--- a/packages/panel/resources/lang/ar/customers.php
+++ b/packages/panel/resources/lang/ar/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'ستظهر طلبات هذا العميل هنا.',
 
     'users_intro' => 'الأشخاص الذين يمكنهم تسجيل الدخول كهذا العميل.',
+
+    'user_count' => 'مستخدم واحد | {count} مستخدمون',
     'unlink_user' => 'إلغاء ربط المستخدم',
     'users_empty_title' => 'لا يوجد مستخدمون بعد',
     'users_empty_body' => 'قم بدعوة مستخدم حتى يتمكن هذا العميل من تسجيل الدخول.',
diff --git a/packages/panel/resources/lang/bg/customers.php b/packages/panel/resources/lang/bg/customers.php
index eec2481ba4..126ca7f607 100644
--- a/packages/panel/resources/lang/bg/customers.php
+++ b/packages/panel/resources/lang/bg/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Поръчките на този клиент ще се показват тук.',
 
     'users_intro' => 'Хора, които могат да влизат в системата като този клиент.',
+
+    'user_count' => '{count} потребител | {count} потребители',
     'unlink_user' => 'Премахни връзката с потребител',
     'users_empty_title' => 'Все още няма потребители',
     'users_empty_body' => 'Поканете потребител, за да може този клиент да влиза в системата.',
diff --git a/packages/panel/resources/lang/de/customers.php b/packages/panel/resources/lang/de/customers.php
index 8d7c4d9a39..e462fbb0be 100644
--- a/packages/panel/resources/lang/de/customers.php
+++ b/packages/panel/resources/lang/de/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Bestellungen dieses Kunden erscheinen hier.',
 
     'users_intro' => 'Personen, die sich als dieser Kunde anmelden können.',
+
+    'user_count' => '{count} Benutzer | {count} Benutzer',
     'unlink_user' => 'Benutzer trennen',
     'users_empty_title' => 'Noch keine Benutzer',
     'users_empty_body' => 'Laden Sie einen Benutzer ein, damit sich dieser Kunde anmelden kann.',
diff --git a/packages/panel/resources/lang/en/customers.php b/packages/panel/resources/lang/en/customers.php
index 1a9bf995b3..a521733af7 100644
--- a/packages/panel/resources/lang/en/customers.php
+++ b/packages/panel/resources/lang/en/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Orders placed by this customer will appear here.',
 
     'users_intro' => 'People who can sign in as this customer.',
+
+    'user_count' => '{count} user | {count} users',
     'unlink_user' => 'Unlink user',
     'users_empty_title' => 'No users yet',
     'users_empty_body' => 'Invite a user so this customer can sign in.',
diff --git a/packages/panel/resources/lang/es/customers.php b/packages/panel/resources/lang/es/customers.php
index ed63ccb0ab..4729a05537 100644
--- a/packages/panel/resources/lang/es/customers.php
+++ b/packages/panel/resources/lang/es/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Los pedidos de este cliente aparecerán aquí.',
 
     'users_intro' => 'Personas que pueden iniciar sesión como este cliente.',
+
+    'user_count' => '{count} usuario | {count} usuarios',
     'unlink_user' => 'Desvincular usuario',
     'users_empty_title' => 'Aún no hay usuarios',
     'users_empty_body' => 'Invita a un usuario para que este cliente pueda iniciar sesión.',
diff --git a/packages/panel/resources/lang/fa/customers.php b/packages/panel/resources/lang/fa/customers.php
index 8fc835f13d..8fc802ecd9 100644
--- a/packages/panel/resources/lang/fa/customers.php
+++ b/packages/panel/resources/lang/fa/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'سفارش‌های این مشتری اینجا نمایش داده می‌شوند.',
 
     'users_intro' => 'افرادی که می‌توانند به‌عنوان این مشتری وارد شوند.',
+
+    'user_count' => '{count} کاربر | {count} کاربر',
     'unlink_user' => 'قطع پیوند کاربر',
     'users_empty_title' => 'هنوز کاربری وجود ندارد',
     'users_empty_body' => 'کاربری را دعوت کنید تا این مشتری بتواند وارد شود.',
diff --git a/packages/panel/resources/lang/fr/customers.php b/packages/panel/resources/lang/fr/customers.php
index b8c5021b1d..a34ad58dcd 100644
--- a/packages/panel/resources/lang/fr/customers.php
+++ b/packages/panel/resources/lang/fr/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Les commandes passées par ce client apparaîtront ici.',
 
     'users_intro' => 'Personnes pouvant se connecter en tant que ce client.',
+
+    'user_count' => '{count} utilisateur | {count} utilisateurs',
     'unlink_user' => "Dissocier l'utilisateur",
     'users_empty_title' => 'Aucun utilisateur pour le moment',
     'users_empty_body' => 'Invitez un utilisateur afin que ce client puisse se connecter.',
diff --git a/packages/panel/resources/lang/hr/customers.php b/packages/panel/resources/lang/hr/customers.php
index e7af07e3f8..60e72ddc7c 100644
--- a/packages/panel/resources/lang/hr/customers.php
+++ b/packages/panel/resources/lang/hr/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Narudžbe ovog kupca pojavit će se ovdje.',
 
     'users_intro' => 'Osobe koje se mogu prijaviti kao ovaj kupac.',
+
+    'user_count' => '{count} korisnik | {count} korisnika',
     'unlink_user' => 'Odspoji korisnika',
     'users_empty_title' => 'Još nema korisnika',
     'users_empty_body' => 'Pozovite korisnika kako bi se ovaj kupac mogao prijaviti.',
diff --git a/packages/panel/resources/lang/hu/customers.php b/packages/panel/resources/lang/hu/customers.php
index c95a4f19f5..1d6fdb5a96 100644
--- a/packages/panel/resources/lang/hu/customers.php
+++ b/packages/panel/resources/lang/hu/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Az ügyfél rendelései itt jelennek meg.',
 
     'users_intro' => 'Azok a személyek, akik bejelentkezhetnek ennek az ügyfélnek a nevében.',
+
+    'user_count' => '{count} felhasználó | {count} felhasználó',
     'unlink_user' => 'Felhasználó leválasztása',
     'users_empty_title' => 'Még nincsenek felhasználók',
     'users_empty_body' => 'Hívjon meg egy felhasználót, hogy ez az ügyfél bejelentkezhessen.',
diff --git a/packages/panel/resources/lang/mn/customers.php b/packages/panel/resources/lang/mn/customers.php
index 2c5504569d..340af54dec 100644
--- a/packages/panel/resources/lang/mn/customers.php
+++ b/packages/panel/resources/lang/mn/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Энэ харилцагчийн захиалгууд энд харагдана.',
 
     'users_intro' => 'Энэ харилцагчаар нэвтрэх боломжтой хүмүүс.',
+
+    'user_count' => '{count} хэрэглэгч | {count} хэрэглэгч',
     'unlink_user' => 'Хэрэглэгчийг салгах',
     'users_empty_title' => 'Хэрэглэгч алга байна',
     'users_empty_body' => 'Энэ харилцагч нэвтрэх боломжтой болгохын тулд хэрэглэгч урина уу.',
diff --git a/packages/panel/resources/lang/nl/customers.php b/packages/panel/resources/lang/nl/customers.php
index aa253c86d4..9205334536 100644
--- a/packages/panel/resources/lang/nl/customers.php
+++ b/packages/panel/resources/lang/nl/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Bestellingen van deze klant verschijnen hier.',
 
     'users_intro' => 'Personen die kunnen inloggen als deze klant.',
+
+    'user_count' => '{count} gebruiker | {count} gebruikers',
     'unlink_user' => 'Gebruiker ontkoppelen',
     'users_empty_title' => 'Nog geen gebruikers',
     'users_empty_body' => 'Nodig een gebruiker uit zodat deze klant kan inloggen.',
diff --git a/packages/panel/resources/lang/pl/customers.php b/packages/panel/resources/lang/pl/customers.php
index 76bef5b7a6..dece65c453 100644
--- a/packages/panel/resources/lang/pl/customers.php
+++ b/packages/panel/resources/lang/pl/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Zamówienia tego klienta pojawią się tutaj.',
 
     'users_intro' => 'Osoby, które mogą logować się jako ten klient.',
+
+    'user_count' => '{count} użytkownik | {count} użytkowników',
     'unlink_user' => 'Odłącz użytkownika',
     'users_empty_title' => 'Brak użytkowników',
     'users_empty_body' => 'Zaproś użytkownika, aby ten klient mógł się zalogować.',
diff --git a/packages/panel/resources/lang/pt_BR/customers.php b/packages/panel/resources/lang/pt_BR/customers.php
index 58e1d71dd7..a69a2117bf 100644
--- a/packages/panel/resources/lang/pt_BR/customers.php
+++ b/packages/panel/resources/lang/pt_BR/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Os pedidos deste cliente aparecerão aqui.',
 
     'users_intro' => 'Pessoas que podem entrar como esse cliente.',
+
+    'user_count' => '{count} usuário | {count} usuários',
     'unlink_user' => 'Desvincular usuário',
     'users_empty_title' => 'Nenhum usuário ainda',
     'users_empty_body' => 'Convide um usuário para que esse cliente possa entrar.',
diff --git a/packages/panel/resources/lang/ro/customers.php b/packages/panel/resources/lang/ro/customers.php
index 398a71e122..1978fb40fc 100644
--- a/packages/panel/resources/lang/ro/customers.php
+++ b/packages/panel/resources/lang/ro/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Comenzile acestui client vor apărea aici.',
 
     'users_intro' => 'Persoanele care se pot conecta ca acest client.',
+
+    'user_count' => '{count} utilizator | {count} utilizatori',
     'unlink_user' => 'Dezasociază utilizatorul',
     'users_empty_title' => 'Niciun utilizator încă',
     'users_empty_body' => 'Invită un utilizator pentru ca acest client să se poată conecta.',
diff --git a/packages/panel/resources/lang/tr/customers.php b/packages/panel/resources/lang/tr/customers.php
index 2bce6348db..2e86820ebb 100644
--- a/packages/panel/resources/lang/tr/customers.php
+++ b/packages/panel/resources/lang/tr/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Bu müşterinin siparişleri burada görünecek.',
 
     'users_intro' => 'Bu müşteri olarak giriş yapabilecek kişiler.',
+
+    'user_count' => '{count} kullanıcı | {count} kullanıcı',
     'unlink_user' => 'Kullanıcı bağlantısını kaldır',
     'users_empty_title' => 'Henüz kullanıcı yok',
     'users_empty_body' => 'Bu müşterinin giriş yapabilmesi için bir kullanıcı davet edin.',
diff --git a/packages/panel/resources/lang/vi/customers.php b/packages/panel/resources/lang/vi/customers.php
index 9c98cc802d..5e828e8902 100644
--- a/packages/panel/resources/lang/vi/customers.php
+++ b/packages/panel/resources/lang/vi/customers.php
@@ -95,6 +95,8 @@
     'orders_empty_body' => 'Đơn hàng của khách này sẽ hiển thị ở đây.',
 
     'users_intro' => 'Những người có thể đăng nhập với tư cách là khách hàng này.',
+
+    'user_count' => '{count} người dùng | {count} người dùng',
     'unlink_user' => 'Hủy liên kết người dùng',
     'users_empty_title' => 'Chưa có người dùng nào',
     'users_empty_body' => 'Mời một người dùng để khách hàng này có thể đăng nhập.',

From d42c8032b635db756f806686ac13a903d5a2bd47 Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Thu, 16 Jul 2026 20:54:26 +0100
Subject: [PATCH 05/19] Label customer notes as "Admin notes"

The sidebar card, edit action, empty state, and flash now say "Admin
notes" across all 16 locales so the field's audience is explicit. The
customers.notes column and lang keys are unchanged.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 packages/panel/resources/lang/ar/customers.php      | 8 ++++----
 packages/panel/resources/lang/bg/customers.php      | 8 ++++----
 packages/panel/resources/lang/de/customers.php      | 8 ++++----
 packages/panel/resources/lang/en/customers.php      | 8 ++++----
 packages/panel/resources/lang/es/customers.php      | 8 ++++----
 packages/panel/resources/lang/fa/customers.php      | 8 ++++----
 packages/panel/resources/lang/fr/customers.php      | 8 ++++----
 packages/panel/resources/lang/hr/customers.php      | 8 ++++----
 packages/panel/resources/lang/hu/customers.php      | 8 ++++----
 packages/panel/resources/lang/mn/customers.php      | 8 ++++----
 packages/panel/resources/lang/nl/customers.php      | 8 ++++----
 packages/panel/resources/lang/pl/customers.php      | 8 ++++----
 packages/panel/resources/lang/pt_BR/customers.php   | 8 ++++----
 packages/panel/resources/lang/ro/customers.php      | 8 ++++----
 packages/panel/resources/lang/tr/customers.php      | 8 ++++----
 packages/panel/resources/lang/vi/customers.php      | 8 ++++----
 tests/panel/Feature/Customers/CustomerNotesTest.php | 2 +-
 17 files changed, 65 insertions(+), 65 deletions(-)

diff --git a/packages/panel/resources/lang/ar/customers.php b/packages/panel/resources/lang/ar/customers.php
index 9231283165..cd1d9e801c 100644
--- a/packages/panel/resources/lang/ar/customers.php
+++ b/packages/panel/resources/lang/ar/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'متوسط الطلب',
     'stat_latest_order' => 'آخر طلب',
 
-    'notes' => 'ملاحظات',
-    'notes_empty' => 'لا توجد ملاحظات بعد.',
-    'edit_notes' => 'تعديل الملاحظات',
+    'notes' => 'ملاحظات الإدارة',
+    'notes_empty' => 'لا توجد ملاحظات إدارية بعد.',
+    'edit_notes' => 'تعديل ملاحظات الإدارة',
 
     'confirm_delete_customer' => 'هل أنت متأكد من أنك تريد حذف هذا العميل؟',
     'confirm_delete_customer_title' => 'هل تريد حذف هذا العميل؟',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'تم حذف العنوان.',
     'flash_user_linked' => 'تم ربط المستخدم.',
     'flash_user_unlinked' => 'تم إلغاء ربط المستخدم.',
-    'flash_notes_updated' => 'تم تحديث الملاحظات.',
+    'flash_notes_updated' => 'تم تحديث ملاحظات الإدارة.',
 ];
diff --git a/packages/panel/resources/lang/bg/customers.php b/packages/panel/resources/lang/bg/customers.php
index 126ca7f607..cf0c0dbd85 100644
--- a/packages/panel/resources/lang/bg/customers.php
+++ b/packages/panel/resources/lang/bg/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Средна поръчка',
     'stat_latest_order' => 'Последна поръчка',
 
-    'notes' => 'Бележки',
-    'notes_empty' => 'Все още няма бележки.',
-    'edit_notes' => 'Редактиране на бележките',
+    'notes' => 'Административни бележки',
+    'notes_empty' => 'Все още няма административни бележки.',
+    'edit_notes' => 'Редактиране на административните бележки',
 
     'confirm_delete_customer' => 'Сигурни ли сте, че искате да изтриете този клиент?',
     'confirm_delete_customer_title' => 'Изтриване на този клиент?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'Адресът е изтрит.',
     'flash_user_linked' => 'Потребителят е свързан.',
     'flash_user_unlinked' => 'Връзката с потребителя е премахната.',
-    'flash_notes_updated' => 'Бележките са актуализирани.',
+    'flash_notes_updated' => 'Административните бележки са актуализирани.',
 ];
diff --git a/packages/panel/resources/lang/de/customers.php b/packages/panel/resources/lang/de/customers.php
index e462fbb0be..e176801d10 100644
--- a/packages/panel/resources/lang/de/customers.php
+++ b/packages/panel/resources/lang/de/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Ø Bestellwert',
     'stat_latest_order' => 'Letzte Bestellung',
 
-    'notes' => 'Notizen',
-    'notes_empty' => 'Noch keine Notizen.',
-    'edit_notes' => 'Notizen bearbeiten',
+    'notes' => 'Admin-Notizen',
+    'notes_empty' => 'Noch keine Admin-Notizen.',
+    'edit_notes' => 'Admin-Notizen bearbeiten',
 
     'confirm_delete_customer' => 'Möchten Sie diesen Kunden wirklich löschen?',
     'confirm_delete_customer_title' => 'Diesen Kunden löschen?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'Adresse gelöscht.',
     'flash_user_linked' => 'Benutzer verknüpft.',
     'flash_user_unlinked' => 'Benutzer getrennt.',
-    'flash_notes_updated' => 'Notizen aktualisiert.',
+    'flash_notes_updated' => 'Admin-Notizen aktualisiert.',
 ];
diff --git a/packages/panel/resources/lang/en/customers.php b/packages/panel/resources/lang/en/customers.php
index a521733af7..315678de01 100644
--- a/packages/panel/resources/lang/en/customers.php
+++ b/packages/panel/resources/lang/en/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Avg order',
     'stat_latest_order' => 'Latest order',
 
-    'notes' => 'Notes',
-    'notes_empty' => 'No notes yet.',
-    'edit_notes' => 'Edit notes',
+    'notes' => 'Admin notes',
+    'notes_empty' => 'No admin notes yet.',
+    'edit_notes' => 'Edit admin notes',
 
     'confirm_delete_customer' => 'Are you sure you want to delete this customer?',
     'confirm_delete_customer_title' => 'Delete this customer?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'Address deleted.',
     'flash_user_linked' => 'User linked.',
     'flash_user_unlinked' => 'User unlinked.',
-    'flash_notes_updated' => 'Notes updated.',
+    'flash_notes_updated' => 'Admin notes updated.',
 ];
diff --git a/packages/panel/resources/lang/es/customers.php b/packages/panel/resources/lang/es/customers.php
index 4729a05537..861fd61b61 100644
--- a/packages/panel/resources/lang/es/customers.php
+++ b/packages/panel/resources/lang/es/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Pedido medio',
     'stat_latest_order' => 'Último pedido',
 
-    'notes' => 'Notas',
-    'notes_empty' => 'Aún no hay notas.',
-    'edit_notes' => 'Editar notas',
+    'notes' => 'Notas de administración',
+    'notes_empty' => 'Aún no hay notas de administración.',
+    'edit_notes' => 'Editar notas de administración',
 
     'confirm_delete_customer' => '¿Estás seguro de que quieres eliminar este cliente?',
     'confirm_delete_customer_title' => '¿Eliminar este cliente?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'Dirección eliminada.',
     'flash_user_linked' => 'Usuario vinculado.',
     'flash_user_unlinked' => 'Usuario desvinculado.',
-    'flash_notes_updated' => 'Notas actualizadas.',
+    'flash_notes_updated' => 'Notas de administración actualizadas.',
 ];
diff --git a/packages/panel/resources/lang/fa/customers.php b/packages/panel/resources/lang/fa/customers.php
index 8fc802ecd9..2409222426 100644
--- a/packages/panel/resources/lang/fa/customers.php
+++ b/packages/panel/resources/lang/fa/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'میانگین سفارش',
     'stat_latest_order' => 'آخرین سفارش',
 
-    'notes' => 'یادداشت‌ها',
-    'notes_empty' => 'هنوز یادداشتی وجود ندارد.',
-    'edit_notes' => 'ویرایش یادداشت‌ها',
+    'notes' => 'یادداشت‌های مدیریتی',
+    'notes_empty' => 'هنوز یادداشت مدیریتی وجود ندارد.',
+    'edit_notes' => 'ویرایش یادداشت‌های مدیریتی',
 
     'confirm_delete_customer' => 'آیا مطمئن هستید که می‌خواهید این مشتری را حذف کنید؟',
     'confirm_delete_customer_title' => 'این مشتری حذف شود؟',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'آدرس حذف شد.',
     'flash_user_linked' => 'کاربر پیوند داده شد.',
     'flash_user_unlinked' => 'پیوند کاربر قطع شد.',
-    'flash_notes_updated' => 'یادداشت‌ها به‌روزرسانی شد.',
+    'flash_notes_updated' => 'یادداشت‌های مدیریتی به‌روزرسانی شد.',
 ];
diff --git a/packages/panel/resources/lang/fr/customers.php b/packages/panel/resources/lang/fr/customers.php
index a34ad58dcd..d42b097cea 100644
--- a/packages/panel/resources/lang/fr/customers.php
+++ b/packages/panel/resources/lang/fr/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Panier moyen',
     'stat_latest_order' => 'Dernière commande',
 
-    'notes' => 'Notes',
-    'notes_empty' => 'Aucune note pour le moment.',
-    'edit_notes' => 'Modifier les notes',
+    'notes' => 'Notes admin',
+    'notes_empty' => 'Aucune note admin pour le moment.',
+    'edit_notes' => 'Modifier les notes admin',
 
     'confirm_delete_customer' => 'Êtes-vous sûr de vouloir supprimer ce client ?',
     'confirm_delete_customer_title' => 'Supprimer ce client ?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'Adresse supprimée.',
     'flash_user_linked' => 'Utilisateur associé.',
     'flash_user_unlinked' => 'Utilisateur dissocié.',
-    'flash_notes_updated' => 'Notes mises à jour.',
+    'flash_notes_updated' => 'Notes admin mises à jour.',
 ];
diff --git a/packages/panel/resources/lang/hr/customers.php b/packages/panel/resources/lang/hr/customers.php
index 60e72ddc7c..02c879df8b 100644
--- a/packages/panel/resources/lang/hr/customers.php
+++ b/packages/panel/resources/lang/hr/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Prosj. narudžba',
     'stat_latest_order' => 'Zadnja narudžba',
 
-    'notes' => 'Bilješke',
-    'notes_empty' => 'Još nema bilješki.',
-    'edit_notes' => 'Uredi bilješke',
+    'notes' => 'Administratorske bilješke',
+    'notes_empty' => 'Još nema administratorskih bilješki.',
+    'edit_notes' => 'Uredi administratorske bilješke',
 
     'confirm_delete_customer' => 'Jeste li sigurni da želite izbrisati ovog kupca?',
     'confirm_delete_customer_title' => 'Izbrisati ovog kupca?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'Adresa je izbrisana.',
     'flash_user_linked' => 'Korisnik je povezan.',
     'flash_user_unlinked' => 'Korisnik je odspojen.',
-    'flash_notes_updated' => 'Bilješke ažurirane.',
+    'flash_notes_updated' => 'Administratorske bilješke ažurirane.',
 ];
diff --git a/packages/panel/resources/lang/hu/customers.php b/packages/panel/resources/lang/hu/customers.php
index 1d6fdb5a96..7829a02c91 100644
--- a/packages/panel/resources/lang/hu/customers.php
+++ b/packages/panel/resources/lang/hu/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Átl. rendelés',
     'stat_latest_order' => 'Legutóbbi rendelés',
 
-    'notes' => 'Jegyzetek',
-    'notes_empty' => 'Még nincs jegyzet.',
-    'edit_notes' => 'Jegyzetek szerkesztése',
+    'notes' => 'Admin jegyzetek',
+    'notes_empty' => 'Még nincs admin jegyzet.',
+    'edit_notes' => 'Admin jegyzetek szerkesztése',
 
     'confirm_delete_customer' => 'Biztosan törli ezt az ügyfelet?',
     'confirm_delete_customer_title' => 'Törli ezt az ügyfelet?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'A cím törölve.',
     'flash_user_linked' => 'A felhasználó összekapcsolva.',
     'flash_user_unlinked' => 'A felhasználó leválasztva.',
-    'flash_notes_updated' => 'Jegyzetek frissítve.',
+    'flash_notes_updated' => 'Admin jegyzetek frissítve.',
 ];
diff --git a/packages/panel/resources/lang/mn/customers.php b/packages/panel/resources/lang/mn/customers.php
index 340af54dec..3b4f15eb03 100644
--- a/packages/panel/resources/lang/mn/customers.php
+++ b/packages/panel/resources/lang/mn/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Дундаж захиалга',
     'stat_latest_order' => 'Сүүлийн захиалга',
 
-    'notes' => 'Тэмдэглэл',
-    'notes_empty' => 'Одоогоор тэмдэглэл алга.',
-    'edit_notes' => 'Тэмдэглэл засах',
+    'notes' => 'Админ тэмдэглэл',
+    'notes_empty' => 'Одоогоор админ тэмдэглэл алга.',
+    'edit_notes' => 'Админ тэмдэглэл засах',
 
     'confirm_delete_customer' => 'Та энэ харилцагчийг устгахдаа итгэлтэй байна уу?',
     'confirm_delete_customer_title' => 'Энэ харилцагчийг устгах уу?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'Хаяг устгагдлаа.',
     'flash_user_linked' => 'Хэрэглэгч холбогдлоо.',
     'flash_user_unlinked' => 'Хэрэглэгчийн холбоос тасаллаа.',
-    'flash_notes_updated' => 'Тэмдэглэл шинэчлэгдлээ.',
+    'flash_notes_updated' => 'Админ тэмдэглэл шинэчлэгдлээ.',
 ];
diff --git a/packages/panel/resources/lang/nl/customers.php b/packages/panel/resources/lang/nl/customers.php
index 9205334536..85468b6ccb 100644
--- a/packages/panel/resources/lang/nl/customers.php
+++ b/packages/panel/resources/lang/nl/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Gem. bestelling',
     'stat_latest_order' => 'Laatste bestelling',
 
-    'notes' => 'Notities',
-    'notes_empty' => 'Nog geen notities.',
-    'edit_notes' => 'Notities bewerken',
+    'notes' => 'Adminnotities',
+    'notes_empty' => 'Nog geen adminnotities.',
+    'edit_notes' => 'Adminnotities bewerken',
 
     'confirm_delete_customer' => 'Weet je zeker dat je deze klant wilt verwijderen?',
     'confirm_delete_customer_title' => 'Deze klant verwijderen?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'Adres verwijderd.',
     'flash_user_linked' => 'Gebruiker gekoppeld.',
     'flash_user_unlinked' => 'Gebruiker ontkoppeld.',
-    'flash_notes_updated' => 'Notities bijgewerkt.',
+    'flash_notes_updated' => 'Adminnotities bijgewerkt.',
 ];
diff --git a/packages/panel/resources/lang/pl/customers.php b/packages/panel/resources/lang/pl/customers.php
index dece65c453..357f0a4423 100644
--- a/packages/panel/resources/lang/pl/customers.php
+++ b/packages/panel/resources/lang/pl/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Śr. zamówienie',
     'stat_latest_order' => 'Ostatnie zamówienie',
 
-    'notes' => 'Notatki',
-    'notes_empty' => 'Brak notatek.',
-    'edit_notes' => 'Edytuj notatki',
+    'notes' => 'Notatki administracyjne',
+    'notes_empty' => 'Brak notatek administracyjnych.',
+    'edit_notes' => 'Edytuj notatki administracyjne',
 
     'confirm_delete_customer' => 'Czy na pewno chcesz usunąć tego klienta?',
     'confirm_delete_customer_title' => 'Usunąć tego klienta?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'Adres usunięty.',
     'flash_user_linked' => 'Użytkownik połączony.',
     'flash_user_unlinked' => 'Użytkownik odłączony.',
-    'flash_notes_updated' => 'Notatki zaktualizowane.',
+    'flash_notes_updated' => 'Notatki administracyjne zaktualizowane.',
 ];
diff --git a/packages/panel/resources/lang/pt_BR/customers.php b/packages/panel/resources/lang/pt_BR/customers.php
index a69a2117bf..44a736db66 100644
--- a/packages/panel/resources/lang/pt_BR/customers.php
+++ b/packages/panel/resources/lang/pt_BR/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Pedido médio',
     'stat_latest_order' => 'Último pedido',
 
-    'notes' => 'Notas',
-    'notes_empty' => 'Nenhuma nota ainda.',
-    'edit_notes' => 'Editar notas',
+    'notes' => 'Notas administrativas',
+    'notes_empty' => 'Nenhuma nota administrativa ainda.',
+    'edit_notes' => 'Editar notas administrativas',
 
     'confirm_delete_customer' => 'Tem certeza de que deseja excluir este cliente?',
     'confirm_delete_customer_title' => 'Excluir este cliente?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'Endereço excluído.',
     'flash_user_linked' => 'Usuário vinculado.',
     'flash_user_unlinked' => 'Usuário desvinculado.',
-    'flash_notes_updated' => 'Notas atualizadas.',
+    'flash_notes_updated' => 'Notas administrativas atualizadas.',
 ];
diff --git a/packages/panel/resources/lang/ro/customers.php b/packages/panel/resources/lang/ro/customers.php
index 1978fb40fc..d3f52432ff 100644
--- a/packages/panel/resources/lang/ro/customers.php
+++ b/packages/panel/resources/lang/ro/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Comandă medie',
     'stat_latest_order' => 'Ultima comandă',
 
-    'notes' => 'Notițe',
-    'notes_empty' => 'Nicio notiță încă.',
-    'edit_notes' => 'Editează notițele',
+    'notes' => 'Notițe administrative',
+    'notes_empty' => 'Nicio notiță administrativă încă.',
+    'edit_notes' => 'Editează notițele administrative',
 
     'confirm_delete_customer' => 'Ești sigur că vrei să ștergi acest client?',
     'confirm_delete_customer_title' => 'Ștergi acest client?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'Adresă ștearsă.',
     'flash_user_linked' => 'Utilizator asociat.',
     'flash_user_unlinked' => 'Utilizator dezasociat.',
-    'flash_notes_updated' => 'Notițe actualizate.',
+    'flash_notes_updated' => 'Notițe administrative actualizate.',
 ];
diff --git a/packages/panel/resources/lang/tr/customers.php b/packages/panel/resources/lang/tr/customers.php
index 2e86820ebb..cd6fc41567 100644
--- a/packages/panel/resources/lang/tr/customers.php
+++ b/packages/panel/resources/lang/tr/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Ort. sipariş',
     'stat_latest_order' => 'Son sipariş',
 
-    'notes' => 'Notlar',
-    'notes_empty' => 'Henüz not yok.',
-    'edit_notes' => 'Notları düzenle',
+    'notes' => 'Yönetici notları',
+    'notes_empty' => 'Henüz yönetici notu yok.',
+    'edit_notes' => 'Yönetici notlarını düzenle',
 
     'confirm_delete_customer' => 'Bu müşteriyi silmek istediğinizden emin misiniz?',
     'confirm_delete_customer_title' => 'Bu müşteri silinsin mi?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'Adres silindi.',
     'flash_user_linked' => 'Kullanıcı bağlandı.',
     'flash_user_unlinked' => 'Kullanıcı bağlantısı kaldırıldı.',
-    'flash_notes_updated' => 'Notlar güncellendi.',
+    'flash_notes_updated' => 'Yönetici notları güncellendi.',
 ];
diff --git a/packages/panel/resources/lang/vi/customers.php b/packages/panel/resources/lang/vi/customers.php
index 5e828e8902..6651e912c4 100644
--- a/packages/panel/resources/lang/vi/customers.php
+++ b/packages/panel/resources/lang/vi/customers.php
@@ -130,9 +130,9 @@
     'stat_avg_order' => 'Đơn trung bình',
     'stat_latest_order' => 'Đơn gần nhất',
 
-    'notes' => 'Ghi chú',
-    'notes_empty' => 'Chưa có ghi chú.',
-    'edit_notes' => 'Sửa ghi chú',
+    'notes' => 'Ghi chú quản trị',
+    'notes_empty' => 'Chưa có ghi chú quản trị.',
+    'edit_notes' => 'Sửa ghi chú quản trị',
 
     'confirm_delete_customer' => 'Bạn có chắc chắn muốn xóa khách hàng này không?',
     'confirm_delete_customer_title' => 'Xóa khách hàng này?',
@@ -150,5 +150,5 @@
     'flash_address_deleted' => 'Đã xóa địa chỉ.',
     'flash_user_linked' => 'Đã liên kết người dùng.',
     'flash_user_unlinked' => 'Đã hủy liên kết người dùng.',
-    'flash_notes_updated' => 'Đã cập nhật ghi chú.',
+    'flash_notes_updated' => 'Đã cập nhật ghi chú quản trị.',
 ];
diff --git a/tests/panel/Feature/Customers/CustomerNotesTest.php b/tests/panel/Feature/Customers/CustomerNotesTest.php
index 07b3c9a134..c8e8cef7bc 100644
--- a/tests/panel/Feature/Customers/CustomerNotesTest.php
+++ b/tests/panel/Feature/Customers/CustomerNotesTest.php
@@ -15,7 +15,7 @@
     $this->put(route('panel.customers.notes.update', $customer), [
         'notes' => 'Contact via email only; no marketing calls.',
     ])->assertRedirect()
-        ->assertSessionHas('success', 'Notes updated.');
+        ->assertSessionHas('success', 'Admin notes updated.');
 
     expect($customer->refresh()->notes)->toBe('Contact via email only; no marketing calls.');
 });

From 28e162df57bcf3fa5ed383e8406466106366f269 Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Thu, 16 Jul 2026 20:58:24 +0100
Subject: [PATCH 06/19] Rename customers.notes to admin_notes

Matches the "Admin notes" label: baseline migration column, model
property, notes request/controller field, edit page prop and form all
use admin_notes. Route names and lang keys are unchanged.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 ...26_01_01_000008_create_customers_table.php |  2 +-
 packages/core/src/Models/Customer.php         |  2 +-
 .../resources/js/pages/customers/Edit.vue     | 16 +++++++--------
 .../Customers/CustomerEditController.php      |  2 +-
 .../Customers/CustomerNotesRequest.php        |  2 +-
 .../Feature/Customers/CustomerNotesTest.php   | 20 +++++++++----------
 6 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/packages/core/database/migrations/2026_01_01_000008_create_customers_table.php b/packages/core/database/migrations/2026_01_01_000008_create_customers_table.php
index 1cefb594d3..3aafff5c18 100644
--- a/packages/core/database/migrations/2026_01_01_000008_create_customers_table.php
+++ b/packages/core/database/migrations/2026_01_01_000008_create_customers_table.php
@@ -20,7 +20,7 @@ public function up(): void
             $table->timestamps();
             $table->jsonb('attribute_data')->nullable();
             $table->string('account_ref')->nullable()->index();
-            $table->text('notes')->nullable();
+            $table->text('admin_notes')->nullable();
         });
     }
 
diff --git a/packages/core/src/Models/Customer.php b/packages/core/src/Models/Customer.php
index d66becebef..76fea4e54e 100644
--- a/packages/core/src/Models/Customer.php
+++ b/packages/core/src/Models/Customer.php
@@ -26,7 +26,7 @@
  * @property ?string $company_name
  * @property ?string $tax_identifier
  * @property ?string $account_ref
- * @property ?string $notes
+ * @property ?string $admin_notes
  * @property ?array $attribute_data
  * @property ?array $meta
  * @property ?Carbon $created_at
diff --git a/packages/panel/resources/js/pages/customers/Edit.vue b/packages/panel/resources/js/pages/customers/Edit.vue
index bcea03e896..c18d812fa9 100644
--- a/packages/panel/resources/js/pages/customers/Edit.vue
+++ b/packages/panel/resources/js/pages/customers/Edit.vue
@@ -82,7 +82,7 @@ const props = defineProps<{
         company_name: string | null;
         tax_identifier: string | null;
         account_ref: string | null;
-        notes: string | null;
+        admin_notes: string | null;
         created_at: string;
         customer_groups: OptionItem[];
     };
@@ -402,13 +402,13 @@ const timelineEvents = computed(() =>
         actor: activity.causer_name ?? '',
     })));
 
-// Notes side card: view by default, pencil toggles an inline editor.
+// Admin notes side card: view by default, pencil toggles an inline editor.
 const notesEditing = ref(false);
-const notesForm = useForm({ notes: props.customer.notes ?? '' });
+const notesForm = useForm({ admin_notes: props.customer.admin_notes ?? '' });
 
 const startEditNotes = (): void => {
     notesForm.clearErrors();
-    notesForm.notes = props.customer.notes ?? '';
+    notesForm.admin_notes = props.customer.admin_notes ?? '';
     notesEditing.value = true;
 };
 
@@ -780,19 +780,19 @@ const tabDefs = computed(() => [
                                 </template>
                                 <form v-if="notesEditing" class="flex flex-col gap-2" @submit.prevent="submitNotes">
                                     <Textarea
-                                        v-model="notesForm.notes"
+                                        v-model="notesForm.admin_notes"
                                         :rows="4"
                                         :aria-label="t('customers.notes')"
-                                        :invalid="!!notesForm.errors.notes"
+                                        :invalid="!!notesForm.errors.admin_notes"
                                     />
-                                    <div v-if="notesForm.errors.notes" class="text-[11px] text-danger">{{ notesForm.errors.notes }}</div>
+                                    <div v-if="notesForm.errors.admin_notes" class="text-[11px] text-danger">{{ notesForm.errors.admin_notes }}</div>
                                     <div class="flex gap-2">
                                         <Button type="submit" variant="primary" size="sm" :disabled="notesForm.processing">{{ t('common.save_changes') }}</Button>
                                         <Button type="button" size="sm" @click="notesEditing = false">{{ t('common.cancel') }}</Button>
                                     </div>
                                 </form>
                                 <template v-else>
-                                    <p v-if="customer.notes" class="m-0 text-[12.5px] text-ink-700 leading-[1.55] whitespace-pre-line">{{ customer.notes }}</p>
+                                    <p v-if="customer.admin_notes" class="m-0 text-[12.5px] text-ink-700 leading-[1.55] whitespace-pre-line">{{ customer.admin_notes }}</p>
                                     <p v-else class="m-0 text-[12px] text-ink-500 italic">{{ t('customers.notes_empty') }}</p>
                                 </template>
                             </SideCard>
diff --git a/packages/panel/src/Http/Controllers/Customers/CustomerEditController.php b/packages/panel/src/Http/Controllers/Customers/CustomerEditController.php
index 20223bbfdd..9799d9fae5 100644
--- a/packages/panel/src/Http/Controllers/Customers/CustomerEditController.php
+++ b/packages/panel/src/Http/Controllers/Customers/CustomerEditController.php
@@ -112,7 +112,7 @@ public function edit(Customer $customer): Response
                 'company_name' => $customer->company_name,
                 'tax_identifier' => $customer->tax_identifier,
                 'account_ref' => $customer->account_ref,
-                'notes' => $customer->notes,
+                'admin_notes' => $customer->admin_notes,
                 'created_at' => $customer->created_at,
                 'customer_groups' => $customer->customerGroups->map(fn (CustomerGroup $group) => [
                     'id' => $group->id,
diff --git a/packages/panel/src/Http/Requests/Customers/CustomerNotesRequest.php b/packages/panel/src/Http/Requests/Customers/CustomerNotesRequest.php
index f6aeb8e980..c6603b2be0 100644
--- a/packages/panel/src/Http/Requests/Customers/CustomerNotesRequest.php
+++ b/packages/panel/src/Http/Requests/Customers/CustomerNotesRequest.php
@@ -12,7 +12,7 @@ class CustomerNotesRequest extends FormRequest
     public function rules(): array
     {
         return [
-            'notes' => ['present', 'nullable', 'string', 'max:65535'],
+            'admin_notes' => ['present', 'nullable', 'string', 'max:65535'],
         ];
     }
 }
diff --git a/tests/panel/Feature/Customers/CustomerNotesTest.php b/tests/panel/Feature/Customers/CustomerNotesTest.php
index c8e8cef7bc..81a61a3b10 100644
--- a/tests/panel/Feature/Customers/CustomerNotesTest.php
+++ b/tests/panel/Feature/Customers/CustomerNotesTest.php
@@ -10,24 +10,24 @@
 it('updates the customer notes', function () {
     $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
 
-    $customer = Customer::factory()->create(['notes' => null]);
+    $customer = Customer::factory()->create(['admin_notes' => null]);
 
     $this->put(route('panel.customers.notes.update', $customer), [
-        'notes' => 'Contact via email only; no marketing calls.',
+        'admin_notes' => 'Contact via email only; no marketing calls.',
     ])->assertRedirect()
         ->assertSessionHas('success', 'Admin notes updated.');
 
-    expect($customer->refresh()->notes)->toBe('Contact via email only; no marketing calls.');
+    expect($customer->refresh()->admin_notes)->toBe('Contact via email only; no marketing calls.');
 });
 
 it('clears the customer notes when null is given', function () {
     $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
 
-    $customer = Customer::factory()->create(['notes' => 'Old note.']);
+    $customer = Customer::factory()->create(['admin_notes' => 'Old note.']);
 
-    $this->put(route('panel.customers.notes.update', $customer), ['notes' => null]);
+    $this->put(route('panel.customers.notes.update', $customer), ['admin_notes' => null]);
 
-    expect($customer->refresh()->notes)->toBeNull();
+    expect($customer->refresh()->admin_notes)->toBeNull();
 });
 
 it('leaves customer group membership untouched when updating notes', function () {
@@ -37,7 +37,7 @@
     $group = CustomerGroup::factory()->create();
     $customer->customerGroups()->sync([$group->id]);
 
-    $this->put(route('panel.customers.notes.update', $customer), ['notes' => 'A note.']);
+    $this->put(route('panel.customers.notes.update', $customer), ['admin_notes' => 'A note.']);
 
     expect($customer->customerGroups()->get()->pluck('id')->all())->toBe([$group->id]);
 });
@@ -48,14 +48,14 @@
     $customer = Customer::factory()->create();
 
     $this->put(route('panel.customers.notes.update', $customer), [])
-        ->assertSessionHasErrors(['notes']);
+        ->assertSessionHasErrors(['admin_notes']);
 });
 
 it('exposes the notes on the edit page', function () {
     $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
 
-    $customer = Customer::factory()->create(['notes' => 'VIP customer.']);
+    $customer = Customer::factory()->create(['admin_notes' => 'VIP customer.']);
 
     $this->get(route('panel.customers.edit', $customer))
-        ->assertInertia(fn ($page) => $page->where('customer.notes', 'VIP customer.'));
+        ->assertInertia(fn ($page) => $page->where('customer.admin_notes', 'VIP customer.'));
 });

From 5fee73ff6684bca8acf45774a9f2f9dcf5139d96 Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Thu, 16 Jul 2026 21:05:54 +0100
Subject: [PATCH 07/19] Spec 0050: panel order-value chart and public charting
 component

Draft spec for a dependency-free TimeSeriesChart on the add-on surface
and an order-value-over-time card on the customer edit page (12m
default, zoom to 3y/5y/10y via partial reloads).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 TODO.md                                 |   1 +
 specs/0050-panel-order-history-chart.md | 153 ++++++++++++++++++++++++
 2 files changed, 154 insertions(+)
 create mode 100644 specs/0050-panel-order-history-chart.md

diff --git a/TODO.md b/TODO.md
index 10ac37d58a..26171797d4 100644
--- a/TODO.md
+++ b/TODO.md
@@ -9,6 +9,7 @@ Items tagged _(judgement)_ are genuine line-calls worth revisiting.
 ## Outstanding
 
 - Inertia admin panel — new `lunarphp/panel` package: auth, extension points (navigation, slots, table columns, row/bulk/page actions with shared ordering), Customers CRUD, Channels settings (spec 0049)
+- Panel order-value chart on the customer edit page + `TimeSeriesChart` on the add-on surface (spec 0050)
 - Default professional customer notifications for the order lifecycle (spec 0036) _(judgement)_
 - Bulk order operations — goal-oriented bulk actions on the orders table (spec 0026)
 - Line-item refunds — refund specific lines/quantities via a dedicated refund page (spec 0028)
diff --git a/specs/0050-panel-order-history-chart.md b/specs/0050-panel-order-history-chart.md
new file mode 100644
index 0000000000..858e3c8785
--- /dev/null
+++ b/specs/0050-panel-order-history-chart.md
@@ -0,0 +1,153 @@
+# 0050 — Panel order-value chart and public charting component
+
+- Status: draft
+- Author: Glenn (via pairing session)
+- Created: 2026-07-16
+- TODO item: Panel order-value chart on the customer edit page + chart component on the add-on surface
+
+## Problem
+
+The customer edit page now shows lifetime stats (total spend, order count, average
+order, latest order) and an order-history list, but no temporal view. An admin
+cannot see *when* a customer's spend happened — whether they are a lapsed customer,
+a seasonal buyer, or growing — without reading the order list row by row.
+
+Separately, the panel has no charting primitive at all. Any page or add-on that
+wants a chart today would have to hand-roll SVG or bundle its own charting library,
+which would neither match the panel's design language nor stay consistent across
+add-ons.
+
+## Proposal
+
+Two parts: a generic chart component on the panel's public component surface, and
+an order-value-over-time card on the customer edit page built with it.
+
+### 1. `TimeSeriesChart` component
+
+A dependency-free inline-SVG area/line chart in
+`packages/panel/resources/js/components/TimeSeriesChart.vue`. No charting library:
+the need is one numeric series over ordered time buckets, which is ~200 lines of
+SVG and keeps the public surface free of a new npm dependency.
+
+```ts
+export interface ChartPoint {
+    label: string;      // bucket label, e.g. "Aug 25"
+    value: number;      // numeric value in major units, drives the geometry
+    display?: string;   // preformatted value for tooltip/ticks, e.g. "£125.50"
+}
+
+defineProps<{
+    points: ChartPoint[];
+    height?: number;                          // px, default 180
+    formatValue?: (value: number) => string;  // y-tick fallback when display is absent
+    ariaLabel: string;                        // required; the SVG renders role="img"
+}>();
+```
+
+Behaviour:
+
+- Area fill + line stroke using the panel theme tokens (sage line, soft fill,
+  hairline gridlines, ink-500 labels) so it reads as part of the existing design
+  system; visual detailing follows the repo's dataviz guidance during
+  implementation.
+- Hover: nearest-point dot plus a tooltip showing `label` and `display`.
+- A handful of y-axis gridlines with formatted tick labels; x labels thinned to
+  fit the available width.
+- Zero-value series still renders (flat baseline), empty `points` renders nothing —
+  callers decide their empty state.
+- Accessible: `role="img"` with the required `ariaLabel`; pointer interaction is
+  progressive enhancement only.
+
+Public surface: exported from `resources/js/ui.ts` under a new "Charts" group,
+mirrored in the `@lunarphp/panel` package's `index.js` runtime fallback list, and
+its type lands in `dist/ui.d.ts` via the existing `npm run build:types`. Add-ons
+then import it like any other panel component. `KpiCard` remains the primitive for
+single-number tiles; `TimeSeriesChart` complements it.
+
+### 2. Order value over time on the customer edit page
+
+A full-width card at the top of the edit page's main column (above Personal
+details), titled from a new `customers.chart_title` key, containing the chart and
+a range switcher.
+
+Server side, `CustomerEditController::edit()` gains an `orderChart` prop:
+
+```php
+'orderChart' => [
+    'range' => '12m',
+    'buckets' => [
+        ['label' => 'Aug 25', 'value' => 125.50, 'display' => '£125.50'],
+        // ... one entry per bucket, zero-filled
+    ],
+],
+```
+
+- Buckets cover placed orders only, valued in the default currency via the
+  exchange rate captured at placement — the same basis as the lifetime stats, so
+  the chart and the stats card always agree.
+- Ranges via a validated `chart_range` query param:
+
+  | range | window          | bucket    | points |
+  |-------|-----------------|-----------|--------|
+  | `12m` | last 12 months  | month     | 12     |
+  | `3y`  | last 3 years    | quarter   | 12     |
+  | `5y`  | last 5 years    | quarter   | 20     |
+  | `10y` | last 10 years   | year      | 10     |
+
+  `12m` is the default; unknown values fall back to it.
+- Bucketing happens in PHP over the customer's placed orders in the window
+  (`placed_at`, `total`, `exchange_rate` only). A single customer's order count is
+  small; this avoids cross-database date-formatting SQL. Revisit with SQL grouping
+  only if it ever shows up in profiles.
+- Client side, the range switcher performs a partial Inertia reload
+  (`only: ['orderChart']`, preserve state/scroll) with the `chart_range` param, so
+  zooming never re-fetches the rest of the page.
+
+Translations: chart title, the four range labels, and the chart empty state, added
+across all 16 locales.
+
+## Alternatives considered
+
+- **Bundle a charting library (chart.js / ApexCharts / unovis).** Rejected: adds a
+  runtime dependency to the public add-on surface and the panel bundle, brings its
+  own theming system that fights the panel tokens, and we need a fraction of its
+  features.
+- **Reinstate the prototype's top stat strip.** Rejected earlier in review — it
+  duplicated the sidebar Lifetime stats. The chart answers the question the strip
+  could not (when), without duplicating totals.
+- **Bucket client-side from the `orders` prop.** Rejected: that prop is capped at
+  the latest 25 orders for the history tab; the chart needs the full window.
+- **Do nothing.** Leaves the "when" question unanswered and leaves add-ons to
+  invent their own charts.
+
+## Migration impact
+
+- Database migrations: none.
+- Public contract surface: additive only — new `TimeSeriesChart` export on the
+  add-on surface; new `orderChart` page prop and `chart_range` query param.
+- v1.x upgrade path: not applicable (panel is new in v2).
+- Translations: new keys mirrored across the 16 locales.
+- Filament admin: none.
+
+## Open questions
+
+- Range set: is `12m / 3y / 5y / 10y` the right ladder, or should an `all` range
+  (yearly buckets from first order) be included?
+- Does the card belong on a future Orders dashboard too? Nothing blocks it — the
+  component is generic — but placement there is out of scope here.
+
+## References
+
+- [[0049-inertia-panel]] — panel foundation, extension surface, and the customers
+  section this builds on.
+- Panel CLAUDE.md — `ui.ts` as the source of truth for the add-on surface.
+
+## Implementation plan
+
+- [ ] Slice 1 — `TimeSeriesChart` component with vitest coverage; export via
+  `ui.ts`, mirror in `@lunarphp/panel` `index.js`, regenerate types.
+- [ ] Slice 2 — `orderChart` data on `CustomerEditController` (range param,
+  zero-filled buckets, default-currency conversion) with Pest coverage; edit-page
+  card with range switcher and partial reload.
+- [ ] Slice 3 — translations across the 16 locales; update spec 0049's screen
+  description; example add-on gains a small chart usage to prove the surface.

From 76b10573b4ad92c461593ba4f18ee0fcf2ba5947 Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Thu, 16 Jul 2026 22:29:03 +0100
Subject: [PATCH 08/19] Add TimeSeriesChart to the panel surface and an
 order-value chart to customer edit (spec 0050)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- TimeSeriesChart: dependency-free SVG area/line chart styled with the
  panel theme tokens — recessive halved gridlines, thinned x labels,
  crosshair hover tooltip (value leads), keyboard navigation, required
  aria label. Exported via ui.ts, mirrored in @lunarphp/panel index.js,
  types regenerated; the example add-on renders one to prove the
  public surface.
- Customer edit gains an "Order value" card above the details form:
  placed-order value bucketed over a validated chart_range (12m
  monthly default; 3y/5y quarterly; 10y yearly), zero-filled and
  valued in the default currency on the same basis as the lifetime
  stats. The range switcher partial-reloads only the chart prop and
  holds the previous render at reduced opacity while in flight.
- Translations for the chart card across all 16 locales.
- Spec 0050 accepted with all slices landed.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../resources/js/pages/Widgets/Index.vue      |  20 +-
 .../js/components/TimeSeriesChart.test.ts     |  69 +++++
 .../js/components/TimeSeriesChart.vue         | 242 ++++++++++++++++++
 .../resources/js/pages/customers/Edit.vue     |  54 +++-
 packages/panel/resources/js/ui.ts             |   3 +
 .../panel/resources/lang/ar/customers.php     |   7 +
 .../panel/resources/lang/bg/customers.php     |   7 +
 .../panel/resources/lang/de/customers.php     |   7 +
 .../panel/resources/lang/en/customers.php     |   7 +
 .../panel/resources/lang/es/customers.php     |   7 +
 .../panel/resources/lang/fa/customers.php     |   7 +
 .../panel/resources/lang/fr/customers.php     |   7 +
 .../panel/resources/lang/hr/customers.php     |   7 +
 .../panel/resources/lang/hu/customers.php     |   7 +
 .../panel/resources/lang/mn/customers.php     |   7 +
 .../panel/resources/lang/nl/customers.php     |   7 +
 .../panel/resources/lang/pl/customers.php     |   7 +
 .../panel/resources/lang/pt_BR/customers.php  |   7 +
 .../panel/resources/lang/ro/customers.php     |   7 +
 .../panel/resources/lang/tr/customers.php     |   7 +
 .../panel/resources/lang/vi/customers.php     |   7 +
 .../panel/resources/panel-package/index.js    |   3 +
 .../Customers/CustomerEditController.php      |  88 ++++++-
 specs/0050-panel-order-history-chart.md       |   8 +-
 .../Feature/Customers/CustomerEditTest.php    |  52 ++++
 25 files changed, 644 insertions(+), 7 deletions(-)
 create mode 100644 packages/panel/resources/js/components/TimeSeriesChart.test.ts
 create mode 100644 packages/panel/resources/js/components/TimeSeriesChart.vue

diff --git a/packages/panel-addon-example/resources/js/pages/Widgets/Index.vue b/packages/panel-addon-example/resources/js/pages/Widgets/Index.vue
index 07a86434b0..65c405b8f4 100644
--- a/packages/panel-addon-example/resources/js/pages/Widgets/Index.vue
+++ b/packages/panel-addon-example/resources/js/pages/Widgets/Index.vue
@@ -12,7 +12,7 @@ import { computed } from 'vue';
 // under `example-addon::{group}` keys — served, cached and versioned by the
 // panel's translations endpoint like the panel's own strings.
 import { useI18n } from 'vue-i18n';
-import { Breadcrumbs, DataTable, PageHeader, PageZone, Button, SideCard, StatusBadge } from '@lunarphp/panel';
+import { Breadcrumbs, DataTable, PageHeader, PageZone, Button, SideCard, StatusBadge, TimeSeriesChart } from '@lunarphp/panel';
 
 defineProps<{
     message?: string;
@@ -43,6 +43,16 @@ const columns = [
 const rowActions = [
     { key: 'ping', label: 'Ping', icon: 'refresh', method: 'get', primary: false },
 ];
+
+// Static demo series for the panel's TimeSeriesChart, also on the public surface.
+const chartPoints = [
+    { label: 'Jan', value: 120, display: '£120.00' },
+    { label: 'Feb', value: 210, display: '£210.00' },
+    { label: 'Mar', value: 160, display: '£160.00' },
+    { label: 'Apr', value: 290, display: '£290.00' },
+    { label: 'May', value: 240, display: '£240.00' },
+    { label: 'Jun', value: 330, display: '£330.00' },
+];
 </script>
 
 <template>
@@ -99,6 +109,14 @@ const rowActions = [
                 </div>
             </SideCard>
 
+            <SideCard title="Charting from an add-on" class="mt-5 max-w-md">
+                <p class="text-[12.5px] text-ink-700 mb-2">
+                    The panel's <code>TimeSeriesChart</code> is on the same public
+                    surface, so add-ons can plot their own data.
+                </p>
+                <TimeSeriesChart :points="chartPoints" :height="140" ariaLabel="Example widget sales" />
+            </SideCard>
+
             <PageZone region="main" position="after" />
         </div>
     </div>
diff --git a/packages/panel/resources/js/components/TimeSeriesChart.test.ts b/packages/panel/resources/js/components/TimeSeriesChart.test.ts
new file mode 100644
index 0000000000..f09c77f9dc
--- /dev/null
+++ b/packages/panel/resources/js/components/TimeSeriesChart.test.ts
@@ -0,0 +1,69 @@
+import { describe, expect, it } from 'vitest';
+import { mount } from '@vue/test-utils';
+import TimeSeriesChart from './TimeSeriesChart.vue';
+
+const points = [
+    { label: 'Jan', value: 0 },
+    { label: 'Feb', value: 50, display: '£50.00' },
+    { label: 'Mar', value: 100, display: '£100.00' },
+];
+
+const mountChart = (overrides = {}) =>
+    mount(TimeSeriesChart, {
+        props: { points, width: 400, ariaLabel: 'Order value', ...overrides },
+    });
+
+describe('TimeSeriesChart', () => {
+    it('renders an accessible svg with a line and area for the series', () => {
+        const wrapper = mountChart();
+
+        const svg = wrapper.find('svg[role="img"]');
+        expect(svg.exists()).toBe(true);
+        expect(svg.attributes('aria-label')).toBe('Order value');
+
+        const paths = wrapper.findAll('path');
+        expect(paths).toHaveLength(2);
+        // Line path has one command per point.
+        expect(paths[1].attributes('d')!.split(/[ML]/).filter(Boolean)).toHaveLength(points.length);
+    });
+
+    it('renders nothing without points', () => {
+        const wrapper = mountChart({ points: [] });
+
+        expect(wrapper.find('svg').exists()).toBe(false);
+    });
+
+    it('renders x labels and formatted y ticks', () => {
+        const wrapper = mountChart({ formatValue: (value: number) => `£${value}` });
+
+        const text = wrapper.text();
+        expect(text).toContain('Jan');
+        expect(text).toContain('Mar');
+        expect(text).toContain('£100');
+    });
+
+    it('shows a tooltip via keyboard navigation with the display value leading', async () => {
+        const wrapper = mountChart();
+
+        await wrapper.find('[tabindex="0"]').trigger('keydown', { key: 'ArrowRight' });
+
+        expect(wrapper.find('[role="status"]').text()).toContain('Jan');
+
+        await wrapper.find('[tabindex="0"]').trigger('keydown', { key: 'ArrowRight' });
+        await wrapper.find('[tabindex="0"]').trigger('keydown', { key: 'ArrowRight' });
+
+        const tooltip = wrapper.find('[role="status"]');
+        expect(tooltip.text()).toContain('£100.00');
+        expect(tooltip.text()).toContain('Mar');
+
+        await wrapper.find('[tabindex="0"]').trigger('keydown', { key: 'Escape' });
+        expect(wrapper.find('[role="status"]').exists()).toBe(false);
+    });
+
+    it('scales a flat zero series without dividing by zero', () => {
+        const wrapper = mountChart({ points: [{ label: 'Jan', value: 0 }, { label: 'Feb', value: 0 }] });
+
+        expect(wrapper.find('svg').exists()).toBe(true);
+        expect(wrapper.findAll('path')[1].attributes('d')).not.toContain('NaN');
+    });
+});
diff --git a/packages/panel/resources/js/components/TimeSeriesChart.vue b/packages/panel/resources/js/components/TimeSeriesChart.vue
new file mode 100644
index 0000000000..000751cc33
--- /dev/null
+++ b/packages/panel/resources/js/components/TimeSeriesChart.vue
@@ -0,0 +1,242 @@
+<script setup lang="ts">
+import { computed, onBeforeUnmount, onMounted, ref } from 'vue';
+
+export interface ChartPoint {
+    label: string;
+    /** Numeric value in major units; drives the geometry. */
+    value: number;
+    /** Preformatted value for the tooltip (e.g. money); falls back to formatValue/compact. */
+    display?: string;
+}
+
+const props = withDefaults(
+    defineProps<{
+        points: ChartPoint[];
+        height?: number;
+        /** Fixed pixel width; when omitted the chart tracks its container. */
+        width?: number;
+        /** Formats y-axis tick values (and tooltip values without a display). */
+        formatValue?: (value: number) => string;
+        ariaLabel: string;
+    }>(),
+    { height: 180 },
+);
+
+// The chart tracks its container width so the SVG renders at real pixel size
+// (no preserveAspectRatio scaling, which would distort text).
+const container = ref<HTMLElement | null>(null);
+const measuredWidth = ref(0);
+let observer: ResizeObserver | undefined;
+
+onMounted(() => {
+    measuredWidth.value = container.value?.clientWidth ?? 0;
+
+    if (typeof ResizeObserver !== 'undefined' && container.value && !props.width) {
+        observer = new ResizeObserver((entries) => {
+            measuredWidth.value = entries[0]?.contentRect.width ?? measuredWidth.value;
+        });
+        observer.observe(container.value);
+    }
+});
+
+onBeforeUnmount(() => observer?.disconnect());
+
+const width = computed(() => props.width ?? measuredWidth.value);
+
+const margin = { top: 8, right: 8, bottom: 22, left: 48 };
+const innerWidth = computed(() => Math.max(0, width.value - margin.left - margin.right));
+const innerHeight = computed(() => Math.max(0, props.height - margin.top - margin.bottom));
+
+// Round the axis maximum up to a "nice" 1/2/2.5/5 step so ticks land on
+// readable values; a flat zero series still gets a scale.
+const axisMax = computed(() => {
+    const max = Math.max(...props.points.map((point) => point.value), 0);
+
+    if (max <= 0) {
+        return 1;
+    }
+
+    const power = Math.pow(10, Math.floor(Math.log10(max)));
+
+    for (const step of [1, 2, 2.5, 5, 10]) {
+        if (max <= step * power) {
+            return step * power;
+        }
+    }
+
+    return 10 * power;
+});
+
+const xAt = (index: number): number =>
+    props.points.length > 1 ? (index / (props.points.length - 1)) * innerWidth.value : innerWidth.value / 2;
+
+const yAt = (value: number): number => innerHeight.value - (value / axisMax.value) * innerHeight.value;
+
+const linePath = computed(() =>
+    props.points.map((point, i) => `${i === 0 ? 'M' : 'L'}${xAt(i).toFixed(1)},${yAt(point.value).toFixed(1)}`).join(' '));
+
+const areaPath = computed(() => {
+    if (!props.points.length) {
+        return '';
+    }
+
+    return `${linePath.value} L${xAt(props.points.length - 1).toFixed(1)},${innerHeight.value} L${xAt(0).toFixed(1)},${innerHeight.value} Z`;
+});
+
+const compact = (value: number): string =>
+    new Intl.NumberFormat(undefined, { notation: 'compact', maximumFractionDigits: 1 }).format(value);
+
+const tickLabel = (value: number): string => (props.formatValue ? props.formatValue(value) : compact(value));
+
+// Two gridlines plus the baseline keep the grid recessive, and halves of a
+// 1/2/2.5/5 axis maximum always land on readable values.
+const ticks = computed(() => [0.5, 1].map((fraction) => fraction * axisMax.value));
+
+// Thin x labels so they never collide; always keep first and last.
+const labelStep = computed(() => Math.max(1, Math.ceil(props.points.length / 8)));
+const showLabel = (index: number): boolean =>
+    index % labelStep.value === 0 || index === props.points.length - 1;
+
+// Hover/focus: a crosshair snaps to the nearest bucket; the same readout is
+// reachable by keyboard (arrow keys).
+const activeIndex = ref<number | null>(null);
+
+const indexFromClientX = (clientX: number): number => {
+    const rect = container.value?.getBoundingClientRect();
+
+    if (!rect || props.points.length === 0 || innerWidth.value === 0) {
+        return 0;
+    }
+
+    const position = (clientX - rect.left - margin.left) / innerWidth.value;
+
+    return Math.min(props.points.length - 1, Math.max(0, Math.round(position * (props.points.length - 1))));
+};
+
+const onPointerMove = (event: PointerEvent): void => {
+    activeIndex.value = indexFromClientX(event.clientX);
+};
+
+const onKeydown = (event: KeyboardEvent): void => {
+    if (event.key === 'ArrowRight' || event.key === 'ArrowLeft') {
+        event.preventDefault();
+        const delta = event.key === 'ArrowRight' ? 1 : -1;
+        const current = activeIndex.value ?? (delta === 1 ? -1 : props.points.length);
+        activeIndex.value = Math.min(props.points.length - 1, Math.max(0, current + delta));
+    } else if (event.key === 'Escape') {
+        activeIndex.value = null;
+    }
+};
+
+const activePoint = computed(() => (activeIndex.value === null ? null : props.points[activeIndex.value] ?? null));
+
+const activeDisplay = computed(() => {
+    const point = activePoint.value;
+
+    if (!point) {
+        return '';
+    }
+
+    return point.display ?? tickLabel(point.value);
+});
+
+// Keep the tooltip inside the chart bounds.
+const tooltipStyle = computed(() => {
+    if (activeIndex.value === null) {
+        return {};
+    }
+
+    const anchor = margin.left + xAt(activeIndex.value);
+
+    return {
+        left: `${Math.min(Math.max(anchor, 56), Math.max(width.value - 56, 56))}px`,
+        top: `${Math.max(margin.top + yAt(activePoint.value?.value ?? 0) - 12, 0)}px`,
+    };
+});
+</script>
+
+<template>
+    <div
+        v-if="points.length"
+        ref="container"
+        class="relative w-full select-none"
+        tabindex="0"
+        @pointermove="onPointerMove"
+        @pointerleave="activeIndex = null"
+        @keydown="onKeydown"
+        @blur="activeIndex = null"
+    >
+        <svg :width="width" :height="height" role="img" :aria-label="ariaLabel" class="block">
+            <g :transform="`translate(${margin.left},${margin.top})`">
+                <!-- Gridlines (recessive) + baseline -->
+                <line
+                    v-for="tick in ticks"
+                    :key="`grid-${tick}`"
+                    :x1="0"
+                    :x2="innerWidth"
+                    :y1="yAt(tick)"
+                    :y2="yAt(tick)"
+                    style="stroke: var(--color-line)"
+                />
+                <line :x1="0" :x2="innerWidth" :y1="innerHeight" :y2="innerHeight" style="stroke: var(--color-line-strong)" />
+
+                <!-- Y tick labels -->
+                <text
+                    v-for="tick in ticks"
+                    :key="`tick-${tick}`"
+                    :x="-8"
+                    :y="yAt(tick) + 3"
+                    text-anchor="end"
+                    class="text-[10px]"
+                    style="fill: var(--color-ink-500)"
+                >{{ tickLabel(tick) }}</text>
+
+                <!-- Series -->
+                <path :d="areaPath" style="fill: var(--color-sage-soft)" fill-opacity="0.6" />
+                <path :d="linePath" fill="none" style="stroke: var(--color-sage-ink)" stroke-width="2" stroke-linejoin="round" stroke-linecap="round" />
+
+                <!-- X labels (thinned) -->
+                <template v-for="(point, i) in points" :key="`label-${i}`">
+                    <text
+                        v-if="showLabel(i)"
+                        :x="xAt(i)"
+                        :y="innerHeight + 15"
+                        :text-anchor="i === 0 ? 'start' : i === points.length - 1 ? 'end' : 'middle'"
+                        class="text-[10px]"
+                        style="fill: var(--color-ink-500)"
+                    >{{ point.label }}</text>
+                </template>
+
+                <!-- Crosshair + active point -->
+                <template v-if="activeIndex !== null && activePoint">
+                    <line
+                        :x1="xAt(activeIndex)"
+                        :x2="xAt(activeIndex)"
+                        :y1="0"
+                        :y2="innerHeight"
+                        style="stroke: var(--color-ink-300)"
+                        stroke-dasharray="2,3"
+                    />
+                    <circle
+                        :cx="xAt(activeIndex)"
+                        :cy="yAt(activePoint.value)"
+                        r="4"
+                        style="fill: var(--color-sage-ink); stroke: var(--color-surface)"
+                        stroke-width="2"
+                    />
+                </template>
+            </g>
+        </svg>
+
+        <!-- Tooltip: the value leads, the bucket label follows. -->
+        <div
+            v-if="activeIndex !== null && activePoint"
+            class="pointer-events-none absolute -translate-x-1/2 -translate-y-full rounded-md border border-line bg-surface px-2 py-1 shadow-sm whitespace-nowrap text-center"
+            :style="tooltipStyle"
+            role="status"
+        >
+            <div class="text-[12px] font-semibold text-ink-900 [font-variant-numeric:tabular-nums]">{{ activeDisplay }}</div>
+            <div class="text-[10.5px] text-ink-500">{{ activePoint.label }}</div>
+        </div>
+    </div>
+</template>
diff --git a/packages/panel/resources/js/pages/customers/Edit.vue b/packages/panel/resources/js/pages/customers/Edit.vue
index c18d812fa9..95728a6197 100644
--- a/packages/panel/resources/js/pages/customers/Edit.vue
+++ b/packages/panel/resources/js/pages/customers/Edit.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, ref } from 'vue';
+import { computed, ref, watch } from 'vue';
 import { router, useForm, usePage } from '@inertiajs/vue3';
 import { useI18n } from 'vue-i18n';
 import Button from '../../components/Button.vue';
@@ -10,6 +10,7 @@ import Breadcrumbs, { type BreadcrumbItem } from '../../components/Breadcrumbs.v
 import Combobox from '../../components/Combobox.vue';
 import ConfirmDialog from '../../components/ConfirmDialog.vue';
 import FieldLabel from '../../components/FieldLabel.vue';
+import FilterDropdown, { type FilterOption } from '../../components/FilterDropdown.vue';
 import Icon from '../../components/Icon.vue';
 import PageEmpty from '../../components/PageEmpty.vue';
 import PageHeader from '../../components/PageHeader.vue';
@@ -21,6 +22,7 @@ import StatusBadge from '../../components/StatusBadge.vue';
 import Tabs from '../../components/Tabs.vue';
 import Textarea from '../../components/Textarea.vue';
 import TextInput from '../../components/TextInput.vue';
+import TimeSeriesChart, { type ChartPoint } from '../../components/TimeSeriesChart.vue';
 import PanelLayout from '../../layouts/PanelLayout.vue';
 
 interface OptionItem {
@@ -98,6 +100,10 @@ const props = defineProps<{
         avgOrder: string | null;
         latestOrderAt: string | null;
     };
+    orderChart: {
+        range: string;
+        buckets: ChartPoint[];
+    };
     urls: {
         index: string;
         update: string;
@@ -421,6 +427,35 @@ const submitNotes = (): void => {
     });
 };
 
+// Order-value chart: the range switcher partial-reloads only the chart prop;
+// while data is in flight the previous render holds at reduced opacity.
+const chartRange = ref(props.orderChart.range);
+const chartLoading = ref(false);
+
+const chartRangeOptions = computed<FilterOption[]>(() => [
+    { value: '12m', label: t('customers.chart_range_12m') },
+    { value: '3y', label: t('customers.chart_range_3y') },
+    { value: '5y', label: t('customers.chart_range_5y') },
+    { value: '10y', label: t('customers.chart_range_10y') },
+]);
+
+const onChartRangeChange = (): void => {
+    router.reload({
+        data: { chart_range: chartRange.value },
+        only: ['orderChart'],
+        onStart: () => {
+            chartLoading.value = true;
+        },
+        onFinish: () => {
+            chartLoading.value = false;
+        },
+    });
+};
+
+const chartHasData = computed(() => props.orderChart.buckets.some((bucket) => bucket.value > 0));
+
+watch(chartRange, onChartRangeChange);
+
 // Order history tab
 const orderStatusTone = (status: string): 'sage' | 'archived' | 'danger' | 'neutral' => {
     switch (status) {
@@ -491,6 +526,23 @@ const tabDefs = computed(() => [
 
                 <div class="flex flex-col gap-8 lg:grid lg:grid-cols-[minmax(0,1fr)_320px]">
                     <div class="min-w-0">
+                        <!-- Order value over time; the range switcher reloads only this card. -->
+                        <div class="bg-surface border border-line rounded-xl shadow-sm mb-6 overflow-hidden">
+                            <div class="flex items-center gap-2.5 px-4 py-3 border-b border-line">
+                                <h2 class="m-0 text-[13.5px] font-semibold tracking-[-0.01em]">{{ t('customers.chart_title') }}</h2>
+                                <div class="flex-1" />
+                                <FilterDropdown v-model="chartRange" :label="t('customers.chart_range_12m')" :options="chartRangeOptions" default-value="12m" />
+                            </div>
+                            <div class="px-4 py-3.5 transition-opacity duration-150" :class="chartLoading ? 'opacity-60' : ''">
+                                <TimeSeriesChart
+                                    v-if="chartHasData"
+                                    :points="orderChart.buckets"
+                                    :ariaLabel="t('customers.chart_title')"
+                                />
+                                <p v-else class="m-0 py-6 text-center text-[12px] text-ink-500 italic">{{ t('customers.chart_empty') }}</p>
+                            </div>
+                        </div>
+
                         <form @submit.prevent="submitDetails">
                             <Section :title="t('customers.personal_details')">
                                 <template #desc>{{ t('customers.personal_details_desc') }}</template>
diff --git a/packages/panel/resources/js/ui.ts b/packages/panel/resources/js/ui.ts
index cb73f13f55..bf08501f74 100644
--- a/packages/panel/resources/js/ui.ts
+++ b/packages/panel/resources/js/ui.ts
@@ -22,6 +22,9 @@ export { default as StatusBadge } from './components/StatusBadge.vue';
 export { default as FilterDropdown } from './components/FilterDropdown.vue';
 export { default as KpiCard } from './components/KpiCard.vue';
 
+// Charts
+export { default as TimeSeriesChart } from './components/TimeSeriesChart.vue';
+
 // Form inputs
 export { default as TextInput } from './components/TextInput.vue';
 export { default as Textarea } from './components/Textarea.vue';
diff --git a/packages/panel/resources/lang/ar/customers.php b/packages/panel/resources/lang/ar/customers.php
index cd1d9e801c..4db3f40e40 100644
--- a/packages/panel/resources/lang/ar/customers.php
+++ b/packages/panel/resources/lang/ar/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'متوسط الطلب',
     'stat_latest_order' => 'آخر طلب',
 
+    'chart_title' => 'قيمة الطلبات',
+    'chart_range_12m' => 'آخر 12 شهرًا',
+    'chart_range_3y' => 'آخر 3 سنوات',
+    'chart_range_5y' => 'آخر 5 سنوات',
+    'chart_range_10y' => 'آخر 10 سنوات',
+    'chart_empty' => 'لا توجد طلبات في هذه الفترة.',
+
     'notes' => 'ملاحظات الإدارة',
     'notes_empty' => 'لا توجد ملاحظات إدارية بعد.',
     'edit_notes' => 'تعديل ملاحظات الإدارة',
diff --git a/packages/panel/resources/lang/bg/customers.php b/packages/panel/resources/lang/bg/customers.php
index cf0c0dbd85..4ba925aedb 100644
--- a/packages/panel/resources/lang/bg/customers.php
+++ b/packages/panel/resources/lang/bg/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Средна поръчка',
     'stat_latest_order' => 'Последна поръчка',
 
+    'chart_title' => 'Стойност на поръчките',
+    'chart_range_12m' => 'Последните 12 месеца',
+    'chart_range_3y' => 'Последните 3 години',
+    'chart_range_5y' => 'Последните 5 години',
+    'chart_range_10y' => 'Последните 10 години',
+    'chart_empty' => 'Няма поръчки за този период.',
+
     'notes' => 'Административни бележки',
     'notes_empty' => 'Все още няма административни бележки.',
     'edit_notes' => 'Редактиране на административните бележки',
diff --git a/packages/panel/resources/lang/de/customers.php b/packages/panel/resources/lang/de/customers.php
index e176801d10..214c3c9fcc 100644
--- a/packages/panel/resources/lang/de/customers.php
+++ b/packages/panel/resources/lang/de/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Ø Bestellwert',
     'stat_latest_order' => 'Letzte Bestellung',
 
+    'chart_title' => 'Bestellwert',
+    'chart_range_12m' => 'Letzte 12 Monate',
+    'chart_range_3y' => 'Letzte 3 Jahre',
+    'chart_range_5y' => 'Letzte 5 Jahre',
+    'chart_range_10y' => 'Letzte 10 Jahre',
+    'chart_empty' => 'In diesem Zeitraum wurden keine Bestellungen aufgegeben.',
+
     'notes' => 'Admin-Notizen',
     'notes_empty' => 'Noch keine Admin-Notizen.',
     'edit_notes' => 'Admin-Notizen bearbeiten',
diff --git a/packages/panel/resources/lang/en/customers.php b/packages/panel/resources/lang/en/customers.php
index 315678de01..ff5b5692ea 100644
--- a/packages/panel/resources/lang/en/customers.php
+++ b/packages/panel/resources/lang/en/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Avg order',
     'stat_latest_order' => 'Latest order',
 
+    'chart_title' => 'Order value',
+    'chart_range_12m' => 'Last 12 months',
+    'chart_range_3y' => 'Last 3 years',
+    'chart_range_5y' => 'Last 5 years',
+    'chart_range_10y' => 'Last 10 years',
+    'chart_empty' => 'No orders placed in this period.',
+
     'notes' => 'Admin notes',
     'notes_empty' => 'No admin notes yet.',
     'edit_notes' => 'Edit admin notes',
diff --git a/packages/panel/resources/lang/es/customers.php b/packages/panel/resources/lang/es/customers.php
index 861fd61b61..2db24e8d7a 100644
--- a/packages/panel/resources/lang/es/customers.php
+++ b/packages/panel/resources/lang/es/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Pedido medio',
     'stat_latest_order' => 'Último pedido',
 
+    'chart_title' => 'Valor de los pedidos',
+    'chart_range_12m' => 'Últimos 12 meses',
+    'chart_range_3y' => 'Últimos 3 años',
+    'chart_range_5y' => 'Últimos 5 años',
+    'chart_range_10y' => 'Últimos 10 años',
+    'chart_empty' => 'No se realizaron pedidos en este período.',
+
     'notes' => 'Notas de administración',
     'notes_empty' => 'Aún no hay notas de administración.',
     'edit_notes' => 'Editar notas de administración',
diff --git a/packages/panel/resources/lang/fa/customers.php b/packages/panel/resources/lang/fa/customers.php
index 2409222426..3ffe27e785 100644
--- a/packages/panel/resources/lang/fa/customers.php
+++ b/packages/panel/resources/lang/fa/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'میانگین سفارش',
     'stat_latest_order' => 'آخرین سفارش',
 
+    'chart_title' => 'ارزش سفارش‌ها',
+    'chart_range_12m' => '۱۲ ماه گذشته',
+    'chart_range_3y' => '۳ سال گذشته',
+    'chart_range_5y' => '۵ سال گذشته',
+    'chart_range_10y' => '۱۰ سال گذشته',
+    'chart_empty' => 'در این بازه سفارشی ثبت نشده است.',
+
     'notes' => 'یادداشت‌های مدیریتی',
     'notes_empty' => 'هنوز یادداشت مدیریتی وجود ندارد.',
     'edit_notes' => 'ویرایش یادداشت‌های مدیریتی',
diff --git a/packages/panel/resources/lang/fr/customers.php b/packages/panel/resources/lang/fr/customers.php
index d42b097cea..e693499e1f 100644
--- a/packages/panel/resources/lang/fr/customers.php
+++ b/packages/panel/resources/lang/fr/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Panier moyen',
     'stat_latest_order' => 'Dernière commande',
 
+    'chart_title' => 'Valeur des commandes',
+    'chart_range_12m' => '12 derniers mois',
+    'chart_range_3y' => '3 dernières années',
+    'chart_range_5y' => '5 dernières années',
+    'chart_range_10y' => '10 dernières années',
+    'chart_empty' => 'Aucune commande passée sur cette période.',
+
     'notes' => 'Notes admin',
     'notes_empty' => 'Aucune note admin pour le moment.',
     'edit_notes' => 'Modifier les notes admin',
diff --git a/packages/panel/resources/lang/hr/customers.php b/packages/panel/resources/lang/hr/customers.php
index 02c879df8b..8c0b8d8d82 100644
--- a/packages/panel/resources/lang/hr/customers.php
+++ b/packages/panel/resources/lang/hr/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Prosj. narudžba',
     'stat_latest_order' => 'Zadnja narudžba',
 
+    'chart_title' => 'Vrijednost narudžbi',
+    'chart_range_12m' => 'Zadnjih 12 mjeseci',
+    'chart_range_3y' => 'Zadnje 3 godine',
+    'chart_range_5y' => 'Zadnjih 5 godina',
+    'chart_range_10y' => 'Zadnjih 10 godina',
+    'chart_empty' => 'Nema narudžbi u ovom razdoblju.',
+
     'notes' => 'Administratorske bilješke',
     'notes_empty' => 'Još nema administratorskih bilješki.',
     'edit_notes' => 'Uredi administratorske bilješke',
diff --git a/packages/panel/resources/lang/hu/customers.php b/packages/panel/resources/lang/hu/customers.php
index 7829a02c91..7e18646883 100644
--- a/packages/panel/resources/lang/hu/customers.php
+++ b/packages/panel/resources/lang/hu/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Átl. rendelés',
     'stat_latest_order' => 'Legutóbbi rendelés',
 
+    'chart_title' => 'Rendelési érték',
+    'chart_range_12m' => 'Elmúlt 12 hónap',
+    'chart_range_3y' => 'Elmúlt 3 év',
+    'chart_range_5y' => 'Elmúlt 5 év',
+    'chart_range_10y' => 'Elmúlt 10 év',
+    'chart_empty' => 'Ebben az időszakban nem volt rendelés.',
+
     'notes' => 'Admin jegyzetek',
     'notes_empty' => 'Még nincs admin jegyzet.',
     'edit_notes' => 'Admin jegyzetek szerkesztése',
diff --git a/packages/panel/resources/lang/mn/customers.php b/packages/panel/resources/lang/mn/customers.php
index 3b4f15eb03..12136af9dc 100644
--- a/packages/panel/resources/lang/mn/customers.php
+++ b/packages/panel/resources/lang/mn/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Дундаж захиалга',
     'stat_latest_order' => 'Сүүлийн захиалга',
 
+    'chart_title' => 'Захиалгын үнийн дүн',
+    'chart_range_12m' => 'Сүүлийн 12 сар',
+    'chart_range_3y' => 'Сүүлийн 3 жил',
+    'chart_range_5y' => 'Сүүлийн 5 жил',
+    'chart_range_10y' => 'Сүүлийн 10 жил',
+    'chart_empty' => 'Энэ хугацаанд захиалга байхгүй.',
+
     'notes' => 'Админ тэмдэглэл',
     'notes_empty' => 'Одоогоор админ тэмдэглэл алга.',
     'edit_notes' => 'Админ тэмдэглэл засах',
diff --git a/packages/panel/resources/lang/nl/customers.php b/packages/panel/resources/lang/nl/customers.php
index 85468b6ccb..a6b790b92b 100644
--- a/packages/panel/resources/lang/nl/customers.php
+++ b/packages/panel/resources/lang/nl/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Gem. bestelling',
     'stat_latest_order' => 'Laatste bestelling',
 
+    'chart_title' => 'Bestelwaarde',
+    'chart_range_12m' => 'Laatste 12 maanden',
+    'chart_range_3y' => 'Laatste 3 jaar',
+    'chart_range_5y' => 'Laatste 5 jaar',
+    'chart_range_10y' => 'Laatste 10 jaar',
+    'chart_empty' => 'Geen bestellingen geplaatst in deze periode.',
+
     'notes' => 'Adminnotities',
     'notes_empty' => 'Nog geen adminnotities.',
     'edit_notes' => 'Adminnotities bewerken',
diff --git a/packages/panel/resources/lang/pl/customers.php b/packages/panel/resources/lang/pl/customers.php
index 357f0a4423..435296b014 100644
--- a/packages/panel/resources/lang/pl/customers.php
+++ b/packages/panel/resources/lang/pl/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Śr. zamówienie',
     'stat_latest_order' => 'Ostatnie zamówienie',
 
+    'chart_title' => 'Wartość zamówień',
+    'chart_range_12m' => 'Ostatnie 12 miesięcy',
+    'chart_range_3y' => 'Ostatnie 3 lata',
+    'chart_range_5y' => 'Ostatnie 5 lat',
+    'chart_range_10y' => 'Ostatnie 10 lat',
+    'chart_empty' => 'Brak zamówień w tym okresie.',
+
     'notes' => 'Notatki administracyjne',
     'notes_empty' => 'Brak notatek administracyjnych.',
     'edit_notes' => 'Edytuj notatki administracyjne',
diff --git a/packages/panel/resources/lang/pt_BR/customers.php b/packages/panel/resources/lang/pt_BR/customers.php
index 44a736db66..1004fb7ece 100644
--- a/packages/panel/resources/lang/pt_BR/customers.php
+++ b/packages/panel/resources/lang/pt_BR/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Pedido médio',
     'stat_latest_order' => 'Último pedido',
 
+    'chart_title' => 'Valor dos pedidos',
+    'chart_range_12m' => 'Últimos 12 meses',
+    'chart_range_3y' => 'Últimos 3 anos',
+    'chart_range_5y' => 'Últimos 5 anos',
+    'chart_range_10y' => 'Últimos 10 anos',
+    'chart_empty' => 'Nenhum pedido realizado neste período.',
+
     'notes' => 'Notas administrativas',
     'notes_empty' => 'Nenhuma nota administrativa ainda.',
     'edit_notes' => 'Editar notas administrativas',
diff --git a/packages/panel/resources/lang/ro/customers.php b/packages/panel/resources/lang/ro/customers.php
index d3f52432ff..8ecf1959fc 100644
--- a/packages/panel/resources/lang/ro/customers.php
+++ b/packages/panel/resources/lang/ro/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Comandă medie',
     'stat_latest_order' => 'Ultima comandă',
 
+    'chart_title' => 'Valoarea comenzilor',
+    'chart_range_12m' => 'Ultimele 12 luni',
+    'chart_range_3y' => 'Ultimii 3 ani',
+    'chart_range_5y' => 'Ultimii 5 ani',
+    'chart_range_10y' => 'Ultimii 10 ani',
+    'chart_empty' => 'Nicio comandă plasată în această perioadă.',
+
     'notes' => 'Notițe administrative',
     'notes_empty' => 'Nicio notiță administrativă încă.',
     'edit_notes' => 'Editează notițele administrative',
diff --git a/packages/panel/resources/lang/tr/customers.php b/packages/panel/resources/lang/tr/customers.php
index cd6fc41567..8986d871bc 100644
--- a/packages/panel/resources/lang/tr/customers.php
+++ b/packages/panel/resources/lang/tr/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Ort. sipariş',
     'stat_latest_order' => 'Son sipariş',
 
+    'chart_title' => 'Sipariş değeri',
+    'chart_range_12m' => 'Son 12 ay',
+    'chart_range_3y' => 'Son 3 yıl',
+    'chart_range_5y' => 'Son 5 yıl',
+    'chart_range_10y' => 'Son 10 yıl',
+    'chart_empty' => 'Bu dönemde sipariş verilmedi.',
+
     'notes' => 'Yönetici notları',
     'notes_empty' => 'Henüz yönetici notu yok.',
     'edit_notes' => 'Yönetici notlarını düzenle',
diff --git a/packages/panel/resources/lang/vi/customers.php b/packages/panel/resources/lang/vi/customers.php
index 6651e912c4..9c7ad15ebd 100644
--- a/packages/panel/resources/lang/vi/customers.php
+++ b/packages/panel/resources/lang/vi/customers.php
@@ -130,6 +130,13 @@
     'stat_avg_order' => 'Đơn trung bình',
     'stat_latest_order' => 'Đơn gần nhất',
 
+    'chart_title' => 'Giá trị đơn hàng',
+    'chart_range_12m' => '12 tháng qua',
+    'chart_range_3y' => '3 năm qua',
+    'chart_range_5y' => '5 năm qua',
+    'chart_range_10y' => '10 năm qua',
+    'chart_empty' => 'Không có đơn hàng trong giai đoạn này.',
+
     'notes' => 'Ghi chú quản trị',
     'notes_empty' => 'Chưa có ghi chú quản trị.',
     'edit_notes' => 'Sửa ghi chú quản trị',
diff --git a/packages/panel/resources/panel-package/index.js b/packages/panel/resources/panel-package/index.js
index 355e7bed8f..05d90842fe 100644
--- a/packages/panel/resources/panel-package/index.js
+++ b/packages/panel/resources/panel-package/index.js
@@ -22,6 +22,9 @@ export const StatusBadge = ui().StatusBadge;
 export const FilterDropdown = ui().FilterDropdown;
 export const KpiCard = ui().KpiCard;
 
+// Charts
+export const TimeSeriesChart = ui().TimeSeriesChart;
+
 // Form inputs
 export const TextInput = ui().TextInput;
 export const Textarea = ui().Textarea;
diff --git a/packages/panel/src/Http/Controllers/Customers/CustomerEditController.php b/packages/panel/src/Http/Controllers/Customers/CustomerEditController.php
index 9799d9fae5..13ea5d881a 100644
--- a/packages/panel/src/Http/Controllers/Customers/CustomerEditController.php
+++ b/packages/panel/src/Http/Controllers/Customers/CustomerEditController.php
@@ -3,6 +3,8 @@
 namespace Lunar\Panel\Http\Controllers\Customers;
 
 use Illuminate\Http\RedirectResponse;
+use Illuminate\Http\Request;
+use Illuminate\Support\Carbon;
 use Inertia\Inertia;
 use Inertia\Response;
 use Lunar\Core\Contracts\Actions\Customers\DeletesCustomer;
@@ -19,7 +21,19 @@
 
 class CustomerEditController
 {
-    public function edit(Customer $customer): Response
+    /**
+     * Order-value chart ranges: window length and bucket granularity.
+     *
+     * @var array<string, array{months: int, bucket: 'month'|'quarter'|'year'}>
+     */
+    protected const CHART_RANGES = [
+        '12m' => ['months' => 12, 'bucket' => 'month'],
+        '3y' => ['months' => 36, 'bucket' => 'quarter'],
+        '5y' => ['months' => 60, 'bucket' => 'quarter'],
+        '10y' => ['months' => 120, 'bucket' => 'year'],
+    ];
+
+    public function edit(Request $request, Customer $customer): Response
     {
         $customer->load('customerGroups:id,name');
 
@@ -126,6 +140,7 @@ public function edit(Customer $customer): Response
             'activities' => $activities,
             'orders' => $orders,
             'stats' => $stats,
+            'orderChart' => $this->orderChart($request, $customer),
             'urls' => [
                 'index' => route('panel.customers.index'),
                 'update' => route('panel.customers.update', $customer),
@@ -137,6 +152,77 @@ public function edit(Customer $customer): Response
         ]);
     }
 
+    /**
+     * Placed-order value bucketed over the requested chart range, zero-filled
+     * and valued in the default currency — the same basis as the lifetime
+     * stats, so the chart and the stats card always agree. Bucketing happens
+     * in PHP: a single customer's order count is small, and it avoids
+     * cross-database date-formatting SQL.
+     *
+     * @return array{range: string, buckets: array<int, array{label: string, value: float|int, display: string}>}
+     */
+    protected function orderChart(Request $request, Customer $customer): array
+    {
+        $range = $request->string('chart_range')->value();
+        $range = array_key_exists($range, self::CHART_RANGES) ? $range : '12m';
+
+        ['months' => $months, 'bucket' => $bucket] = self::CHART_RANGES[$range];
+
+        $stepMonths = match ($bucket) {
+            'month' => 1,
+            'quarter' => 3,
+            'year' => 12,
+        };
+
+        $start = match ($bucket) {
+            'month' => now()->startOfMonth(),
+            'quarter' => now()->firstOfQuarter(),
+            'year' => now()->startOfYear(),
+        };
+        $start = $start->subMonths($months - $stepMonths);
+
+        $bucketKey = fn (Carbon $date): string => match ($bucket) {
+            'month' => $date->format('Y-m'),
+            'quarter' => $date->year.'-'.$date->quarter,
+            'year' => (string) $date->year,
+        };
+
+        $bucketLabel = fn (Carbon $date): string => match ($bucket) {
+            'month' => $date->translatedFormat('M y'),
+            'quarter' => 'Q'.$date->quarter.' '.$date->year,
+            'year' => (string) $date->year,
+        };
+
+        $spendByBucket = $customer->orders()
+            ->whereNotNull('placed_at')
+            ->where('placed_at', '>=', $start)
+            ->get(['placed_at', 'total', 'exchange_rate'])
+            ->groupBy(fn (Order $order) => $bucketKey($order->placed_at))
+            ->map(fn ($orders) => (int) round($orders->sum(
+                fn (Order $order) => $order->total / ($order->exchange_rate ?: 1),
+            )));
+
+        $defaultCurrency = Currency::getDefault();
+
+        $buckets = [];
+
+        for ($date = $start->copy(); $date->lessThanOrEqualTo(now()); $date->addMonths($stepMonths)) {
+            $minor = $spendByBucket[$bucketKey($date)] ?? 0;
+
+            $buckets[] = [
+                'label' => $bucketLabel($date),
+                'value' => $defaultCurrency
+                    ? round($minor / $defaultCurrency->factor, $defaultCurrency->decimal_places)
+                    : $minor / 100,
+                'display' => $defaultCurrency
+                    ? (string) (new PriceValue($minor, $defaultCurrency))->format()
+                    : (string) ($minor / 100),
+            ];
+        }
+
+        return ['range' => $range, 'buckets' => $buckets];
+    }
+
     public function update(CustomerRequest $request, Customer $customer, UpdatesCustomer $updatesCustomer): RedirectResponse
     {
         $updatesCustomer->execute(
diff --git a/specs/0050-panel-order-history-chart.md b/specs/0050-panel-order-history-chart.md
index 858e3c8785..b5a83d5441 100644
--- a/specs/0050-panel-order-history-chart.md
+++ b/specs/0050-panel-order-history-chart.md
@@ -1,6 +1,6 @@
 # 0050 — Panel order-value chart and public charting component
 
-- Status: draft
+- Status: accepted
 - Author: Glenn (via pairing session)
 - Created: 2026-07-16
 - TODO item: Panel order-value chart on the customer edit page + chart component on the add-on surface
@@ -144,10 +144,10 @@ across all 16 locales.
 
 ## Implementation plan
 
-- [ ] Slice 1 — `TimeSeriesChart` component with vitest coverage; export via
+- [x] Slice 1 — `TimeSeriesChart` component with vitest coverage; export via
   `ui.ts`, mirror in `@lunarphp/panel` `index.js`, regenerate types.
-- [ ] Slice 2 — `orderChart` data on `CustomerEditController` (range param,
+- [x] Slice 2 — `orderChart` data on `CustomerEditController` (range param,
   zero-filled buckets, default-currency conversion) with Pest coverage; edit-page
   card with range switcher and partial reload.
-- [ ] Slice 3 — translations across the 16 locales; update spec 0049's screen
+- [x] Slice 3 — translations across the 16 locales; update spec 0049's screen
   description; example add-on gains a small chart usage to prove the surface.
diff --git a/tests/panel/Feature/Customers/CustomerEditTest.php b/tests/panel/Feature/Customers/CustomerEditTest.php
index 34e8fc6f21..79987a65e1 100644
--- a/tests/panel/Feature/Customers/CustomerEditTest.php
+++ b/tests/panel/Feature/Customers/CustomerEditTest.php
@@ -83,6 +83,58 @@
         );
 });
 
+it('buckets placed order value into the order chart', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    Currency::factory()->create(['code' => 'GBP', 'default' => true, 'exchange_rate' => 1]);
+
+    $customer = Customer::factory()->create();
+
+    Order::factory()->placed()->for($customer)->create(['total' => 10000, 'exchange_rate' => 1, 'placed_at' => now()->subMonth()]);
+    Order::factory()->placed()->for($customer)->create(['total' => 5000, 'exchange_rate' => 1, 'placed_at' => now()]);
+    Order::factory()->for($customer)->create(['total' => 99999, 'placed_at' => null]);
+
+    $this->get(route('panel.customers.edit', $customer))
+        ->assertInertia(fn (Assert $page) => $page
+            ->where('orderChart.range', '12m')
+            ->has('orderChart.buckets', 12)
+            ->where('orderChart.buckets.10.value', 100)
+            ->where('orderChart.buckets.10.display', '£100.00')
+            ->where('orderChart.buckets.11.value', 50)
+            ->where('orderChart.buckets.0.value', 0)
+        );
+});
+
+it('zooms the order chart out to yearly buckets', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    Currency::factory()->create(['code' => 'GBP', 'default' => true, 'exchange_rate' => 1]);
+
+    $customer = Customer::factory()->create();
+
+    Order::factory()->placed()->for($customer)->create(['total' => 20000, 'exchange_rate' => 1, 'placed_at' => now()->subYears(2)]);
+
+    $this->get(route('panel.customers.edit', ['customer' => $customer, 'chart_range' => '10y']))
+        ->assertInertia(fn (Assert $page) => $page
+            ->where('orderChart.range', '10y')
+            ->has('orderChart.buckets', 10)
+            ->where('orderChart.buckets.7.value', 200)
+            ->where('orderChart.buckets.9.value', 0)
+        );
+});
+
+it('falls back to the default chart range for unknown values', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    $customer = Customer::factory()->create();
+
+    $this->get(route('panel.customers.edit', ['customer' => $customer, 'chart_range' => 'banana']))
+        ->assertInertia(fn (Assert $page) => $page
+            ->where('orderChart.range', '12m')
+            ->has('orderChart.buckets', 12)
+        );
+});
+
 it('updates a customer and syncs its customer groups', function () {
     $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
 

From 6d761409bfca1489deee9b272693923ecb30b093 Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Thu, 16 Jul 2026 22:42:18 +0100
Subject: [PATCH 09/19] Animate the TimeSeriesChart draw-in

The line draws left to right (dash math normalised via pathLength) and
the area fades in beneath it; keying the series paths on the data
replays the animation when a range switch swaps the buckets, and
prefers-reduced-motion disables it entirely. Also keep a full step of
clearance before the final x label so long ranges don't collide at the
right edge.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../js/components/TimeSeriesChart.test.ts     |  9 +++
 .../js/components/TimeSeriesChart.vue         | 77 +++++++++++++++++--
 2 files changed, 79 insertions(+), 7 deletions(-)

diff --git a/packages/panel/resources/js/components/TimeSeriesChart.test.ts b/packages/panel/resources/js/components/TimeSeriesChart.test.ts
index f09c77f9dc..1a3d5c8cde 100644
--- a/packages/panel/resources/js/components/TimeSeriesChart.test.ts
+++ b/packages/panel/resources/js/components/TimeSeriesChart.test.ts
@@ -60,6 +60,15 @@ describe('TimeSeriesChart', () => {
         expect(wrapper.find('[role="status"]').exists()).toBe(false);
     });
 
+    it('animates the line draw-in with normalised dash math', () => {
+        const wrapper = mountChart();
+
+        const line = wrapper.find('path.tsc-line');
+        expect(line.exists()).toBe(true);
+        expect(line.attributes('pathLength')).toBe('1');
+        expect(wrapper.find('path.tsc-area').exists()).toBe(true);
+    });
+
     it('scales a flat zero series without dividing by zero', () => {
         const wrapper = mountChart({ points: [{ label: 'Jan', value: 0 }, { label: 'Feb', value: 0 }] });
 
diff --git a/packages/panel/resources/js/components/TimeSeriesChart.vue b/packages/panel/resources/js/components/TimeSeriesChart.vue
index 000751cc33..0cabf35e40 100644
--- a/packages/panel/resources/js/components/TimeSeriesChart.vue
+++ b/packages/panel/resources/js/components/TimeSeriesChart.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, onBeforeUnmount, onMounted, ref } from 'vue';
+import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue';
 
 export interface ChartPoint {
     label: string;
@@ -92,10 +92,25 @@ const tickLabel = (value: number): string => (props.formatValue ? props.formatVa
 // 1/2/2.5/5 axis maximum always land on readable values.
 const ticks = computed(() => [0.5, 1].map((fraction) => fraction * axisMax.value));
 
-// Thin x labels so they never collide; always keep first and last.
+// Thin x labels so they never collide; always keep first and last, and drop
+// a stepped label that would land right next to the final one.
 const labelStep = computed(() => Math.max(1, Math.ceil(props.points.length / 8)));
-const showLabel = (index: number): boolean =>
-    index % labelStep.value === 0 || index === props.points.length - 1;
+const showLabel = (index: number): boolean => {
+    const last = props.points.length - 1;
+
+    if (index === last) {
+        return true;
+    }
+
+    return index % labelStep.value === 0 && last - index >= labelStep.value;
+};
+
+// Remounting the series paths (via :key) restarts their draw-in animation
+// whenever the data changes, e.g. when a range switcher swaps the buckets.
+const animationKey = ref(0);
+watch(() => props.points, () => {
+    animationKey.value++;
+});
 
 // Hover/focus: a crosshair snaps to the nearest bucket; the same readout is
 // reachable by keyboard (arrow keys).
@@ -191,9 +206,19 @@ const tooltipStyle = computed(() => {
                     style="fill: var(--color-ink-500)"
                 >{{ tickLabel(tick) }}</text>
 
-                <!-- Series -->
-                <path :d="areaPath" style="fill: var(--color-sage-soft)" fill-opacity="0.6" />
-                <path :d="linePath" fill="none" style="stroke: var(--color-sage-ink)" stroke-width="2" stroke-linejoin="round" stroke-linecap="round" />
+                <!-- Series; keyed so new data replays the draw-in animation. -->
+                <path :key="`area-${animationKey}`" class="tsc-area" :d="areaPath" style="fill: var(--color-sage-soft)" fill-opacity="0.6" />
+                <path
+                    :key="`line-${animationKey}`"
+                    class="tsc-line"
+                    :d="linePath"
+                    pathLength="1"
+                    fill="none"
+                    style="stroke: var(--color-sage-ink)"
+                    stroke-width="2"
+                    stroke-linejoin="round"
+                    stroke-linecap="round"
+                />
 
                 <!-- X labels (thinned) -->
                 <template v-for="(point, i) in points" :key="`label-${i}`">
@@ -240,3 +265,41 @@ const tooltipStyle = computed(() => {
         </div>
     </div>
 </template>
+
+<style scoped>
+/* Draw the line left to right (pathLength="1" normalises the dash math),
+   then fade the area in under it. */
+.tsc-line {
+    stroke-dasharray: 1;
+    animation: tsc-draw 700ms cubic-bezier(0.33, 0, 0.2, 1) both;
+}
+
+.tsc-area {
+    animation: tsc-fade 500ms ease-out 250ms both;
+}
+
+@keyframes tsc-draw {
+    from {
+        stroke-dashoffset: 1;
+    }
+    to {
+        stroke-dashoffset: 0;
+    }
+}
+
+@keyframes tsc-fade {
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
+}
+
+@media (prefers-reduced-motion: reduce) {
+    .tsc-line,
+    .tsc-area {
+        animation: none;
+    }
+}
+</style>

From 3cdd847c71d22a95edf9f74534f6b808c2c86de2 Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Thu, 16 Jul 2026 22:47:38 +0100
Subject: [PATCH 10/19] Move the add-address form into a modal

The inline form rendered below the address cards and was easy to miss.
"Add address" now opens the panel Dialog (footer submit associated to
the form via the form attribute); errors keep the dialog open, success
closes it, and stale errors clear on reopen.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../resources/js/pages/customers/Edit.vue     | 29 ++++++++++---------
 1 file changed, 15 insertions(+), 14 deletions(-)

diff --git a/packages/panel/resources/js/pages/customers/Edit.vue b/packages/panel/resources/js/pages/customers/Edit.vue
index 95728a6197..58d1f5a4a7 100644
--- a/packages/panel/resources/js/pages/customers/Edit.vue
+++ b/packages/panel/resources/js/pages/customers/Edit.vue
@@ -9,6 +9,7 @@ import ActivityTimeline from '../../components/ActivityTimeline.vue';
 import Breadcrumbs, { type BreadcrumbItem } from '../../components/Breadcrumbs.vue';
 import Combobox from '../../components/Combobox.vue';
 import ConfirmDialog from '../../components/ConfirmDialog.vue';
+import Dialog from '../../components/Dialog.vue';
 import FieldLabel from '../../components/FieldLabel.vue';
 import FilterDropdown, { type FilterOption } from '../../components/FilterDropdown.vue';
 import Icon from '../../components/Icon.vue';
@@ -287,6 +288,11 @@ const emptyAddress = () => ({
 const showNewAddressForm = ref(false);
 const newAddressForm = useForm(emptyAddress());
 
+const openNewAddressForm = (): void => {
+    newAddressForm.clearErrors();
+    showNewAddressForm.value = true;
+};
+
 const submitNewAddress = (): void => {
     newAddressForm.post(props.urls.addressesStore, {
         preserveScroll: true,
@@ -623,7 +629,7 @@ const tabDefs = computed(() => [
                         <div class="pt-2">
                             <Tabs v-model="activeTab" :tabs="tabDefs">
                                 <template #actions>
-                                    <Button v-if="activeTab === 'addresses'" size="sm" icon="plus" @click="showNewAddressForm = !showNewAddressForm">{{ t('customers.add_address') }}</Button>
+                                    <Button v-if="activeTab === 'addresses'" size="sm" icon="plus" @click="openNewAddressForm">{{ t('customers.add_address') }}</Button>
                                 </template>
 
                                 <template #addresses>
@@ -653,20 +659,15 @@ const tabDefs = computed(() => [
                                     </div>
                                     <PageEmpty v-else :title="t('customers.addresses_empty_title')">{{ t('customers.addresses_empty_body') }}</PageEmpty>
 
-                                    <form
-                                        v-if="showNewAddressForm"
-                                        class="mt-3 rounded-md border border-dashed border-line-strong p-4"
-                                        @submit.prevent="submitNewAddress"
-                                    >
-                                        <h3 class="text-[13px] font-semibold text-ink-900 mb-3">{{ t('customers.add_address') }}</h3>
-                                        <div class="flex flex-col gap-3">
+                                    <Dialog v-model:open="showNewAddressForm" :title="t('customers.add_address')" size="lg">
+                                        <form id="new-address-form" @submit.prevent="submitNewAddress">
                                             <AddressFormFields :form="newAddressForm" :countries="countries" id-prefix="new-address" />
-                                            <div class="flex gap-2">
-                                                <Button type="submit" variant="primary" size="sm" :disabled="newAddressForm.processing">{{ t('customers.add_address') }}</Button>
-                                                <Button type="button" size="sm" @click="showNewAddressForm = false">{{ t('common.cancel') }}</Button>
-                                            </div>
-                                        </div>
-                                    </form>
+                                        </form>
+                                        <template #footer>
+                                            <Button type="button" @click="showNewAddressForm = false">{{ t('common.cancel') }}</Button>
+                                            <Button type="submit" form="new-address-form" variant="primary" :disabled="newAddressForm.processing">{{ t('customers.add_address') }}</Button>
+                                        </template>
+                                    </Dialog>
                                 </template>
 
                                 <template #users>

From e6d0c262eaf5f058228db5255529fa9b0ea6109a Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Thu, 16 Jul 2026 22:53:54 +0100
Subject: [PATCH 11/19] Edit addresses in the same modal as add

The edit form no longer swaps in place of its card; the Edit action
opens the shared Dialog prefilled, titled with a new edit_address key
across all 16 locales.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../resources/js/pages/customers/Edit.vue     | 62 +++++++++++--------
 .../panel/resources/lang/ar/customers.php     |  1 +
 .../panel/resources/lang/bg/customers.php     |  1 +
 .../panel/resources/lang/de/customers.php     |  1 +
 .../panel/resources/lang/en/customers.php     |  1 +
 .../panel/resources/lang/es/customers.php     |  1 +
 .../panel/resources/lang/fa/customers.php     |  1 +
 .../panel/resources/lang/fr/customers.php     |  1 +
 .../panel/resources/lang/hr/customers.php     |  1 +
 .../panel/resources/lang/hu/customers.php     |  1 +
 .../panel/resources/lang/mn/customers.php     |  1 +
 .../panel/resources/lang/nl/customers.php     |  1 +
 .../panel/resources/lang/pl/customers.php     |  1 +
 .../panel/resources/lang/pt_BR/customers.php  |  1 +
 .../panel/resources/lang/ro/customers.php     |  1 +
 .../panel/resources/lang/tr/customers.php     |  1 +
 .../panel/resources/lang/vi/customers.php     |  1 +
 17 files changed, 51 insertions(+), 27 deletions(-)

diff --git a/packages/panel/resources/js/pages/customers/Edit.vue b/packages/panel/resources/js/pages/customers/Edit.vue
index 58d1f5a4a7..7fd52c2741 100644
--- a/packages/panel/resources/js/pages/customers/Edit.vue
+++ b/packages/panel/resources/js/pages/customers/Edit.vue
@@ -328,12 +328,23 @@ const startEditAddress = (address: Address): void => {
     addressForm.billing_default = address.billing_default;
 };
 
-const cancelEditAddress = (): void => {
-    editingAddressId.value = null;
-};
+const editingAddress = computed(() => props.addresses.find((address) => address.id === editingAddressId.value) ?? null);
 
-const submitEditAddress = (address: Address): void => {
-    addressForm.put(address.update_url, {
+const editAddressOpen = computed({
+    get: () => editingAddressId.value !== null,
+    set: (value: boolean) => {
+        if (!value) {
+            editingAddressId.value = null;
+        }
+    },
+});
+
+const submitEditAddress = (): void => {
+    if (!editingAddress.value) {
+        return;
+    }
+
+    addressForm.put(editingAddress.value.update_url, {
         preserveScroll: true,
         onSuccess: () => {
             editingAddressId.value = null;
@@ -634,28 +645,15 @@ const tabDefs = computed(() => [
 
                                 <template #addresses>
                                     <div v-if="addresses.length" class="grid grid-cols-1 lg:grid-cols-2 gap-3">
-                                        <template v-for="address in addresses" :key="address.id">
-                                            <form
-                                                v-if="editingAddressId === address.id"
-                                                class="bg-surface border border-line rounded-md p-3.5 flex flex-col gap-3"
-                                                @submit.prevent="submitEditAddress(address)"
-                                            >
-                                                <AddressFormFields :form="addressForm" :countries="countries" id-prefix="edit-address" />
-                                                <div class="flex gap-2">
-                                                    <Button type="submit" variant="primary" size="sm" :disabled="addressForm.processing">{{ t('customers.save_address') }}</Button>
-                                                    <Button type="button" size="sm" @click="cancelEditAddress">{{ t('common.cancel') }}</Button>
-                                                </div>
-                                            </form>
-                                            <AddressCard v-else :address="cardAddress(address)">
-                                                <template #actions>
-                                                    <Button variant="ghost" size="sm" icon="edit" @click="startEditAddress(address)">{{ t('common.edit') }}</Button>
-                                                    <Button v-if="!address.billing_default" variant="ghost" size="sm" @click="setAddressDefault(address, 'billing_default')">{{ t('customers.set_default_billing') }}</Button>
-                                                    <Button v-if="!address.shipping_default" variant="ghost" size="sm" @click="setAddressDefault(address, 'shipping_default')">{{ t('customers.set_default_shipping') }}</Button>
-                                                    <div class="flex-1" />
-                                                    <Button variant="ghost" size="sm" icon="trash" :aria-label="t('customers.remove_address')" @click="destroyAddress(address)" />
-                                                </template>
-                                            </AddressCard>
-                                        </template>
+                                        <AddressCard v-for="address in addresses" :key="address.id" :address="cardAddress(address)">
+                                            <template #actions>
+                                                <Button variant="ghost" size="sm" icon="edit" @click="startEditAddress(address)">{{ t('common.edit') }}</Button>
+                                                <Button v-if="!address.billing_default" variant="ghost" size="sm" @click="setAddressDefault(address, 'billing_default')">{{ t('customers.set_default_billing') }}</Button>
+                                                <Button v-if="!address.shipping_default" variant="ghost" size="sm" @click="setAddressDefault(address, 'shipping_default')">{{ t('customers.set_default_shipping') }}</Button>
+                                                <div class="flex-1" />
+                                                <Button variant="ghost" size="sm" icon="trash" :aria-label="t('customers.remove_address')" @click="destroyAddress(address)" />
+                                            </template>
+                                        </AddressCard>
                                     </div>
                                     <PageEmpty v-else :title="t('customers.addresses_empty_title')">{{ t('customers.addresses_empty_body') }}</PageEmpty>
 
@@ -668,6 +666,16 @@ const tabDefs = computed(() => [
                                             <Button type="submit" form="new-address-form" variant="primary" :disabled="newAddressForm.processing">{{ t('customers.add_address') }}</Button>
                                         </template>
                                     </Dialog>
+
+                                    <Dialog v-model:open="editAddressOpen" :title="t('customers.edit_address')" size="lg">
+                                        <form id="edit-address-form" @submit.prevent="submitEditAddress">
+                                            <AddressFormFields :form="addressForm" :countries="countries" id-prefix="edit-address" />
+                                        </form>
+                                        <template #footer>
+                                            <Button type="button" @click="editAddressOpen = false">{{ t('common.cancel') }}</Button>
+                                            <Button type="submit" form="edit-address-form" variant="primary" :disabled="addressForm.processing">{{ t('customers.save_address') }}</Button>
+                                        </template>
+                                    </Dialog>
                                 </template>
 
                                 <template #users>
diff --git a/packages/panel/resources/lang/ar/customers.php b/packages/panel/resources/lang/ar/customers.php
index 4db3f40e40..d77c041416 100644
--- a/packages/panel/resources/lang/ar/customers.php
+++ b/packages/panel/resources/lang/ar/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'الشحن الافتراضي',
     'default_billing' => 'الفوترة الافتراضية',
     'save_address' => 'حفظ العنوان',
+    'edit_address' => 'تعديل العنوان',
     'set_default_billing' => 'تعيين كعنوان فوترة افتراضي',
     'set_default_shipping' => 'تعيين كعنوان شحن افتراضي',
     'remove_address' => 'إزالة العنوان',
diff --git a/packages/panel/resources/lang/bg/customers.php b/packages/panel/resources/lang/bg/customers.php
index 4ba925aedb..77ff1b689a 100644
--- a/packages/panel/resources/lang/bg/customers.php
+++ b/packages/panel/resources/lang/bg/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'По подразбиране за доставка',
     'default_billing' => 'По подразбиране за фактуриране',
     'save_address' => 'Запази адрес',
+    'edit_address' => 'Редактиране на адреса',
     'set_default_billing' => 'Задай като основен за фактуриране',
     'set_default_shipping' => 'Задай като основен за доставка',
     'remove_address' => 'Премахни адрес',
diff --git a/packages/panel/resources/lang/de/customers.php b/packages/panel/resources/lang/de/customers.php
index 214c3c9fcc..90382cf51e 100644
--- a/packages/panel/resources/lang/de/customers.php
+++ b/packages/panel/resources/lang/de/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'Standardversand',
     'default_billing' => 'Standardrechnung',
     'save_address' => 'Adresse speichern',
+    'edit_address' => 'Adresse bearbeiten',
     'set_default_billing' => 'Als Standardrechnungsadresse festlegen',
     'set_default_shipping' => 'Als Standardversandadresse festlegen',
     'remove_address' => 'Adresse entfernen',
diff --git a/packages/panel/resources/lang/en/customers.php b/packages/panel/resources/lang/en/customers.php
index ff5b5692ea..19d97309df 100644
--- a/packages/panel/resources/lang/en/customers.php
+++ b/packages/panel/resources/lang/en/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'Default shipping',
     'default_billing' => 'Default billing',
     'save_address' => 'Save address',
+    'edit_address' => 'Edit address',
     'set_default_billing' => 'Set default billing',
     'set_default_shipping' => 'Set default shipping',
     'remove_address' => 'Remove address',
diff --git a/packages/panel/resources/lang/es/customers.php b/packages/panel/resources/lang/es/customers.php
index 2db24e8d7a..0489d6828f 100644
--- a/packages/panel/resources/lang/es/customers.php
+++ b/packages/panel/resources/lang/es/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'Envío predeterminado',
     'default_billing' => 'Facturación predeterminada',
     'save_address' => 'Guardar dirección',
+    'edit_address' => 'Editar dirección',
     'set_default_billing' => 'Establecer como facturación predeterminada',
     'set_default_shipping' => 'Establecer como envío predeterminado',
     'remove_address' => 'Eliminar dirección',
diff --git a/packages/panel/resources/lang/fa/customers.php b/packages/panel/resources/lang/fa/customers.php
index 3ffe27e785..aa2c02ea53 100644
--- a/packages/panel/resources/lang/fa/customers.php
+++ b/packages/panel/resources/lang/fa/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'ارسال پیش‌فرض',
     'default_billing' => 'صورت‌حساب پیش‌فرض',
     'save_address' => 'ذخیره آدرس',
+    'edit_address' => 'ویرایش آدرس',
     'set_default_billing' => 'تنظیم به‌عنوان صورت‌حساب پیش‌فرض',
     'set_default_shipping' => 'تنظیم به‌عنوان ارسال پیش‌فرض',
     'remove_address' => 'حذف آدرس',
diff --git a/packages/panel/resources/lang/fr/customers.php b/packages/panel/resources/lang/fr/customers.php
index e693499e1f..bf0ef68daa 100644
--- a/packages/panel/resources/lang/fr/customers.php
+++ b/packages/panel/resources/lang/fr/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'Livraison par défaut',
     'default_billing' => 'Facturation par défaut',
     'save_address' => "Enregistrer l'adresse",
+    'edit_address' => 'Modifier l\'adresse',
     'set_default_billing' => 'Définir comme facturation par défaut',
     'set_default_shipping' => 'Définir comme livraison par défaut',
     'remove_address' => "Supprimer l'adresse",
diff --git a/packages/panel/resources/lang/hr/customers.php b/packages/panel/resources/lang/hr/customers.php
index 8c0b8d8d82..c02864940e 100644
--- a/packages/panel/resources/lang/hr/customers.php
+++ b/packages/panel/resources/lang/hr/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'Zadana dostava',
     'default_billing' => 'Zadana naplata',
     'save_address' => 'Spremi adresu',
+    'edit_address' => 'Uredi adresu',
     'set_default_billing' => 'Postavi kao zadanu adresu za naplatu',
     'set_default_shipping' => 'Postavi kao zadanu adresu za dostavu',
     'remove_address' => 'Ukloni adresu',
diff --git a/packages/panel/resources/lang/hu/customers.php b/packages/panel/resources/lang/hu/customers.php
index 7e18646883..9aa9fbdc1e 100644
--- a/packages/panel/resources/lang/hu/customers.php
+++ b/packages/panel/resources/lang/hu/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'Alapértelmezett szállítási cím',
     'default_billing' => 'Alapértelmezett számlázási cím',
     'save_address' => 'Cím mentése',
+    'edit_address' => 'Cím szerkesztése',
     'set_default_billing' => 'Beállítás alapértelmezett számlázási címként',
     'set_default_shipping' => 'Beállítás alapértelmezett szállítási címként',
     'remove_address' => 'Cím eltávolítása',
diff --git a/packages/panel/resources/lang/mn/customers.php b/packages/panel/resources/lang/mn/customers.php
index 12136af9dc..f8f6e55bac 100644
--- a/packages/panel/resources/lang/mn/customers.php
+++ b/packages/panel/resources/lang/mn/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'Үндсэн хүргэлтийн хаяг',
     'default_billing' => 'Үндсэн нэхэмжлэхийн хаяг',
     'save_address' => 'Хаяг хадгалах',
+    'edit_address' => 'Хаяг засах',
     'set_default_billing' => 'Үндсэн нэхэмжлэхийн хаяг болгох',
     'set_default_shipping' => 'Үндсэн хүргэлтийн хаяг болгох',
     'remove_address' => 'Хаяг устгах',
diff --git a/packages/panel/resources/lang/nl/customers.php b/packages/panel/resources/lang/nl/customers.php
index a6b790b92b..e1ae48fda6 100644
--- a/packages/panel/resources/lang/nl/customers.php
+++ b/packages/panel/resources/lang/nl/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'Standaard verzendadres',
     'default_billing' => 'Standaard factuuradres',
     'save_address' => 'Adres opslaan',
+    'edit_address' => 'Adres bewerken',
     'set_default_billing' => 'Instellen als standaard factuuradres',
     'set_default_shipping' => 'Instellen als standaard verzendadres',
     'remove_address' => 'Adres verwijderen',
diff --git a/packages/panel/resources/lang/pl/customers.php b/packages/panel/resources/lang/pl/customers.php
index 435296b014..7884ad6a5c 100644
--- a/packages/panel/resources/lang/pl/customers.php
+++ b/packages/panel/resources/lang/pl/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'Domyślny adres wysyłki',
     'default_billing' => 'Domyślny adres rozliczeniowy',
     'save_address' => 'Zapisz adres',
+    'edit_address' => 'Edytuj adres',
     'set_default_billing' => 'Ustaw jako domyślny rozliczeniowy',
     'set_default_shipping' => 'Ustaw jako domyślny wysyłkowy',
     'remove_address' => 'Usuń adres',
diff --git a/packages/panel/resources/lang/pt_BR/customers.php b/packages/panel/resources/lang/pt_BR/customers.php
index 1004fb7ece..f05a4f6441 100644
--- a/packages/panel/resources/lang/pt_BR/customers.php
+++ b/packages/panel/resources/lang/pt_BR/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'Envio padrão',
     'default_billing' => 'Cobrança padrão',
     'save_address' => 'Salvar endereço',
+    'edit_address' => 'Editar endereço',
     'set_default_billing' => 'Definir como cobrança padrão',
     'set_default_shipping' => 'Definir como envio padrão',
     'remove_address' => 'Remover endereço',
diff --git a/packages/panel/resources/lang/ro/customers.php b/packages/panel/resources/lang/ro/customers.php
index 8ecf1959fc..42fa6a0cfd 100644
--- a/packages/panel/resources/lang/ro/customers.php
+++ b/packages/panel/resources/lang/ro/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'Livrare implicită',
     'default_billing' => 'Facturare implicită',
     'save_address' => 'Salvează adresa',
+    'edit_address' => 'Editează adresa',
     'set_default_billing' => 'Setează ca facturare implicită',
     'set_default_shipping' => 'Setează ca livrare implicită',
     'remove_address' => 'Elimină adresa',
diff --git a/packages/panel/resources/lang/tr/customers.php b/packages/panel/resources/lang/tr/customers.php
index 8986d871bc..d50b5df5ba 100644
--- a/packages/panel/resources/lang/tr/customers.php
+++ b/packages/panel/resources/lang/tr/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'Varsayılan gönderim',
     'default_billing' => 'Varsayılan fatura',
     'save_address' => 'Adresi kaydet',
+    'edit_address' => 'Adresi düzenle',
     'set_default_billing' => 'Varsayılan fatura olarak ayarla',
     'set_default_shipping' => 'Varsayılan gönderim olarak ayarla',
     'remove_address' => 'Adresi kaldır',
diff --git a/packages/panel/resources/lang/vi/customers.php b/packages/panel/resources/lang/vi/customers.php
index 9c7ad15ebd..a1dc23a67d 100644
--- a/packages/panel/resources/lang/vi/customers.php
+++ b/packages/panel/resources/lang/vi/customers.php
@@ -81,6 +81,7 @@
     'default_shipping' => 'Giao hàng mặc định',
     'default_billing' => 'Thanh toán mặc định',
     'save_address' => 'Lưu địa chỉ',
+    'edit_address' => 'Sửa địa chỉ',
     'set_default_billing' => 'Đặt làm thanh toán mặc định',
     'set_default_shipping' => 'Đặt làm giao hàng mặc định',
     'remove_address' => 'Xóa địa chỉ',

From 0cc2b96938fe360035250db542dffd9fb2fda22f Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Thu, 16 Jul 2026 23:11:31 +0100
Subject: [PATCH 12/19] Replace the static flash bars with a FlashMessage
 component

Animated slide/fade in and out, a dismiss button, auto-dismiss after
6s (paused while hovered), and re-triggering on every server response
so repeat saves with identical text still flash. Errors and the
forgot-password status pass timeout 0 and persist until dismissed.
Swapped into the customers pages, SettingsShell (success + error),
account security, forgot password, and the example add-on; exported on
the public add-on surface.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../resources/js/pages/Widgets/Index.vue      |  6 +-
 .../js/components/FlashMessage.test.ts        | 72 ++++++++++++++
 .../resources/js/components/FlashMessage.vue  | 99 +++++++++++++++++++
 .../resources/js/layouts/SettingsShell.vue    |  9 +-
 .../resources/js/pages/account/Security.vue   |  8 +-
 .../js/pages/auth/ForgotPassword.vue          |  8 +-
 .../resources/js/pages/customers/Edit.vue     |  5 +-
 .../resources/js/pages/customers/Index.vue    |  5 +-
 packages/panel/resources/js/ui.ts             |  1 +
 .../panel/resources/panel-package/index.js    |  1 +
 10 files changed, 186 insertions(+), 28 deletions(-)
 create mode 100644 packages/panel/resources/js/components/FlashMessage.test.ts
 create mode 100644 packages/panel/resources/js/components/FlashMessage.vue

diff --git a/packages/panel-addon-example/resources/js/pages/Widgets/Index.vue b/packages/panel-addon-example/resources/js/pages/Widgets/Index.vue
index 65c405b8f4..2e81bdcb25 100644
--- a/packages/panel-addon-example/resources/js/pages/Widgets/Index.vue
+++ b/packages/panel-addon-example/resources/js/pages/Widgets/Index.vue
@@ -12,7 +12,7 @@ import { computed } from 'vue';
 // under `example-addon::{group}` keys — served, cached and versioned by the
 // panel's translations endpoint like the panel's own strings.
 import { useI18n } from 'vue-i18n';
-import { Breadcrumbs, DataTable, PageHeader, PageZone, Button, SideCard, StatusBadge, TimeSeriesChart } from '@lunarphp/panel';
+import { Breadcrumbs, DataTable, FlashMessage, PageHeader, PageZone, Button, SideCard, StatusBadge, TimeSeriesChart } from '@lunarphp/panel';
 
 defineProps<{
     message?: string;
@@ -72,9 +72,7 @@ const chartPoints = [
         <div class="px-4 sm:px-5 lg:px-7 max-w-[1400px] w-full mx-auto pt-5 pb-7">
             <PageZone region="main" position="before" />
 
-            <div v-if="flashSuccess" class="mb-4 rounded-md border border-sage-border bg-sage-soft px-3 py-2 text-[12px] text-sage-ink">
-                {{ flashSuccess }}
-            </div>
+            <FlashMessage :message="flashSuccess" class="mb-4" />
 
             <p class="text-[13px] text-ink-700">
                 {{ message ?? 'This page is served by a separately-compiled add-on package.' }}
diff --git a/packages/panel/resources/js/components/FlashMessage.test.ts b/packages/panel/resources/js/components/FlashMessage.test.ts
new file mode 100644
index 0000000000..66ea581209
--- /dev/null
+++ b/packages/panel/resources/js/components/FlashMessage.test.ts
@@ -0,0 +1,72 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import { mount } from '@vue/test-utils';
+import FlashMessage from './FlashMessage.vue';
+
+vi.mock('@inertiajs/vue3', () => ({
+    usePage: () => ({ props: { flash: {} } }),
+}));
+
+const mountFlash = (props = {}) => mount(FlashMessage, { props: { message: 'Saved.', ...props } });
+
+describe('FlashMessage', () => {
+    beforeEach(() => vi.useFakeTimers());
+    afterEach(() => vi.useRealTimers());
+
+    it('shows the message with a status role', () => {
+        const wrapper = mountFlash();
+
+        const status = wrapper.find('[role="status"]');
+        expect(status.exists()).toBe(true);
+        expect(status.text()).toContain('Saved.');
+    });
+
+    it('renders nothing without a message', () => {
+        const wrapper = mountFlash({ message: null });
+
+        expect(wrapper.find('[role="status"]').exists()).toBe(false);
+    });
+
+    it('dismisses via the close button', async () => {
+        const wrapper = mountFlash();
+
+        await wrapper.find('button').trigger('click');
+
+        expect(wrapper.find('[role="status"]').exists()).toBe(false);
+    });
+
+    it('auto-dismisses after the timeout', async () => {
+        const wrapper = mountFlash({ timeout: 5000 });
+
+        expect(wrapper.find('[role="status"]').exists()).toBe(true);
+
+        vi.advanceTimersByTime(5001);
+        await wrapper.vm.$nextTick();
+
+        expect(wrapper.find('[role="status"]').exists()).toBe(false);
+    });
+
+    it('persists when the timeout is zero', async () => {
+        const wrapper = mountFlash({ timeout: 0 });
+
+        vi.advanceTimersByTime(60_000);
+        await wrapper.vm.$nextTick();
+
+        expect(wrapper.find('[role="status"]').exists()).toBe(true);
+    });
+
+    it('pauses the auto-dismiss while hovered', async () => {
+        const wrapper = mountFlash({ timeout: 5000 });
+
+        await wrapper.find('[role="status"]').trigger('mouseenter');
+        vi.advanceTimersByTime(10_000);
+        await wrapper.vm.$nextTick();
+
+        expect(wrapper.find('[role="status"]').exists()).toBe(true);
+
+        await wrapper.find('[role="status"]').trigger('mouseleave');
+        vi.advanceTimersByTime(5001);
+        await wrapper.vm.$nextTick();
+
+        expect(wrapper.find('[role="status"]').exists()).toBe(false);
+    });
+});
diff --git a/packages/panel/resources/js/components/FlashMessage.vue b/packages/panel/resources/js/components/FlashMessage.vue
new file mode 100644
index 0000000000..157409abd2
--- /dev/null
+++ b/packages/panel/resources/js/components/FlashMessage.vue
@@ -0,0 +1,99 @@
+<script setup lang="ts">
+import { onBeforeUnmount, ref, watch } from 'vue';
+import { usePage } from '@inertiajs/vue3';
+import { useI18n } from 'vue-i18n';
+import Icon from './Icon.vue';
+
+const props = withDefaults(
+    defineProps<{
+        message?: string | null;
+        tone?: 'success' | 'error';
+        /** Milliseconds before the message dismisses itself; 0 keeps it until dismissed. */
+        timeout?: number;
+    }>(),
+    { message: null, tone: 'success', timeout: 6000 },
+);
+
+const { t } = useI18n();
+
+const visible = ref(false);
+let timer: ReturnType<typeof setTimeout> | undefined;
+
+const dismiss = (): void => {
+    visible.value = false;
+    clearTimeout(timer);
+};
+
+const arm = (): void => {
+    clearTimeout(timer);
+
+    if (props.timeout > 0) {
+        timer = setTimeout(dismiss, props.timeout);
+    }
+};
+
+const show = (): void => {
+    if (!props.message) {
+        visible.value = false;
+
+        return;
+    }
+
+    visible.value = true;
+    arm();
+};
+
+// Re-show on every server response carrying flash data: the prop object is a
+// fresh reference per visit, so a repeat save with identical text retriggers.
+const page = usePage();
+watch(() => [page.props.flash, props.message] as const, show, { immediate: true });
+
+// Hovering pauses the auto-dismiss so the message can be read in peace.
+const pause = (): void => clearTimeout(timer);
+const resume = (): void => {
+    if (visible.value) {
+        arm();
+    }
+};
+
+onBeforeUnmount(() => clearTimeout(timer));
+
+const TONE = {
+    success: {
+        wrap: 'border-sage-border bg-sage-soft text-sage-ink',
+        icon: 'check',
+    },
+    error: {
+        wrap: 'border-danger-border bg-danger-soft text-danger',
+        icon: 'alert',
+    },
+} as const;
+</script>
+
+<template>
+    <Transition
+        enter-active-class="transition-all duration-300 ease-out"
+        leave-active-class="transition-all duration-200 ease-in"
+        enter-from-class="opacity-0 max-h-0 !py-0 !mt-0 !mb-0 -translate-y-1"
+        leave-to-class="opacity-0 max-h-0 !py-0 !mt-0 !mb-0 -translate-y-1"
+    >
+        <div
+            v-if="visible && message"
+            :class="['flex items-center gap-2 overflow-hidden max-h-24 rounded-md border px-3 py-2 text-[12px]', TONE[tone].wrap]"
+            role="status"
+            @mouseenter="pause"
+            @mouseleave="resume"
+        >
+            <Icon :name="TONE[tone].icon" cls="sm" class="shrink-0" />
+            <span class="flex-1 min-w-0 truncate">{{ message }}</span>
+            <button
+                type="button"
+                class="shrink-0 grid place-items-center w-[18px] h-[18px] rounded-full text-current/70 hover:text-current hover:bg-surface/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sage/35"
+                :aria-label="t('common.close')"
+                @click="dismiss"
+            >
+                <Icon name="x" cls="sm" />
+            </button>
+        </div>
+    </Transition>
+</template>
diff --git a/packages/panel/resources/js/layouts/SettingsShell.vue b/packages/panel/resources/js/layouts/SettingsShell.vue
index e9cdd48e70..89f749b732 100644
--- a/packages/panel/resources/js/layouts/SettingsShell.vue
+++ b/packages/panel/resources/js/layouts/SettingsShell.vue
@@ -9,6 +9,7 @@ import Icon from '../components/Icon.vue';
 import PageActions, { type PageAction } from '../components/PageActions.vue';
 import PageHeader from '../components/PageHeader.vue';
 import PageZone from '../components/PageZone.vue';
+import FlashMessage from '../components/FlashMessage.vue';
 import { useNavState } from '../composables/useNavState';
 
 // Settings pages get the same scaffold as top-level pages: a breadcrumb bar
@@ -191,12 +192,8 @@ onUnmounted(() => {
                 <div :class="wide ? 'px-4 sm:px-5 lg:px-7 max-w-[1400px] w-full mx-auto pt-5 pb-7' : 'mx-auto w-full max-w-5xl px-6 pt-5 pb-7'">
                     <PageZone region="main" position="before" />
 
-                    <div v-if="flashSuccess" class="mb-4 rounded-md border border-sage-border bg-sage-soft px-3 py-2 text-[12px] text-sage-ink">
-                        {{ flashSuccess }}
-                    </div>
-                    <div v-if="flashError" class="mb-4 rounded-md border border-danger bg-danger/10 px-3 py-2 text-[12px] text-danger">
-                        {{ flashError }}
-                    </div>
+                    <FlashMessage :message="flashSuccess" class="mb-4" />
+                    <FlashMessage :message="flashError" tone="error" :timeout="0" class="mb-4" />
 
                     <slot />
 
diff --git a/packages/panel/resources/js/pages/account/Security.vue b/packages/panel/resources/js/pages/account/Security.vue
index cbdd05b7df..0719d0b9be 100644
--- a/packages/panel/resources/js/pages/account/Security.vue
+++ b/packages/panel/resources/js/pages/account/Security.vue
@@ -5,6 +5,7 @@ import { useI18n } from 'vue-i18n';
 import Button from '../../components/Button.vue';
 import CodeInput from '../../components/CodeInput.vue';
 import FieldLabel from '../../components/FieldLabel.vue';
+import FlashMessage from '../../components/FlashMessage.vue';
 import Icon from '../../components/Icon.vue';
 import TextInput from '../../components/TextInput.vue';
 
@@ -74,12 +75,7 @@ const copyCodes = () => {
             <Head :title="t('auth.security_title')" />
             <h1 class="text-2xl font-semibold tracking-[-0.02em] text-ink-900">{{ t('auth.security_title') }}</h1>
 
-            <div
-                v-if="flashSuccess"
-                class="rounded-md border border-sage-border bg-sage-soft px-3 py-2 text-[12px] text-sage-ink"
-            >
-                {{ flashSuccess }}
-            </div>
+            <FlashMessage :message="flashSuccess" />
 
             <!-- Password -->
             <section class="rounded-lg border border-line bg-paper p-6">
diff --git a/packages/panel/resources/js/pages/auth/ForgotPassword.vue b/packages/panel/resources/js/pages/auth/ForgotPassword.vue
index f60ddecb44..acd6ab4078 100644
--- a/packages/panel/resources/js/pages/auth/ForgotPassword.vue
+++ b/packages/panel/resources/js/pages/auth/ForgotPassword.vue
@@ -5,6 +5,7 @@ import { useI18n } from 'vue-i18n';
 import AuthLayout from '../../layouts/AuthLayout.vue';
 import Button from '../../components/Button.vue';
 import FieldLabel from '../../components/FieldLabel.vue';
+import FlashMessage from '../../components/FlashMessage.vue';
 import Icon from '../../components/Icon.vue';
 import TextInput from '../../components/TextInput.vue';
 
@@ -36,12 +37,7 @@ const submit = () => form.post(props.urls.store);
             <h1 class="text-2xl font-semibold tracking-[-0.02em] text-ink-900">{{ t('auth.forgot_title') }}</h1>
             <p class="mt-1.5 text-[13px] text-ink-500">{{ t('auth.forgot_subtitle') }}</p>
 
-            <div
-                v-if="flashSuccess"
-                class="mt-5 rounded-md border border-sage-border bg-sage-soft px-3 py-2 text-[12px] text-sage-ink"
-            >
-                {{ flashSuccess }}
-            </div>
+            <FlashMessage :message="flashSuccess" :timeout="0" class="mt-5" />
 
             <div class="mt-7">
                 <FieldLabel>{{ t('auth.email') }}</FieldLabel>
diff --git a/packages/panel/resources/js/pages/customers/Edit.vue b/packages/panel/resources/js/pages/customers/Edit.vue
index 7fd52c2741..70376b142b 100644
--- a/packages/panel/resources/js/pages/customers/Edit.vue
+++ b/packages/panel/resources/js/pages/customers/Edit.vue
@@ -12,6 +12,7 @@ import ConfirmDialog from '../../components/ConfirmDialog.vue';
 import Dialog from '../../components/Dialog.vue';
 import FieldLabel from '../../components/FieldLabel.vue';
 import FilterDropdown, { type FilterOption } from '../../components/FilterDropdown.vue';
+import FlashMessage from '../../components/FlashMessage.vue';
 import Icon from '../../components/Icon.vue';
 import PageEmpty from '../../components/PageEmpty.vue';
 import PageHeader from '../../components/PageHeader.vue';
@@ -537,9 +538,7 @@ const tabDefs = computed(() => [
             <div class="px-4 sm:px-5 lg:px-7 max-w-[1400px] w-full mx-auto pt-5 pb-7">
                 <PageZone region="main" position="before" />
 
-                <div v-if="flashSuccess" class="mb-4 rounded-md border border-sage-border bg-sage-soft px-3 py-2 text-[12px] text-sage-ink">
-                    {{ flashSuccess }}
-                </div>
+                <FlashMessage :message="flashSuccess" class="mb-4" />
 
                 <div class="flex flex-col gap-8 lg:grid lg:grid-cols-[minmax(0,1fr)_320px]">
                     <div class="min-w-0">
diff --git a/packages/panel/resources/js/pages/customers/Index.vue b/packages/panel/resources/js/pages/customers/Index.vue
index ccc9021546..117e050de8 100644
--- a/packages/panel/resources/js/pages/customers/Index.vue
+++ b/packages/panel/resources/js/pages/customers/Index.vue
@@ -13,6 +13,7 @@ import Icon from '../../components/Icon.vue';
 import Pagination from '../../components/Pagination.vue';
 import PageEmpty from '../../components/PageEmpty.vue';
 import FilterDropdown, { type FilterOption } from '../../components/FilterDropdown.vue';
+import FlashMessage from '../../components/FlashMessage.vue';
 import KpiCard from '../../components/KpiCard.vue';
 import StatusBadge from '../../components/StatusBadge.vue';
 import TextInput from '../../components/TextInput.vue';
@@ -224,9 +225,7 @@ const formatDate = (value: string): string => new Date(value).toLocaleDateString
             <div class="px-4 sm:px-5 lg:px-7 max-w-[1400px] w-full mx-auto pt-5 pb-7">
                 <PageZone region="main" position="before" />
 
-                <div v-if="flashSuccess" class="mb-4 rounded-md border border-sage-border bg-sage-soft px-3 py-2 text-[12px] text-sage-ink">
-                    {{ flashSuccess }}
-                </div>
+                <FlashMessage :message="flashSuccess" class="mb-4" />
 
                 <!-- KPI strip; dismissable, restored via "Show KPIs". -->
                 <div v-if="!kpisDismissed" class="mb-5 relative">
diff --git a/packages/panel/resources/js/ui.ts b/packages/panel/resources/js/ui.ts
index bf08501f74..0fe8d0be36 100644
--- a/packages/panel/resources/js/ui.ts
+++ b/packages/panel/resources/js/ui.ts
@@ -17,6 +17,7 @@ export { default as DataTable } from './components/DataTable.vue';
 export { default as Pagination } from './components/Pagination.vue';
 export { default as PageEmpty } from './components/PageEmpty.vue';
 export { default as StatusBadge } from './components/StatusBadge.vue';
+export { default as FlashMessage } from './components/FlashMessage.vue';
 
 // Filters / stats
 export { default as FilterDropdown } from './components/FilterDropdown.vue';
diff --git a/packages/panel/resources/panel-package/index.js b/packages/panel/resources/panel-package/index.js
index 05d90842fe..f22ba2d8d4 100644
--- a/packages/panel/resources/panel-package/index.js
+++ b/packages/panel/resources/panel-package/index.js
@@ -17,6 +17,7 @@ export const DataTable = ui().DataTable;
 export const Pagination = ui().Pagination;
 export const PageEmpty = ui().PageEmpty;
 export const StatusBadge = ui().StatusBadge;
+export const FlashMessage = ui().FlashMessage;
 
 // Filters / stats
 export const FilterDropdown = ui().FilterDropdown;

From 99c9d5eb2290546187634e7d0fe58fd095c2da12 Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Fri, 17 Jul 2026 09:03:02 +0100
Subject: [PATCH 13/19] Bring the customer index table up to the design
 prototype

- Rows carry per-customer order stats via correlated subqueries on the
  same placed-order, default-currency basis as the edit page: placed
  order count, formatted total spend, and latest order date replace the
  Created column (recency stays available through the sort dropdown)
- The first linked user's email shows under the customer name, falling
  back to the account ref
- Avatars take one of the three soft theme tints, assigned by customer
  id so a customer keeps their colour across reloads
- Column labels reuse the existing stat_* lang keys; the unused
  column_created key is dropped from all 16 locales

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../resources/js/pages/customers/Index.vue    | 41 ++++++++++++++++---
 .../panel/resources/lang/ar/customers.php     |  1 -
 .../panel/resources/lang/bg/customers.php     |  1 -
 .../panel/resources/lang/de/customers.php     |  1 -
 .../panel/resources/lang/en/customers.php     |  1 -
 .../panel/resources/lang/es/customers.php     |  1 -
 .../panel/resources/lang/fa/customers.php     |  1 -
 .../panel/resources/lang/fr/customers.php     |  1 -
 .../panel/resources/lang/hr/customers.php     |  1 -
 .../panel/resources/lang/hu/customers.php     |  1 -
 .../panel/resources/lang/mn/customers.php     |  1 -
 .../panel/resources/lang/nl/customers.php     |  1 -
 .../panel/resources/lang/pl/customers.php     |  1 -
 .../panel/resources/lang/pt_BR/customers.php  |  1 -
 .../panel/resources/lang/ro/customers.php     |  1 -
 .../panel/resources/lang/tr/customers.php     |  1 -
 .../panel/resources/lang/vi/customers.php     |  1 -
 .../Customers/CustomerIndexController.php     | 40 ++++++++++++++++--
 .../CustomerIndexTableExtensionTest.php       |  2 +-
 .../Feature/Customers/CustomerIndexTest.php   | 37 +++++++++++++++++
 tests/panel/Feature/ExampleAddonTest.php      |  2 +-
 21 files changed, 112 insertions(+), 26 deletions(-)

diff --git a/packages/panel/resources/js/pages/customers/Index.vue b/packages/panel/resources/js/pages/customers/Index.vue
index 117e050de8..fa3fb4ebc6 100644
--- a/packages/panel/resources/js/pages/customers/Index.vue
+++ b/packages/panel/resources/js/pages/customers/Index.vue
@@ -39,7 +39,11 @@ interface CustomerRow {
     last_name: string;
     company_name: string | null;
     account_ref: string | null;
+    email: string | null;
     created_at: string;
+    orders_count: number;
+    total_spend: string | null;
+    last_order_at: string | null;
     customer_groups: CustomerGroupOption[];
     edit_url: string;
     // Extension-contributed columns land here under their own key.
@@ -196,7 +200,18 @@ const kpis = computed(() => [
 const initials = (firstName: string, lastName: string): string =>
     ((firstName?.[0] ?? '') + (lastName?.[0] ?? '')).toUpperCase() || '?';
 
-const formatDate = (value: string): string => new Date(value).toLocaleDateString();
+// Soft avatar tints, assigned per customer id so a customer keeps their colour
+// across pages and reloads.
+const AVATAR_TONES = [
+    'bg-sage-soft border-sage-border',
+    'bg-warn-soft border-warn-border',
+    'bg-danger-soft border-danger-border',
+];
+
+const avatarTone = (id: number): string => AVATAR_TONES[id % AVATAR_TONES.length];
+
+const formatShortDate = (value: string): string =>
+    new Date(value).toLocaleDateString(undefined, { day: 'numeric', month: 'short' });
 </script>
 
 <template>
@@ -312,12 +327,18 @@ const formatDate = (value: string): string => new Date(value).toLocaleDateString
 
                     <template #cell-full_name="{ row }">
                         <div class="min-w-0 flex items-center gap-2.5">
-                            <div class="w-7 h-7 rounded-full border border-line bg-surface-2 grid place-items-center text-ink-700 text-[10.5px] font-semibold shrink-0">
+                            <div
+                                :class="[
+                                    'w-7 h-7 rounded-full border grid place-items-center text-ink-700 text-[10.5px] font-semibold shrink-0',
+                                    avatarTone(row.id as number),
+                                ]"
+                            >
                                 {{ initials(row.first_name as string, row.last_name as string) }}
                             </div>
                             <div class="min-w-0">
                                 <div class="text-[12.5px] text-ink-900 truncate">{{ row.full_name }}</div>
-                                <div v-if="row.account_ref" class="text-[11px] text-ink-500 truncate font-mono">{{ row.account_ref }}</div>
+                                <div v-if="row.email" class="text-[11px] text-ink-500 truncate">{{ row.email }}</div>
+                                <div v-else-if="row.account_ref" class="text-[11px] text-ink-500 truncate font-mono">{{ row.account_ref }}</div>
                             </div>
                         </div>
                     </template>
@@ -334,8 +355,18 @@ const formatDate = (value: string): string => new Date(value).toLocaleDateString
                         </div>
                     </template>
 
-                    <template #cell-created_at="{ value }">
-                        <span class="text-xs text-ink-700 [font-variant-numeric:tabular-nums]">{{ formatDate(value as string) }}</span>
+                    <template #cell-orders_count="{ value }">
+                        <span class="text-[12.5px] text-ink-700 [font-variant-numeric:tabular-nums]">{{ value }}</span>
+                    </template>
+
+                    <template #cell-total_spend="{ value }">
+                        <span v-if="value" class="text-[12.5px] text-ink-900 font-medium [font-variant-numeric:tabular-nums]">{{ value }}</span>
+                        <span v-else class="text-[12.5px] text-ink-400">—</span>
+                    </template>
+
+                    <template #cell-last_order_at="{ value }">
+                        <span v-if="value" class="text-xs text-ink-700 [font-variant-numeric:tabular-nums]">{{ formatShortDate(value as string) }}</span>
+                        <span v-else class="text-[12.5px] text-ink-400">—</span>
                     </template>
                 </DataTable>
 
diff --git a/packages/panel/resources/lang/ar/customers.php b/packages/panel/resources/lang/ar/customers.php
index d77c041416..826a09dbfa 100644
--- a/packages/panel/resources/lang/ar/customers.php
+++ b/packages/panel/resources/lang/ar/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'العميل',
     'column_company' => 'الشركة',
     'column_groups' => 'المجموعات',
-    'column_created' => 'تاريخ الإنشاء',
 
     'new_title' => 'عميل جديد',
     'detail_label' => 'تفاصيل العميل',
diff --git a/packages/panel/resources/lang/bg/customers.php b/packages/panel/resources/lang/bg/customers.php
index 77ff1b689a..328dbed9c4 100644
--- a/packages/panel/resources/lang/bg/customers.php
+++ b/packages/panel/resources/lang/bg/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Клиент',
     'column_company' => 'Фирма',
     'column_groups' => 'Групи',
-    'column_created' => 'Създаден',
 
     'new_title' => 'Нов клиент',
     'detail_label' => 'Детайли за клиента',
diff --git a/packages/panel/resources/lang/de/customers.php b/packages/panel/resources/lang/de/customers.php
index 90382cf51e..f330cb49ae 100644
--- a/packages/panel/resources/lang/de/customers.php
+++ b/packages/panel/resources/lang/de/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Kunde',
     'column_company' => 'Firma',
     'column_groups' => 'Gruppen',
-    'column_created' => 'Erstellt',
 
     'new_title' => 'Neuer Kunde',
     'detail_label' => 'Kundendetails',
diff --git a/packages/panel/resources/lang/en/customers.php b/packages/panel/resources/lang/en/customers.php
index 19d97309df..d3ca8f96e3 100644
--- a/packages/panel/resources/lang/en/customers.php
+++ b/packages/panel/resources/lang/en/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Customer',
     'column_company' => 'Company',
     'column_groups' => 'Groups',
-    'column_created' => 'Created',
 
     'new_title' => 'New customer',
     'detail_label' => 'Customer detail',
diff --git a/packages/panel/resources/lang/es/customers.php b/packages/panel/resources/lang/es/customers.php
index 0489d6828f..c0cea85910 100644
--- a/packages/panel/resources/lang/es/customers.php
+++ b/packages/panel/resources/lang/es/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Cliente',
     'column_company' => 'Empresa',
     'column_groups' => 'Grupos',
-    'column_created' => 'Creado',
 
     'new_title' => 'Nuevo cliente',
     'detail_label' => 'Detalle del cliente',
diff --git a/packages/panel/resources/lang/fa/customers.php b/packages/panel/resources/lang/fa/customers.php
index aa2c02ea53..954f669164 100644
--- a/packages/panel/resources/lang/fa/customers.php
+++ b/packages/panel/resources/lang/fa/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'مشتری',
     'column_company' => 'شرکت',
     'column_groups' => 'گروه‌ها',
-    'column_created' => 'تاریخ ایجاد',
 
     'new_title' => 'مشتری جدید',
     'detail_label' => 'جزئیات مشتری',
diff --git a/packages/panel/resources/lang/fr/customers.php b/packages/panel/resources/lang/fr/customers.php
index bf0ef68daa..65c83136cc 100644
--- a/packages/panel/resources/lang/fr/customers.php
+++ b/packages/panel/resources/lang/fr/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Client',
     'column_company' => 'Société',
     'column_groups' => 'Groupes',
-    'column_created' => 'Créé le',
 
     'new_title' => 'Nouveau client',
     'detail_label' => 'Détail du client',
diff --git a/packages/panel/resources/lang/hr/customers.php b/packages/panel/resources/lang/hr/customers.php
index c02864940e..07518b897e 100644
--- a/packages/panel/resources/lang/hr/customers.php
+++ b/packages/panel/resources/lang/hr/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Kupac',
     'column_company' => 'Tvrtka',
     'column_groups' => 'Grupe',
-    'column_created' => 'Kreirano',
 
     'new_title' => 'Novi kupac',
     'detail_label' => 'Detalji kupca',
diff --git a/packages/panel/resources/lang/hu/customers.php b/packages/panel/resources/lang/hu/customers.php
index 9aa9fbdc1e..77f2508874 100644
--- a/packages/panel/resources/lang/hu/customers.php
+++ b/packages/panel/resources/lang/hu/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Ügyfél',
     'column_company' => 'Cég',
     'column_groups' => 'Csoportok',
-    'column_created' => 'Létrehozva',
 
     'new_title' => 'Új ügyfél',
     'detail_label' => 'Ügyfél adatai',
diff --git a/packages/panel/resources/lang/mn/customers.php b/packages/panel/resources/lang/mn/customers.php
index f8f6e55bac..c7c7fbba0a 100644
--- a/packages/panel/resources/lang/mn/customers.php
+++ b/packages/panel/resources/lang/mn/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Харилцагч',
     'column_company' => 'Компани',
     'column_groups' => 'Бүлгүүд',
-    'column_created' => 'Үүсгэсэн',
 
     'new_title' => 'Шинэ харилцагч',
     'detail_label' => 'Харилцагчийн дэлгэрэнгүй',
diff --git a/packages/panel/resources/lang/nl/customers.php b/packages/panel/resources/lang/nl/customers.php
index e1ae48fda6..34519ac0e4 100644
--- a/packages/panel/resources/lang/nl/customers.php
+++ b/packages/panel/resources/lang/nl/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Klant',
     'column_company' => 'Bedrijf',
     'column_groups' => 'Groepen',
-    'column_created' => 'Aangemaakt',
 
     'new_title' => 'Nieuwe klant',
     'detail_label' => 'Klantdetail',
diff --git a/packages/panel/resources/lang/pl/customers.php b/packages/panel/resources/lang/pl/customers.php
index 7884ad6a5c..55daaf3d79 100644
--- a/packages/panel/resources/lang/pl/customers.php
+++ b/packages/panel/resources/lang/pl/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Klient',
     'column_company' => 'Firma',
     'column_groups' => 'Grupy',
-    'column_created' => 'Utworzono',
 
     'new_title' => 'Nowy klient',
     'detail_label' => 'Szczegóły klienta',
diff --git a/packages/panel/resources/lang/pt_BR/customers.php b/packages/panel/resources/lang/pt_BR/customers.php
index f05a4f6441..ccff7a7fa2 100644
--- a/packages/panel/resources/lang/pt_BR/customers.php
+++ b/packages/panel/resources/lang/pt_BR/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Cliente',
     'column_company' => 'Empresa',
     'column_groups' => 'Grupos',
-    'column_created' => 'Criado em',
 
     'new_title' => 'Novo cliente',
     'detail_label' => 'Detalhes do cliente',
diff --git a/packages/panel/resources/lang/ro/customers.php b/packages/panel/resources/lang/ro/customers.php
index 42fa6a0cfd..093016bba8 100644
--- a/packages/panel/resources/lang/ro/customers.php
+++ b/packages/panel/resources/lang/ro/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Client',
     'column_company' => 'Companie',
     'column_groups' => 'Grupuri',
-    'column_created' => 'Creat',
 
     'new_title' => 'Client nou',
     'detail_label' => 'Detalii client',
diff --git a/packages/panel/resources/lang/tr/customers.php b/packages/panel/resources/lang/tr/customers.php
index d50b5df5ba..030ba53e5b 100644
--- a/packages/panel/resources/lang/tr/customers.php
+++ b/packages/panel/resources/lang/tr/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Müşteri',
     'column_company' => 'Şirket',
     'column_groups' => 'Gruplar',
-    'column_created' => 'Oluşturulma',
 
     'new_title' => 'Yeni müşteri',
     'detail_label' => 'Müşteri detayı',
diff --git a/packages/panel/resources/lang/vi/customers.php b/packages/panel/resources/lang/vi/customers.php
index a1dc23a67d..f56135a599 100644
--- a/packages/panel/resources/lang/vi/customers.php
+++ b/packages/panel/resources/lang/vi/customers.php
@@ -32,7 +32,6 @@
     'column_customer' => 'Khách hàng',
     'column_company' => 'Công ty',
     'column_groups' => 'Nhóm',
-    'column_created' => 'Ngày tạo',
 
     'new_title' => 'Khách hàng mới',
     'detail_label' => 'Chi tiết khách hàng',
diff --git a/packages/panel/src/Http/Controllers/Customers/CustomerIndexController.php b/packages/panel/src/Http/Controllers/Customers/CustomerIndexController.php
index c6711412a4..68a1e31eaa 100644
--- a/packages/panel/src/Http/Controllers/Customers/CustomerIndexController.php
+++ b/packages/panel/src/Http/Controllers/Customers/CustomerIndexController.php
@@ -5,8 +5,11 @@
 use Illuminate\Http\Request;
 use Inertia\Inertia;
 use Inertia\Response;
+use Lunar\Core\DataObjects\PriceValue;
+use Lunar\Core\Models\Currency;
 use Lunar\Core\Models\Customer;
 use Lunar\Core\Models\CustomerGroup;
+use Lunar\Core\Models\Order;
 use Lunar\Panel\Http\Controllers\Concerns\ResolvesTableExtensions;
 
 class CustomerIndexController
@@ -22,10 +25,12 @@ class CustomerIndexController
     public function index(Request $request): Response
     {
         $this->columns = [
-            ['key' => 'full_name', 'label' => __('panel::customers.column_customer'), 'width' => 'minmax(0,1.4fr)'],
+            ['key' => 'full_name', 'label' => __('panel::customers.column_customer'), 'width' => 'minmax(0,1.6fr)'],
             ['key' => 'company_name', 'label' => __('panel::customers.column_company'), 'width' => 'minmax(0,1fr)'],
             ['key' => 'customer_groups', 'label' => __('panel::customers.column_groups'), 'width' => 'minmax(0,1fr)'],
-            ['key' => 'created_at', 'label' => __('panel::customers.column_created'), 'width' => '120px', 'align' => 'right'],
+            ['key' => 'orders_count', 'label' => __('panel::customers.stat_orders'), 'width' => '80px', 'align' => 'right'],
+            ['key' => 'total_spend', 'label' => __('panel::customers.stat_total_spend'), 'width' => '120px', 'align' => 'right'],
+            ['key' => 'last_order_at', 'label' => __('panel::customers.stat_latest_order'), 'width' => '110px'],
         ];
 
         $sort = $request->string('sort')->value();
@@ -35,8 +40,28 @@ public function index(Request $request): Response
 
         $resolver = $this->resolveTable('customers.index');
 
+        $defaultCurrency = Currency::getDefault();
+
+        $customerKey = (new Customer)->qualifyColumn('id');
+
+        // Per-row order stats as correlated subqueries; the same placed-order
+        // and default-currency basis as the edit page's lifetime stats.
+        $placedOrders = fn () => Order::query()
+            ->whereColumn('customer_id', $customerKey)
+            ->whereNotNull('placed_at');
+
         $customers = Customer::query()
+            ->select((new Customer)->qualifyColumn('*'))
+            ->addSelect([
+                'placed_orders_count' => $placedOrders()->selectRaw('COUNT(*)'),
+                'total_spend_minor' => $placedOrders()->selectRaw('COALESCE(SUM(total / NULLIF(exchange_rate, 0)), 0)'),
+                'last_order_at' => $placedOrders()->select('placed_at')->latest('placed_at')->limit(1),
+            ])
             ->with('customerGroups:id,name')
+            ->with(['users' => fn ($query) => $query->select(
+                $query->getModel()->qualifyColumn('id'),
+                $query->getModel()->qualifyColumn('email'),
+            )])
             ->when($request->filled('q'), function ($query) use ($request, $resolver) {
                 $term = $request->string('q')->value();
                 $like = "%{$term}%";
@@ -63,7 +88,10 @@ public function index(Request $request): Response
             ->orderBy($sort, $direction)
             ->paginate(15)
             ->withQueryString()
-            ->through(function (Customer $customer) use ($resolver) {
+            ->through(function (Customer $customer) use ($resolver, $defaultCurrency) {
+                $ordersCount = (int) $customer->getAttribute('placed_orders_count');
+                $spendMinor = (int) round((float) $customer->getAttribute('total_spend_minor'));
+
                 $row = [
                     'id' => $customer->id,
                     'full_name' => $customer->full_name,
@@ -71,7 +99,13 @@ public function index(Request $request): Response
                     'last_name' => $customer->last_name,
                     'company_name' => $customer->company_name,
                     'account_ref' => $customer->account_ref,
+                    'email' => $customer->users->first()?->email,
                     'created_at' => $customer->created_at,
+                    'orders_count' => $ordersCount,
+                    'total_spend' => $ordersCount && $defaultCurrency
+                        ? (new PriceValue($spendMinor, $defaultCurrency))->format()
+                        : null,
+                    'last_order_at' => $customer->getAttribute('last_order_at'),
                     'customer_groups' => $customer->customerGroups->map(fn (CustomerGroup $group) => [
                         'id' => $group->id,
                         'name' => $group->name,
diff --git a/tests/panel/Feature/Customers/CustomerIndexTableExtensionTest.php b/tests/panel/Feature/Customers/CustomerIndexTableExtensionTest.php
index 196f62bb93..fdef213647 100644
--- a/tests/panel/Feature/Customers/CustomerIndexTableExtensionTest.php
+++ b/tests/panel/Feature/Customers/CustomerIndexTableExtensionTest.php
@@ -21,7 +21,7 @@
                 $keys = collect($columns)->pluck('key')->all();
 
                 // First-party columns still come first, extension columns are appended.
-                return $keys === ['full_name', 'company_name', 'customer_groups', 'created_at', 'public_id', 'addresses_count'];
+                return $keys === ['full_name', 'company_name', 'customer_groups', 'orders_count', 'total_spend', 'last_order_at', 'public_id', 'addresses_count'];
             })
             ->where('customers.data.0.public_id', $customer->public_id)
             // "addresses_count" only appears with a real value because the extension
diff --git a/tests/panel/Feature/Customers/CustomerIndexTest.php b/tests/panel/Feature/Customers/CustomerIndexTest.php
index d9a65bb906..c6356e20d1 100644
--- a/tests/panel/Feature/Customers/CustomerIndexTest.php
+++ b/tests/panel/Feature/Customers/CustomerIndexTest.php
@@ -1,8 +1,10 @@
 <?php
 
 use Inertia\Testing\AssertableInertia as Assert;
+use Lunar\Core\Models\Currency;
 use Lunar\Core\Models\Customer;
 use Lunar\Core\Models\CustomerGroup;
+use Lunar\Core\Models\Order;
 use Lunar\Core\Models\Staff;
 use Lunar\Tests\Core\Stubs\User;
 use Lunar\Tests\Panel\TestCase;
@@ -112,6 +114,41 @@
         );
 });
 
+it('exposes per-row order stats and the linked user email', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    Currency::factory()->create(['code' => 'GBP', 'default' => true, 'exchange_rate' => 1]);
+
+    $customer = Customer::factory()->create();
+    $customer->users()->attach(User::factory()->create(['email' => 'ada@example.com']));
+
+    Order::factory()->placed()->for($customer)->create(['total' => 10000, 'exchange_rate' => 1]);
+    Order::factory()->placed()->for($customer)->create(['total' => 5000, 'exchange_rate' => 1]);
+    Order::factory()->for($customer)->create(['total' => 99999, 'placed_at' => null]);
+
+    $this->get(route('panel.customers.index'))
+        ->assertInertia(fn (Assert $page) => $page
+            ->where('customers.data.0.email', 'ada@example.com')
+            ->where('customers.data.0.orders_count', 2)
+            ->where('customers.data.0.total_spend', '£150.00')
+            ->whereNot('customers.data.0.last_order_at', null)
+        );
+});
+
+it('reports empty row stats for customers without placed orders', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    Customer::factory()->create();
+
+    $this->get(route('panel.customers.index'))
+        ->assertInertia(fn (Assert $page) => $page
+            ->where('customers.data.0.email', null)
+            ->where('customers.data.0.orders_count', 0)
+            ->where('customers.data.0.total_spend', null)
+            ->where('customers.data.0.last_order_at', null)
+        );
+});
+
 it('paginates the customer index', function () {
     $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
 
diff --git a/tests/panel/Feature/ExampleAddonTest.php b/tests/panel/Feature/ExampleAddonTest.php
index c36906363e..77b7956990 100644
--- a/tests/panel/Feature/ExampleAddonTest.php
+++ b/tests/panel/Feature/ExampleAddonTest.php
@@ -82,7 +82,7 @@
 
                 // First-party columns come first; the example add-on's
                 // ExampleColumn ("id") is appended by the table extension resolver.
-                return $keys === ['full_name', 'company_name', 'customer_groups', 'created_at', 'id'];
+                return $keys === ['full_name', 'company_name', 'customer_groups', 'orders_count', 'total_spend', 'last_order_at', 'id'];
             })
             ->where('customers.data.0.id', $customer->id)
         );

From 4fd56b3e6be088c5a7f6198b4538f839f8c20207 Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Fri, 17 Jul 2026 09:12:35 +0100
Subject: [PATCH 14/19] Add the average lifetime value KPI with a cached KPI
 block

The fourth KPI card is now the prototype's avg lifetime value: one
aggregate over placed orders (default-currency basis via captured
exchange rates) divided by distinct customers with orders, plus a
delta chip against the average as it stood 30 days ago (neutral tone
when negative). The whole KPI block is cached for five minutes since
every value is a whole-table aggregate and the strip does not need to
be second-accurate on large stores. Replaces the interim "can sign in"
count; lang keys swapped across all 16 locales.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../resources/js/pages/customers/Index.vue    | 29 ++++++++--
 .../panel/resources/lang/ar/customers.php     |  4 +-
 .../panel/resources/lang/bg/customers.php     |  4 +-
 .../panel/resources/lang/de/customers.php     |  4 +-
 .../panel/resources/lang/en/customers.php     |  4 +-
 .../panel/resources/lang/es/customers.php     |  4 +-
 .../panel/resources/lang/fa/customers.php     |  4 +-
 .../panel/resources/lang/fr/customers.php     |  4 +-
 .../panel/resources/lang/hr/customers.php     |  4 +-
 .../panel/resources/lang/hu/customers.php     |  4 +-
 .../panel/resources/lang/mn/customers.php     |  4 +-
 .../panel/resources/lang/nl/customers.php     |  4 +-
 .../panel/resources/lang/pl/customers.php     |  4 +-
 .../panel/resources/lang/pt_BR/customers.php  |  4 +-
 .../panel/resources/lang/ro/customers.php     |  4 +-
 .../panel/resources/lang/tr/customers.php     |  4 +-
 .../panel/resources/lang/vi/customers.php     |  4 +-
 .../Customers/CustomerIndexController.php     | 54 +++++++++++++++----
 .../Feature/Customers/CustomerIndexTest.php   | 43 +++++++++++++--
 19 files changed, 141 insertions(+), 49 deletions(-)

diff --git a/packages/panel/resources/js/pages/customers/Index.vue b/packages/panel/resources/js/pages/customers/Index.vue
index fa3fb4ebc6..dc6c9c99f4 100644
--- a/packages/panel/resources/js/pages/customers/Index.vue
+++ b/packages/panel/resources/js/pages/customers/Index.vue
@@ -87,7 +87,13 @@ const props = defineProps<{
     tableFilterValues: Record<string, string>;
     customerGroups: CustomerGroupOption[];
     totalCount: number;
-    kpis: { total: number; newLast30Days: number; business: number; withAccount: number };
+    kpis: {
+        total: number;
+        newLast30Days: number;
+        business: number;
+        avgLifetimeValue: string | null;
+        avgLifetimeValueDelta: number | null;
+    };
     filters: { q?: string; customer_group_id?: string | number; type?: string; sort?: string; direction?: string };
     urls: { index: string; create: string };
 }>();
@@ -190,11 +196,23 @@ const KPI_STORAGE_KEY = 'lunar.panel.customers.kpisDismissed';
 const kpisDismissed = ref(localStorage.getItem(KPI_STORAGE_KEY) === '1');
 watch(kpisDismissed, (value) => localStorage.setItem(KPI_STORAGE_KEY, value ? '1' : '0'));
 
+// The lifetime-value delta compares against the average as it stood 30 days
+// ago; a drop stays neutral rather than alarming.
+const lifetimeValueDelta = computed(() => {
+    const delta = props.kpis.avgLifetimeValueDelta;
+
+    if (delta === null) {
+        return undefined;
+    }
+
+    return { value: `${delta > 0 ? '+' : ''}${delta}%`, tone: delta >= 0 ? ('sage' as const) : ('neutral' as const) };
+});
+
 const kpis = computed(() => [
-    { label: t('customers.kpi_total_label'), value: props.kpis.total, hint: t('customers.kpi_total_hint'), tone: 'neutral' as const, icon: 'users' },
-    { label: t('customers.kpi_new_label'), value: props.kpis.newLast30Days, hint: t('customers.kpi_new_hint'), tone: 'sage' as const, icon: 'userPlus' },
-    { label: t('customers.kpi_business_label'), value: props.kpis.business, hint: t('customers.kpi_business_hint'), tone: 'neutral' as const, icon: 'building' },
-    { label: t('customers.kpi_with_account_label'), value: props.kpis.withAccount, hint: t('customers.kpi_with_account_hint'), tone: 'sage' as const, icon: 'user' },
+    { label: t('customers.kpi_total_label'), value: props.kpis.total, hint: t('customers.kpi_total_hint'), tone: 'neutral' as const, icon: 'users', delta: undefined },
+    { label: t('customers.kpi_new_label'), value: props.kpis.newLast30Days, hint: t('customers.kpi_new_hint'), tone: 'sage' as const, icon: 'userPlus', delta: undefined },
+    { label: t('customers.kpi_business_label'), value: props.kpis.business, hint: t('customers.kpi_business_hint'), tone: 'neutral' as const, icon: 'building', delta: undefined },
+    { label: t('customers.kpi_ltv_label'), value: props.kpis.avgLifetimeValue ?? '—', hint: t('customers.kpi_ltv_hint'), tone: 'sage' as const, icon: 'chart', delta: lifetimeValueDelta.value },
 ]);
 
 const initials = (firstName: string, lastName: string): string =>
@@ -253,6 +271,7 @@ const formatShortDate = (value: string): string =>
                             :hint="kpi.hint"
                             :tone="kpi.tone"
                             :icon="kpi.icon"
+                            :delta="kpi.delta"
                         />
                     </div>
                     <button
diff --git a/packages/panel/resources/lang/ar/customers.php b/packages/panel/resources/lang/ar/customers.php
index 826a09dbfa..609342f52c 100644
--- a/packages/panel/resources/lang/ar/customers.php
+++ b/packages/panel/resources/lang/ar/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'انضموا خلال آخر 30 يومًا',
     'kpi_business_label' => 'حسابات B2B',
     'kpi_business_hint' => 'عملاء لديهم شركة',
-    'kpi_with_account_label' => 'يمكنه تسجيل الدخول',
-    'kpi_with_account_hint' => 'مرتبطون بحساب مستخدم',
+    'kpi_ltv_label' => 'متوسط القيمة الدائمة',
+    'kpi_ltv_hint' => 'بين العملاء الذين لديهم طلبات',
 
     'column_customer' => 'العميل',
     'column_company' => 'الشركة',
diff --git a/packages/panel/resources/lang/bg/customers.php b/packages/panel/resources/lang/bg/customers.php
index 328dbed9c4..b74be00800 100644
--- a/packages/panel/resources/lang/bg/customers.php
+++ b/packages/panel/resources/lang/bg/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'присъединили се през последните 30 дни',
     'kpi_business_label' => 'B2B акаунти',
     'kpi_business_hint' => 'клиенти с фирма',
-    'kpi_with_account_label' => 'Може да влиза',
-    'kpi_with_account_hint' => 'свързани с потребителски акаунт',
+    'kpi_ltv_label' => 'Средна стойност на клиент',
+    'kpi_ltv_hint' => 'сред клиенти с поръчки',
 
     'column_customer' => 'Клиент',
     'column_company' => 'Фирма',
diff --git a/packages/panel/resources/lang/de/customers.php b/packages/panel/resources/lang/de/customers.php
index f330cb49ae..1d4ca7956d 100644
--- a/packages/panel/resources/lang/de/customers.php
+++ b/packages/panel/resources/lang/de/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'in den letzten 30 Tagen beigetreten',
     'kpi_business_label' => 'B2B-Konten',
     'kpi_business_hint' => 'Kunden mit Firma',
-    'kpi_with_account_label' => 'Anmeldefähig',
-    'kpi_with_account_hint' => 'mit einem Benutzerkonto verknüpft',
+    'kpi_ltv_label' => 'Ø Kundenwert',
+    'kpi_ltv_hint' => 'über Kunden mit Bestellungen',
 
     'column_customer' => 'Kunde',
     'column_company' => 'Firma',
diff --git a/packages/panel/resources/lang/en/customers.php b/packages/panel/resources/lang/en/customers.php
index d3ca8f96e3..34329c4ab6 100644
--- a/packages/panel/resources/lang/en/customers.php
+++ b/packages/panel/resources/lang/en/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'joined in the last 30 days',
     'kpi_business_label' => 'B2B accounts',
     'kpi_business_hint' => 'customers with a company',
-    'kpi_with_account_label' => 'Can sign in',
-    'kpi_with_account_hint' => 'linked to a user account',
+    'kpi_ltv_label' => 'Avg lifetime value',
+    'kpi_ltv_hint' => 'across customers with orders',
 
     'column_customer' => 'Customer',
     'column_company' => 'Company',
diff --git a/packages/panel/resources/lang/es/customers.php b/packages/panel/resources/lang/es/customers.php
index c0cea85910..7e85ba9808 100644
--- a/packages/panel/resources/lang/es/customers.php
+++ b/packages/panel/resources/lang/es/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'registrados en los últimos 30 días',
     'kpi_business_label' => 'Cuentas B2B',
     'kpi_business_hint' => 'clientes con empresa',
-    'kpi_with_account_label' => 'Puede iniciar sesión',
-    'kpi_with_account_hint' => 'vinculados a una cuenta de usuario',
+    'kpi_ltv_label' => 'Valor medio de por vida',
+    'kpi_ltv_hint' => 'entre clientes con pedidos',
 
     'column_customer' => 'Cliente',
     'column_company' => 'Empresa',
diff --git a/packages/panel/resources/lang/fa/customers.php b/packages/panel/resources/lang/fa/customers.php
index 954f669164..494ebee8de 100644
--- a/packages/panel/resources/lang/fa/customers.php
+++ b/packages/panel/resources/lang/fa/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'در ۳۰ روز گذشته پیوسته‌اند',
     'kpi_business_label' => 'حساب‌های B2B',
     'kpi_business_hint' => 'مشتریان دارای شرکت',
-    'kpi_with_account_label' => 'امکان ورود',
-    'kpi_with_account_hint' => 'متصل به حساب کاربری',
+    'kpi_ltv_label' => 'میانگین ارزش مشتری',
+    'kpi_ltv_hint' => 'در میان مشتریان دارای سفارش',
 
     'column_customer' => 'مشتری',
     'column_company' => 'شرکت',
diff --git a/packages/panel/resources/lang/fr/customers.php b/packages/panel/resources/lang/fr/customers.php
index 65c83136cc..c03fb12a2f 100644
--- a/packages/panel/resources/lang/fr/customers.php
+++ b/packages/panel/resources/lang/fr/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'inscrits au cours des 30 derniers jours',
     'kpi_business_label' => 'Comptes B2B',
     'kpi_business_hint' => 'clients avec une société',
-    'kpi_with_account_label' => 'Peut se connecter',
-    'kpi_with_account_hint' => 'liés à un compte utilisateur',
+    'kpi_ltv_label' => 'Valeur vie moyenne',
+    'kpi_ltv_hint' => 'parmi les clients avec commandes',
 
     'column_customer' => 'Client',
     'column_company' => 'Société',
diff --git a/packages/panel/resources/lang/hr/customers.php b/packages/panel/resources/lang/hr/customers.php
index 07518b897e..5dd2fe2332 100644
--- a/packages/panel/resources/lang/hr/customers.php
+++ b/packages/panel/resources/lang/hr/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'pridružili se u zadnjih 30 dana',
     'kpi_business_label' => 'B2B računi',
     'kpi_business_hint' => 'kupci s tvrtkom',
-    'kpi_with_account_label' => 'Može se prijaviti',
-    'kpi_with_account_hint' => 'povezani s korisničkim računom',
+    'kpi_ltv_label' => 'Prosj. vrijednost kupca',
+    'kpi_ltv_hint' => 'među kupcima s narudžbama',
 
     'column_customer' => 'Kupac',
     'column_company' => 'Tvrtka',
diff --git a/packages/panel/resources/lang/hu/customers.php b/packages/panel/resources/lang/hu/customers.php
index 77f2508874..1b4bfb842f 100644
--- a/packages/panel/resources/lang/hu/customers.php
+++ b/packages/panel/resources/lang/hu/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'az elmúlt 30 napban csatlakozott',
     'kpi_business_label' => 'B2B fiókok',
     'kpi_business_hint' => 'céggel rendelkező ügyfelek',
-    'kpi_with_account_label' => 'Bejelentkezhet',
-    'kpi_with_account_hint' => 'felhasználói fiókhoz kapcsolva',
+    'kpi_ltv_label' => 'Átl. ügyfélérték',
+    'kpi_ltv_hint' => 'rendeléssel rendelkező ügyfelek között',
 
     'column_customer' => 'Ügyfél',
     'column_company' => 'Cég',
diff --git a/packages/panel/resources/lang/mn/customers.php b/packages/panel/resources/lang/mn/customers.php
index c7c7fbba0a..c202415169 100644
--- a/packages/panel/resources/lang/mn/customers.php
+++ b/packages/panel/resources/lang/mn/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'сүүлийн 30 хоногт нэгдсэн',
     'kpi_business_label' => 'B2B данс',
     'kpi_business_hint' => 'компанитай харилцагчид',
-    'kpi_with_account_label' => 'Нэвтрэх боломжтой',
-    'kpi_with_account_hint' => 'хэрэглэгчийн данстай холбогдсон',
+    'kpi_ltv_label' => 'Дундаж насан туршийн үнэ цэн',
+    'kpi_ltv_hint' => 'захиалгатай харилцагчдын дунд',
 
     'column_customer' => 'Харилцагч',
     'column_company' => 'Компани',
diff --git a/packages/panel/resources/lang/nl/customers.php b/packages/panel/resources/lang/nl/customers.php
index 34519ac0e4..85cf040753 100644
--- a/packages/panel/resources/lang/nl/customers.php
+++ b/packages/panel/resources/lang/nl/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'aangesloten in de laatste 30 dagen',
     'kpi_business_label' => 'B2B-accounts',
     'kpi_business_hint' => 'klanten met een bedrijf',
-    'kpi_with_account_label' => 'Kan inloggen',
-    'kpi_with_account_hint' => 'gekoppeld aan een gebruikersaccount',
+    'kpi_ltv_label' => 'Gem. klantwaarde',
+    'kpi_ltv_hint' => 'over klanten met bestellingen',
 
     'column_customer' => 'Klant',
     'column_company' => 'Bedrijf',
diff --git a/packages/panel/resources/lang/pl/customers.php b/packages/panel/resources/lang/pl/customers.php
index 55daaf3d79..4d44870c39 100644
--- a/packages/panel/resources/lang/pl/customers.php
+++ b/packages/panel/resources/lang/pl/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'dołączyli w ciągu ostatnich 30 dni',
     'kpi_business_label' => 'Konta B2B',
     'kpi_business_hint' => 'klienci z firmą',
-    'kpi_with_account_label' => 'Może się logować',
-    'kpi_with_account_hint' => 'powiązani z kontem użytkownika',
+    'kpi_ltv_label' => 'Śr. wartość klienta',
+    'kpi_ltv_hint' => 'wśród klientów z zamówieniami',
 
     'column_customer' => 'Klient',
     'column_company' => 'Firma',
diff --git a/packages/panel/resources/lang/pt_BR/customers.php b/packages/panel/resources/lang/pt_BR/customers.php
index ccff7a7fa2..8568b38250 100644
--- a/packages/panel/resources/lang/pt_BR/customers.php
+++ b/packages/panel/resources/lang/pt_BR/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'cadastrados nos últimos 30 dias',
     'kpi_business_label' => 'Contas B2B',
     'kpi_business_hint' => 'clientes com empresa',
-    'kpi_with_account_label' => 'Pode entrar',
-    'kpi_with_account_hint' => 'vinculados a uma conta de usuário',
+    'kpi_ltv_label' => 'Valor médio do cliente',
+    'kpi_ltv_hint' => 'entre clientes com pedidos',
 
     'column_customer' => 'Cliente',
     'column_company' => 'Empresa',
diff --git a/packages/panel/resources/lang/ro/customers.php b/packages/panel/resources/lang/ro/customers.php
index 093016bba8..7477a2c6b2 100644
--- a/packages/panel/resources/lang/ro/customers.php
+++ b/packages/panel/resources/lang/ro/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'înscriși în ultimele 30 de zile',
     'kpi_business_label' => 'Conturi B2B',
     'kpi_business_hint' => 'clienți cu companie',
-    'kpi_with_account_label' => 'Se poate autentifica',
-    'kpi_with_account_hint' => 'legați de un cont de utilizator',
+    'kpi_ltv_label' => 'Valoare medie pe client',
+    'kpi_ltv_hint' => 'între clienții cu comenzi',
 
     'column_customer' => 'Client',
     'column_company' => 'Companie',
diff --git a/packages/panel/resources/lang/tr/customers.php b/packages/panel/resources/lang/tr/customers.php
index 030ba53e5b..7600368ae3 100644
--- a/packages/panel/resources/lang/tr/customers.php
+++ b/packages/panel/resources/lang/tr/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'son 30 günde katıldı',
     'kpi_business_label' => 'B2B hesapları',
     'kpi_business_hint' => 'şirketi olan müşteriler',
-    'kpi_with_account_label' => 'Giriş yapabilir',
-    'kpi_with_account_hint' => 'bir kullanıcı hesabına bağlı',
+    'kpi_ltv_label' => 'Ort. yaşam boyu değer',
+    'kpi_ltv_hint' => 'siparişi olan müşteriler arasında',
 
     'column_customer' => 'Müşteri',
     'column_company' => 'Şirket',
diff --git a/packages/panel/resources/lang/vi/customers.php b/packages/panel/resources/lang/vi/customers.php
index f56135a599..2ed90a2e7e 100644
--- a/packages/panel/resources/lang/vi/customers.php
+++ b/packages/panel/resources/lang/vi/customers.php
@@ -26,8 +26,8 @@
     'kpi_new_hint' => 'tham gia trong 30 ngày qua',
     'kpi_business_label' => 'Tài khoản B2B',
     'kpi_business_hint' => 'khách hàng có công ty',
-    'kpi_with_account_label' => 'Có thể đăng nhập',
-    'kpi_with_account_hint' => 'liên kết với tài khoản người dùng',
+    'kpi_ltv_label' => 'Giá trị trọn đời TB',
+    'kpi_ltv_hint' => 'trên khách hàng có đơn hàng',
 
     'column_customer' => 'Khách hàng',
     'column_company' => 'Công ty',
diff --git a/packages/panel/src/Http/Controllers/Customers/CustomerIndexController.php b/packages/panel/src/Http/Controllers/Customers/CustomerIndexController.php
index 68a1e31eaa..79b8511719 100644
--- a/packages/panel/src/Http/Controllers/Customers/CustomerIndexController.php
+++ b/packages/panel/src/Http/Controllers/Customers/CustomerIndexController.php
@@ -3,6 +3,7 @@
 namespace Lunar\Panel\Http\Controllers\Customers;
 
 use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Cache;
 use Inertia\Inertia;
 use Inertia\Response;
 use Lunar\Core\DataObjects\PriceValue;
@@ -121,19 +122,12 @@ public function index(Request $request): Response
                 return $row;
             });
 
-        $totalCount = Customer::count();
-
         return Inertia::render('customers/Index', [
             'customers' => $customers,
             ...$this->tableProps($resolver, $this->columns, $request),
             'customerGroups' => CustomerGroup::all(['id', 'name']),
-            'totalCount' => $totalCount,
-            'kpis' => [
-                'total' => $totalCount,
-                'newLast30Days' => Customer::where('created_at', '>=', now()->subDays(30))->count(),
-                'business' => Customer::whereNotNull('company_name')->where('company_name', '!=', '')->count(),
-                'withAccount' => Customer::has('users')->count(),
-            ],
+            'totalCount' => Customer::count(),
+            'kpis' => $this->kpis(),
             'filters' => $request->only(['q', 'customer_group_id', 'type', 'sort', 'direction']),
             'urls' => [
                 'index' => route('panel.customers.index'),
@@ -141,4 +135,46 @@ public function index(Request $request): Response
             ],
         ]);
     }
+
+    /**
+     * KPI strip values. Everything here is an aggregate over whole tables, so
+     * the block is cached briefly: on stores with very large customer or order
+     * tables these queries are the expensive part of the page, and the strip
+     * does not need to be second-accurate. Average lifetime value is a single
+     * aggregate over placed orders (default-currency basis, like everywhere
+     * else); its delta compares against the average as it stood 30 days ago.
+     *
+     * @return array{total: int, newLast30Days: int, business: int, avgLifetimeValue: ?string, avgLifetimeValueDelta: ?int}
+     */
+    protected function kpis(): array
+    {
+        return Cache::remember('lunar.panel.customers.kpis', now()->addMinutes(5), function (): array {
+            $lifetime = fn () => Order::query()
+                ->whereNotNull('placed_at')
+                ->whereNotNull('customer_id')
+                ->selectRaw('COALESCE(SUM(total / NULLIF(exchange_rate, 0)), 0) AS spend, COUNT(DISTINCT customer_id) AS customers');
+
+            $current = $lifetime()->first();
+            $prior = $lifetime()->where('placed_at', '<', now()->subDays(30))->first();
+
+            $average = fn ($row): int => $row->customers ? (int) round($row->spend / $row->customers) : 0;
+
+            $currentAverage = $average($current);
+            $priorAverage = $average($prior);
+
+            $defaultCurrency = Currency::getDefault();
+
+            return [
+                'total' => Customer::count(),
+                'newLast30Days' => Customer::where('created_at', '>=', now()->subDays(30))->count(),
+                'business' => Customer::whereNotNull('company_name')->where('company_name', '!=', '')->count(),
+                'avgLifetimeValue' => $currentAverage && $defaultCurrency
+                    ? (new PriceValue($currentAverage, $defaultCurrency))->format()
+                    : null,
+                'avgLifetimeValueDelta' => $priorAverage > 0
+                    ? (int) round(($currentAverage - $priorAverage) / $priorAverage * 100)
+                    : null,
+            ];
+        });
+    }
 }
diff --git a/tests/panel/Feature/Customers/CustomerIndexTest.php b/tests/panel/Feature/Customers/CustomerIndexTest.php
index c6356e20d1..4d9e67033d 100644
--- a/tests/panel/Feature/Customers/CustomerIndexTest.php
+++ b/tests/panel/Feature/Customers/CustomerIndexTest.php
@@ -102,15 +102,52 @@
     Customer::factory()->create(['company_name' => 'Acme Ltd']);
     Customer::factory()->create(['company_name' => null, 'created_at' => now()->subDays(40)]);
 
-    $withUser = Customer::factory()->create(['company_name' => null]);
-    $withUser->users()->attach(User::factory()->create());
+    Customer::factory()->create(['company_name' => null]);
 
     $this->get(route('panel.customers.index'))
         ->assertInertia(fn (Assert $page) => $page
             ->where('kpis.total', 3)
             ->where('kpis.newLast30Days', 2)
             ->where('kpis.business', 1)
-            ->where('kpis.withAccount', 1)
+            ->where('kpis.avgLifetimeValue', null)
+            ->where('kpis.avgLifetimeValueDelta', null)
+        );
+});
+
+it('reports the average lifetime value across customers with orders', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    Currency::factory()->create(['code' => 'GBP', 'default' => true, 'exchange_rate' => 1]);
+
+    $first = Customer::factory()->create();
+    Order::factory()->placed()->for($first)->create(['total' => 10000, 'exchange_rate' => 1]);
+    Order::factory()->placed()->for($first)->create(['total' => 5000, 'exchange_rate' => 1]);
+
+    $second = Customer::factory()->create();
+    Order::factory()->placed()->for($second)->create(['total' => 5000, 'exchange_rate' => 1]);
+
+    // (150 + 50) / 2 customers = £100.00; no orders predate the 30-day window, so no delta.
+    $this->get(route('panel.customers.index'))
+        ->assertInertia(fn (Assert $page) => $page
+            ->where('kpis.avgLifetimeValue', '£100.00')
+            ->where('kpis.avgLifetimeValueDelta', null)
+        );
+});
+
+it('reports the lifetime value delta against the average 30 days ago', function () {
+    $this->actingAs(Staff::factory()->create(['admin' => true]), 'staff');
+
+    Currency::factory()->create(['code' => 'GBP', 'default' => true, 'exchange_rate' => 1]);
+
+    $customer = Customer::factory()->create();
+    Order::factory()->placed()->for($customer)->create(['total' => 10000, 'exchange_rate' => 1, 'placed_at' => now()->subDays(40)]);
+    Order::factory()->placed()->for($customer)->create(['total' => 2000, 'exchange_rate' => 1]);
+
+    // Average moved from £100.00 to £120.00: +20%.
+    $this->get(route('panel.customers.index'))
+        ->assertInertia(fn (Assert $page) => $page
+            ->where('kpis.avgLifetimeValue', '£120.00')
+            ->where('kpis.avgLifetimeValueDelta', 20)
         );
 });
 

From abb3a23e4295a62d34860c9838ca2dd6c66ccdfb Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Fri, 17 Jul 2026 09:17:44 +0100
Subject: [PATCH 15/19] Add a clear-filters text link to the customer index
 toolbar

Sits to the right of the filter dropdowns, only while a search, filter,
or add-on filter is active; plain underlined text, reusing the existing
clearFilters behaviour and lang key.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 packages/panel/resources/js/pages/customers/Index.vue | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/packages/panel/resources/js/pages/customers/Index.vue b/packages/panel/resources/js/pages/customers/Index.vue
index dc6c9c99f4..e8e458ab85 100644
--- a/packages/panel/resources/js/pages/customers/Index.vue
+++ b/packages/panel/resources/js/pages/customers/Index.vue
@@ -307,6 +307,12 @@ const formatShortDate = (value: string): string =>
                             default-value=""
                         />
                         <FilterDropdown v-model="sortKey" :label="t('common.sort')" :options="sortOptions" default-value="recent" />
+                        <button
+                            v-if="hasActiveFilters"
+                            type="button"
+                            class="text-[12px] text-ink-500 underline underline-offset-2 whitespace-nowrap rounded-sm hover:text-ink-900 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sage/35"
+                            @click="clearFilters"
+                        >{{ t('customers.clear_filters') }}</button>
                         <div class="flex-1" />
                         <span class="text-[11.5px] text-ink-500 whitespace-nowrap">{{ t('customers.count_of', { shown: customers.total, total: totalCount }) }}</span>
                         <Button v-if="kpisDismissed" icon="chart" @click="kpisDismissed = false">

From 6c1a8769353ab623325b4a3bfb9fdfd3fbe1a78e Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Fri, 17 Jul 2026 09:23:17 +0100
Subject: [PATCH 16/19] Add a clearable option to TextInput and use it on the
 customer search

An inline X shows while a clearable input holds a value (hidden when
disabled); clicking it empties the value and refocuses the input. New
common.clear key across all 16 locales.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../resources/js/components/TextInput.test.ts | 35 +++++++++++++++++++
 .../resources/js/components/TextInput.vue     | 26 +++++++++++++-
 .../resources/js/pages/customers/Index.vue    |  2 +-
 packages/panel/resources/lang/ar/common.php   |  1 +
 packages/panel/resources/lang/bg/common.php   |  1 +
 packages/panel/resources/lang/de/common.php   |  1 +
 packages/panel/resources/lang/en/common.php   |  1 +
 packages/panel/resources/lang/es/common.php   |  1 +
 packages/panel/resources/lang/fa/common.php   |  1 +
 packages/panel/resources/lang/fr/common.php   |  1 +
 packages/panel/resources/lang/hr/common.php   |  1 +
 packages/panel/resources/lang/hu/common.php   |  1 +
 packages/panel/resources/lang/mn/common.php   |  1 +
 packages/panel/resources/lang/nl/common.php   |  1 +
 packages/panel/resources/lang/pl/common.php   |  1 +
 .../panel/resources/lang/pt_BR/common.php     |  1 +
 packages/panel/resources/lang/ro/common.php   |  1 +
 packages/panel/resources/lang/tr/common.php   |  1 +
 packages/panel/resources/lang/vi/common.php   |  1 +
 19 files changed, 77 insertions(+), 2 deletions(-)
 create mode 100644 packages/panel/resources/js/components/TextInput.test.ts

diff --git a/packages/panel/resources/js/components/TextInput.test.ts b/packages/panel/resources/js/components/TextInput.test.ts
new file mode 100644
index 0000000000..fa9fd0c8ff
--- /dev/null
+++ b/packages/panel/resources/js/components/TextInput.test.ts
@@ -0,0 +1,35 @@
+import { describe, expect, it } from 'vitest';
+import { mount } from '@vue/test-utils';
+import TextInput from './TextInput.vue';
+
+describe('TextInput', () => {
+    it('shows no clear button unless clearable', () => {
+        const wrapper = mount(TextInput, { props: { modelValue: 'hello' } });
+
+        expect(wrapper.find('button').exists()).toBe(false);
+    });
+
+    it('shows the clear button only while a clearable input holds a value', async () => {
+        const wrapper = mount(TextInput, { props: { modelValue: '', clearable: true } });
+
+        expect(wrapper.find('button').exists()).toBe(false);
+
+        await wrapper.setProps({ modelValue: 'hello' });
+
+        expect(wrapper.find('button').exists()).toBe(true);
+    });
+
+    it('emits an empty value when cleared', async () => {
+        const wrapper = mount(TextInput, { props: { modelValue: 'hello', clearable: true } });
+
+        await wrapper.find('button').trigger('click');
+
+        expect(wrapper.emitted('update:modelValue')).toEqual([['']]);
+    });
+
+    it('hides the clear button while disabled', () => {
+        const wrapper = mount(TextInput, { props: { modelValue: 'hello', clearable: true, disabled: true } });
+
+        expect(wrapper.find('button').exists()).toBe(false);
+    });
+});
diff --git a/packages/panel/resources/js/components/TextInput.vue b/packages/panel/resources/js/components/TextInput.vue
index 1086f6c8a7..95f0d40f5a 100644
--- a/packages/panel/resources/js/components/TextInput.vue
+++ b/packages/panel/resources/js/components/TextInput.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
 import { computed, ref, useSlots } from 'vue';
+import { useI18n } from 'vue-i18n';
+import Icon from './Icon.vue';
 
 const props = withDefaults(
     defineProps<{
@@ -11,14 +13,22 @@ const props = withDefaults(
         disabled?: boolean;
         autocomplete?: string;
         ariaLabel?: string;
+        /** Shows an inline clear button while the input holds a value. */
+        clearable?: boolean;
     }>(),
     { modelValue: '', type: 'text' },
 );
 
 const emit = defineEmits<{ 'update:modelValue': [value: string] }>();
 
+const { t } = useI18n();
+
 const slots = useSlots();
-const grouped = computed(() => !!slots.prefix || !!slots.suffix);
+// The clear button lives inside the grouped wrapper, so clearable inputs
+// always render as a group even without affix slots.
+const grouped = computed(() => !!slots.prefix || !!slots.suffix || props.clearable);
+
+const showClear = computed(() => props.clearable && String(props.modelValue ?? '').length > 0 && !props.disabled);
 
 const wrapperCls = computed(() => [
     'flex border rounded-md bg-surface overflow-hidden focus-within:ring-3',
@@ -46,6 +56,11 @@ const onInput = (e: Event) => {
 
 const inputRef = ref<HTMLInputElement | null>(null);
 
+const clear = (): void => {
+    emit('update:modelValue', '');
+    inputRef.value?.focus();
+};
+
 defineExpose({ focus: () => inputRef.value?.focus() });
 </script>
 
@@ -66,6 +81,15 @@ defineExpose({ focus: () => inputRef.value?.focus() });
             :aria-label="ariaLabel"
             @input="onInput"
         />
+        <button
+            v-if="showClear"
+            type="button"
+            class="flex items-center px-2 text-ink-400 hover:text-ink-700 focus-visible:outline-none focus-visible:text-ink-700"
+            :aria-label="t('common.clear')"
+            @click="clear"
+        >
+            <Icon name="x" cls="sm" />
+        </button>
         <span
             v-if="$slots.suffix"
             class="flex items-center px-2.5 bg-surface-2 border-l border-line text-ink-500 font-mono text-xs whitespace-nowrap"
diff --git a/packages/panel/resources/js/pages/customers/Index.vue b/packages/panel/resources/js/pages/customers/Index.vue
index e8e458ab85..f17664942c 100644
--- a/packages/panel/resources/js/pages/customers/Index.vue
+++ b/packages/panel/resources/js/pages/customers/Index.vue
@@ -291,7 +291,7 @@ const formatShortDate = (value: string): string =>
                 <div class="flex flex-wrap items-center gap-2 mb-4 min-h-[34px]">
                     <template v-if="!(hasBulkActions && selected.length)">
                         <div class="flex-1 max-w-[280px] min-w-[180px]">
-                            <TextInput v-model="q" :placeholder="t('customers.search_placeholder')">
+                            <TextInput v-model="q" clearable :placeholder="t('customers.search_placeholder')">
                                 <template #prefix><Icon name="search" cls="sm" /></template>
                             </TextInput>
                         </div>
diff --git a/packages/panel/resources/lang/ar/common.php b/packages/panel/resources/lang/ar/common.php
index 21a0909509..13863b56d0 100644
--- a/packages/panel/resources/lang/ar/common.php
+++ b/packages/panel/resources/lang/ar/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'المزيد من الإجراءات',
     'select_all_rows' => 'تحديد كل الصفوف',
     'close' => 'إغلاق',
+    'clear' => 'مسح',
     'locked' => 'مقفل',
     'toggle_options' => 'إظهار أو إخفاء الخيارات',
     'breadcrumb' => 'مسار التنقل',
diff --git a/packages/panel/resources/lang/bg/common.php b/packages/panel/resources/lang/bg/common.php
index 567d5b9103..9f240e897e 100644
--- a/packages/panel/resources/lang/bg/common.php
+++ b/packages/panel/resources/lang/bg/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'Още действия',
     'select_all_rows' => 'Избиране на всички редове',
     'close' => 'Затвори',
+    'clear' => 'Изчисти',
     'locked' => 'Заключено',
     'toggle_options' => 'Показване или скриване на опциите',
     'breadcrumb' => 'Навигационна пътека',
diff --git a/packages/panel/resources/lang/de/common.php b/packages/panel/resources/lang/de/common.php
index 6ac0ffca78..266efe9537 100644
--- a/packages/panel/resources/lang/de/common.php
+++ b/packages/panel/resources/lang/de/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'Weitere Aktionen',
     'select_all_rows' => 'Alle Zeilen auswählen',
     'close' => 'Schließen',
+    'clear' => 'Leeren',
     'locked' => 'Gesperrt',
     'toggle_options' => 'Optionen ein- oder ausblenden',
     'breadcrumb' => 'Breadcrumb-Navigation',
diff --git a/packages/panel/resources/lang/en/common.php b/packages/panel/resources/lang/en/common.php
index ce3a0baca6..9280fce330 100644
--- a/packages/panel/resources/lang/en/common.php
+++ b/packages/panel/resources/lang/en/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'More actions',
     'select_all_rows' => 'Select all rows',
     'close' => 'Close',
+    'clear' => 'Clear',
     'locked' => 'Locked',
     'toggle_options' => 'Toggle options',
     'breadcrumb' => 'Breadcrumb',
diff --git a/packages/panel/resources/lang/es/common.php b/packages/panel/resources/lang/es/common.php
index 12d710e011..31d33c8c9a 100644
--- a/packages/panel/resources/lang/es/common.php
+++ b/packages/panel/resources/lang/es/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'Más acciones',
     'select_all_rows' => 'Seleccionar todas las filas',
     'close' => 'Cerrar',
+    'clear' => 'Borrar',
     'locked' => 'Bloqueado',
     'toggle_options' => 'Mostrar u ocultar opciones',
     'breadcrumb' => 'Ruta de navegación',
diff --git a/packages/panel/resources/lang/fa/common.php b/packages/panel/resources/lang/fa/common.php
index 2186419dfd..9ba70a5dc8 100644
--- a/packages/panel/resources/lang/fa/common.php
+++ b/packages/panel/resources/lang/fa/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'اقدامات بیشتر',
     'select_all_rows' => 'انتخاب همه ردیف‌ها',
     'close' => 'بستن',
+    'clear' => 'پاک کردن',
     'locked' => 'قفل شده',
     'toggle_options' => 'نمایش یا پنهان کردن گزینه‌ها',
     'breadcrumb' => 'مسیر راهنما',
diff --git a/packages/panel/resources/lang/fr/common.php b/packages/panel/resources/lang/fr/common.php
index 06d3a7986a..3f4d6ca76c 100644
--- a/packages/panel/resources/lang/fr/common.php
+++ b/packages/panel/resources/lang/fr/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'Plus d\'actions',
     'select_all_rows' => 'Sélectionner toutes les lignes',
     'close' => 'Fermer',
+    'clear' => 'Effacer',
     'locked' => 'Verrouillé',
     'toggle_options' => 'Afficher ou masquer les options',
     'breadcrumb' => 'Fil d\'Ariane',
diff --git a/packages/panel/resources/lang/hr/common.php b/packages/panel/resources/lang/hr/common.php
index 908bc359fa..7e2606de52 100644
--- a/packages/panel/resources/lang/hr/common.php
+++ b/packages/panel/resources/lang/hr/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'Više radnji',
     'select_all_rows' => 'Odaberi sve retke',
     'close' => 'Zatvori',
+    'clear' => 'Očisti',
     'locked' => 'Zaključano',
     'toggle_options' => 'Prikaži ili sakrij opcije',
     'breadcrumb' => 'Navigacijska staza',
diff --git a/packages/panel/resources/lang/hu/common.php b/packages/panel/resources/lang/hu/common.php
index 7d5944af1b..e29e8a2d86 100644
--- a/packages/panel/resources/lang/hu/common.php
+++ b/packages/panel/resources/lang/hu/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'További műveletek',
     'select_all_rows' => 'Összes sor kijelölése',
     'close' => 'Bezárás',
+    'clear' => 'Törlés',
     'locked' => 'Zárolva',
     'toggle_options' => 'Opciók megjelenítése vagy elrejtése',
     'breadcrumb' => 'Navigációs útvonal',
diff --git a/packages/panel/resources/lang/mn/common.php b/packages/panel/resources/lang/mn/common.php
index faf45a38cb..ae766afc08 100644
--- a/packages/panel/resources/lang/mn/common.php
+++ b/packages/panel/resources/lang/mn/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'Бусад үйлдэл',
     'select_all_rows' => 'Бүх мөрийг сонгох',
     'close' => 'Хаах',
+    'clear' => 'Цэвэрлэх',
     'locked' => 'Түгжээтэй',
     'toggle_options' => 'Сонголтуудыг харуулах эсвэл нуух',
     'breadcrumb' => 'Навигацийн зам',
diff --git a/packages/panel/resources/lang/nl/common.php b/packages/panel/resources/lang/nl/common.php
index 700d37cc07..09ed8a1831 100644
--- a/packages/panel/resources/lang/nl/common.php
+++ b/packages/panel/resources/lang/nl/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'Meer acties',
     'select_all_rows' => 'Alle rijen selecteren',
     'close' => 'Sluiten',
+    'clear' => 'Wissen',
     'locked' => 'Vergrendeld',
     'toggle_options' => 'Opties tonen of verbergen',
     'breadcrumb' => 'Kruimelpad',
diff --git a/packages/panel/resources/lang/pl/common.php b/packages/panel/resources/lang/pl/common.php
index f262e6702d..4b027b8b89 100644
--- a/packages/panel/resources/lang/pl/common.php
+++ b/packages/panel/resources/lang/pl/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'Więcej akcji',
     'select_all_rows' => 'Zaznacz wszystkie wiersze',
     'close' => 'Zamknij',
+    'clear' => 'Wyczyść',
     'locked' => 'Zablokowane',
     'toggle_options' => 'Pokaż lub ukryj opcje',
     'breadcrumb' => 'Ścieżka nawigacji',
diff --git a/packages/panel/resources/lang/pt_BR/common.php b/packages/panel/resources/lang/pt_BR/common.php
index acb28adb91..5d71ad6b72 100644
--- a/packages/panel/resources/lang/pt_BR/common.php
+++ b/packages/panel/resources/lang/pt_BR/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'Mais ações',
     'select_all_rows' => 'Selecionar todas as linhas',
     'close' => 'Fechar',
+    'clear' => 'Limpar',
     'locked' => 'Bloqueado',
     'toggle_options' => 'Mostrar ou ocultar opções',
     'breadcrumb' => 'Trilha de navegação',
diff --git a/packages/panel/resources/lang/ro/common.php b/packages/panel/resources/lang/ro/common.php
index fcceffb391..8576456edf 100644
--- a/packages/panel/resources/lang/ro/common.php
+++ b/packages/panel/resources/lang/ro/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'Mai multe acțiuni',
     'select_all_rows' => 'Selectează toate rândurile',
     'close' => 'Închide',
+    'clear' => 'Golește',
     'locked' => 'Blocat',
     'toggle_options' => 'Afișează sau ascunde opțiunile',
     'breadcrumb' => 'Cale de navigare',
diff --git a/packages/panel/resources/lang/tr/common.php b/packages/panel/resources/lang/tr/common.php
index deb01ec419..aa12b61f78 100644
--- a/packages/panel/resources/lang/tr/common.php
+++ b/packages/panel/resources/lang/tr/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'Diğer işlemler',
     'select_all_rows' => 'Tüm satırları seç',
     'close' => 'Kapat',
+    'clear' => 'Temizle',
     'locked' => 'Kilitli',
     'toggle_options' => 'Seçenekleri göster veya gizle',
     'breadcrumb' => 'Gezinme yolu',
diff --git a/packages/panel/resources/lang/vi/common.php b/packages/panel/resources/lang/vi/common.php
index f8cb9a2f2b..df9a9a3e23 100644
--- a/packages/panel/resources/lang/vi/common.php
+++ b/packages/panel/resources/lang/vi/common.php
@@ -23,6 +23,7 @@
     'more_actions' => 'Thao tác khác',
     'select_all_rows' => 'Chọn tất cả các hàng',
     'close' => 'Đóng',
+    'clear' => 'Xóa',
     'locked' => 'Đã khóa',
     'toggle_options' => 'Hiện hoặc ẩn tùy chọn',
     'breadcrumb' => 'Đường dẫn điều hướng',

From c92c90a95f6ed36377dfc8febbc1ca04c5947655 Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Fri, 17 Jul 2026 10:27:52 +0100
Subject: [PATCH 17/19] Render KpiCard as a static div unless a click handler
 is bound

The stat tiles looked clickable (button element, hover/press styles)
but did nothing. A card now only becomes a button with hover and press
affordances when an onClick is actually attached, so genuinely
interactive tiles keep the treatment.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 .../resources/js/components/KpiCard.test.ts   | 23 +++++++++++++++++++
 .../panel/resources/js/components/KpiCard.vue | 20 +++++++++++-----
 2 files changed, 37 insertions(+), 6 deletions(-)
 create mode 100644 packages/panel/resources/js/components/KpiCard.test.ts

diff --git a/packages/panel/resources/js/components/KpiCard.test.ts b/packages/panel/resources/js/components/KpiCard.test.ts
new file mode 100644
index 0000000000..3b86315a83
--- /dev/null
+++ b/packages/panel/resources/js/components/KpiCard.test.ts
@@ -0,0 +1,23 @@
+import { describe, expect, it, vi } from 'vitest';
+import { mount } from '@vue/test-utils';
+import KpiCard from './KpiCard.vue';
+
+describe('KpiCard', () => {
+    it('renders a static div without hover affordances by default', () => {
+        const wrapper = mount(KpiCard, { props: { label: 'Total', value: 40 } });
+
+        expect(wrapper.find('button').exists()).toBe(false);
+        expect(wrapper.find('div').classes().join(' ')).not.toContain('hover:');
+    });
+
+    it('renders a clickable button when a click handler is bound', async () => {
+        const onClick = vi.fn();
+        const wrapper = mount(KpiCard, { props: { label: 'Total', value: 40 }, attrs: { onClick } });
+
+        const button = wrapper.find('button');
+        expect(button.exists()).toBe(true);
+
+        await button.trigger('click');
+        expect(onClick).toHaveBeenCalled();
+    });
+});
diff --git a/packages/panel/resources/js/components/KpiCard.vue b/packages/panel/resources/js/components/KpiCard.vue
index 1da264c02b..a30dfa9728 100644
--- a/packages/panel/resources/js/components/KpiCard.vue
+++ b/packages/panel/resources/js/components/KpiCard.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed } from 'vue';
+import { computed, useAttrs } from 'vue';
 import Icon from './Icon.vue';
 
 type Tone = 'neutral' | 'sage' | 'warn' | 'danger';
@@ -26,14 +26,22 @@ const TONE: Record<Tone, string> = {
 
 const tileCls = computed(() => TONE[props.tone]);
 const deltaCls = computed(() => (props.delta ? TONE[props.delta.tone ?? 'neutral'] : ''));
+
+// A card is only a button — with hover/press affordances — when a click
+// handler is actually bound; plain stat tiles render as static divs.
+const attrs = useAttrs();
+const interactive = computed(() => !!attrs.onClick);
 </script>
 
 <template>
-    <button
-        type="button"
+    <component
+        :is="interactive ? 'button' : 'div'"
+        :type="interactive ? 'button' : undefined"
         :class="[
-            'group text-left bg-surface border rounded-xl shadow-sm p-3.5 flex flex-col gap-2 transition-[background-color,border-color,box-shadow,transform] duration-100',
-            'hover:bg-surface-2 hover:border-ink-300 active:translate-y-[0.5px] active:shadow-none focus-visible:outline-none focus-visible:ring-3 focus-visible:ring-sage/35',
+            'group text-left bg-surface border rounded-xl shadow-sm p-3.5 flex flex-col gap-2',
+            interactive
+                ? 'transition-[background-color,border-color,box-shadow,transform] duration-100 hover:bg-surface-2 hover:border-ink-300 active:translate-y-[0.5px] active:shadow-none focus-visible:outline-none focus-visible:ring-3 focus-visible:ring-sage/35'
+                : '',
             active ? 'border-ink-900 ring-1 ring-ink-900/10' : 'border-line',
         ]"
     >
@@ -51,5 +59,5 @@ const deltaCls = computed(() => (props.delta ? TONE[props.delta.tone ?? 'neutral
             >{{ delta.value }}</div>
         </div>
         <div v-if="hint" class="text-[11px] text-ink-500">{{ hint }}</div>
-    </button>
+    </component>
 </template>

From c0725fee299f6989ec015ce452382478a3a84bee Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Fri, 17 Jul 2026 11:36:05 +0100
Subject: [PATCH 18/19] Make the breadcrumb bar sticky on desktop per the
 design prototype

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 packages/panel/resources/js/components/Breadcrumbs.vue | 5 +++--
 packages/panel/resources/js/pages/customers/Edit.vue   | 6 +++---
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/packages/panel/resources/js/components/Breadcrumbs.vue b/packages/panel/resources/js/components/Breadcrumbs.vue
index 6470167fba..9cff405ab7 100644
--- a/packages/panel/resources/js/components/Breadcrumbs.vue
+++ b/packages/panel/resources/js/components/Breadcrumbs.vue
@@ -20,8 +20,9 @@ const { t } = useI18n();
 <template>
     <!-- Top bar: breadcrumb trail on the left, page-level actions on the right. The
          min-height matches the sidebar's brand header so the two top bands line up,
-         whether or not a page fills the actions slot. -->
-    <div class="flex items-center gap-2 sm:gap-3 px-4 sm:px-5 py-2.5 min-h-[50px] border-b border-line bg-paper">
+         whether or not a page fills the actions slot. Sticky on desktop only — on
+         mobile the layouts' own panel-name bar holds the top-0 sticky slot. -->
+    <div class="lg:sticky lg:top-0 z-30 flex items-center gap-2 sm:gap-3 px-4 sm:px-5 py-2.5 min-h-[50px] border-b border-line bg-paper/75 backdrop-saturate-[1.6] backdrop-blur-md">
         <nav :aria-label="t('common.breadcrumb')" class="flex items-center gap-1.5 text-xs text-ink-500 min-w-0">
             <template v-for="(crumb, i) in items" :key="i">
                 <Icon v-if="i > 0" name="chevronRight" cls="sm" class="text-ink-300 hidden sm:inline" />
diff --git a/packages/panel/resources/js/pages/customers/Edit.vue b/packages/panel/resources/js/pages/customers/Edit.vue
index 70376b142b..3dacc939e6 100644
--- a/packages/panel/resources/js/pages/customers/Edit.vue
+++ b/packages/panel/resources/js/pages/customers/Edit.vue
@@ -563,8 +563,8 @@ const tabDefs = computed(() => [
                             <Section :title="t('customers.personal_details')">
                                 <template #desc>{{ t('customers.personal_details_desc') }}</template>
                                 <div class="grid grid-cols-1 sm:grid-cols-12 gap-3">
-                                    <div class="flex flex-col gap-1 sm:col-span-2">
-                                        <FieldLabel for="customer-title" class="mb-0">{{ t('customers.field_title') }}</FieldLabel>
+                                    <div class="sm:col-span-2">
+                                        <FieldLabel for="customer-title">{{ t('customers.field_title') }}</FieldLabel>
                                         <Select id="customer-title" v-model="detailsForm.title">
                                             <option v-for="option in titleOptions" :key="option.value || 'none'" :value="option.value">{{ option.label }}</option>
                                         </Select>
@@ -754,7 +754,7 @@ const tabDefs = computed(() => [
                     </div>
 
                     <aside>
-                        <div class="lg:sticky lg:top-4 flex flex-col gap-0">
+                        <div class="lg:sticky lg:top-[60px] flex flex-col gap-0">
                             <SideCard :title="t('customers.at_a_glance')">
                                 <div class="flex flex-col gap-2 text-[12px]">
                                     <div class="flex items-center justify-between gap-2">

From f89482a5436555b3a32a7059e7a88def65467119 Mon Sep 17 00:00:00 2001
From: Glenn Jacobs <glenn@neondigital.co.uk>
Date: Fri, 17 Jul 2026 11:36:05 +0100
Subject: [PATCH 19/19] Align the Title field with its siblings via standard
 FieldLabel spacing

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 packages/panel/resources/js/pages/customers/Create.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/panel/resources/js/pages/customers/Create.vue b/packages/panel/resources/js/pages/customers/Create.vue
index c0f3aa4231..3f0537b72c 100644
--- a/packages/panel/resources/js/pages/customers/Create.vue
+++ b/packages/panel/resources/js/pages/customers/Create.vue
@@ -107,8 +107,8 @@ const submit = (): void => {
                     </div>
 
                     <div class="grid grid-cols-1 sm:grid-cols-12 gap-3">
-                        <div class="flex flex-col gap-1 sm:col-span-2">
-                            <FieldLabel for="customer-title" class="mb-0">{{ t('customers.field_title') }}</FieldLabel>
+                        <div class="sm:col-span-2">
+                            <FieldLabel for="customer-title">{{ t('customers.field_title') }}</FieldLabel>
                             <Select id="customer-title" v-model="form.title">
                                 <option v-for="option in titleOptions" :key="option.value || 'none'" :value="option.value">{{ option.label }}</option>
                             </Select>