feat(frontend): Complete Customer module with vertical tab forms

Implemented full Customer CRUD following PROJECT_SOP.md standards

1. Customers Index Page (index.tsx):
✅ List with pagination (20 per page)
✅ Search by name/email
✅ Bulk delete with confirmation
✅ Refresh button (required by SOP)
✅ Desktop: Table with columns (Name, Email, Orders, Total Spent, Registered)
✅ Mobile: Cards with same data
✅ Empty state with CTA
✅ Proper toolbar styling (red delete button, refresh button)
✅ FAB config for 'New Customer'

2. CustomerForm Component (CustomerForm.tsx):
✅ Vertical tabs: Personal Data | Billing Address | Shipping Address
✅ Personal Data tab:
   - First/Last name (required)
   - Email (required)
   - Username (auto-generated from email if empty)
   - Password (auto-generated if empty for new)
   - Send welcome email checkbox (create only)
✅ Billing Address tab:
   - Company, Address 1/2, City, State, Postcode, Country, Phone
✅ Shipping Address tab:
   - Same fields as billing
   - 'Same as billing' checkbox with auto-copy
✅ Mobile: Horizontal tabs
✅ Desktop: Vertical sidebar tabs
✅ Proper form validation

3. Customer New Page (New.tsx):
✅ Uses CustomerForm in create mode
✅ Page header with Back + Create buttons
✅ Form ref for header submit
✅ Success toast with customer name
✅ Redirects to list after create
✅ Error handling

4. Customer Edit Page (Edit.tsx):
✅ Uses CustomerForm in edit mode
✅ Loads customer data
✅ Page header with Back + Save buttons
✅ Loading skeleton
✅ Error card with retry
✅ Success toast
✅ Redirects to list after save

5. Routes (App.tsx):
✅ /customers → Index
✅ /customers/new → New
✅ /customers/:id/edit → Edit
✅ Consistent with products/coupons pattern

Features:
- Full WooCommerce integration
- Billing/shipping address management
- Order statistics display
- Email uniqueness validation
- Password auto-generation
- Welcome email option
- Responsive design (mobile + desktop)
- Vertical tabs for better UX
- Follows all PROJECT_SOP.md standards

Next: Testing and verification

admin-spa/src/App.tsx

@@ -22,6 +22,8 @@ import CouponsIndex from '@/routes/Coupons';
 import CouponNew from '@/routes/Coupons/New';
 import CouponEdit from '@/routes/Coupons/Edit';
 import CustomersIndex from '@/routes/Customers';
+import CustomerNew from '@/routes/Customers/New';
+import CustomerEdit from '@/routes/Customers/Edit';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { LayoutDashboard, ReceiptText, Package, Tag, Users, Settings as SettingsIcon, Maximize2, Minimize2, Loader2 } from 'lucide-react';
 import { Toaster } from 'sonner';
@@ -482,6 +484,8 @@ function AppRoutes() {
 
       {/* Customers */}
       <Route path="/customers" element={<CustomersIndex />} />
+      <Route path="/customers/new" element={<CustomerNew />} />
+      <Route path="/customers/:id/edit" element={<CustomerEdit />} />
 
       {/* More */}
       <Route path="/more" element={<MorePage />} />