e1adf1e525
## ✅ Issue 1: Cookie Authentication in Standalone Mode **Problem:** - `rest_cookie_invalid_nonce` errors on customer-settings - `Cookie check failed` errors on media uploads - Both endpoints returning 403 in standalone mode **Root Cause:** WordPress REST API requires `credentials: "include"` for cookie-based authentication in cross-origin contexts (standalone mode uses different URL). **Fixed:** 1. **Customer Settings (Customers.tsx)** - Added `credentials: "include"` to both GET and POST requests - Use `WNW_CONFIG.nonce` as primary nonce source - Fallback to `wpApiSettings.nonce` 2. **Media Upload (image-upload.tsx)** - Added `credentials: "include"` to media upload - Prioritize `WNW_CONFIG.nonce` for standalone mode - Changed from `same-origin` to `include` for cross-origin support **Result:** - ✅ Customer settings load and save in standalone mode - ✅ Image/logo uploads work in standalone mode - ✅ SVG uploads work with proper authentication ## ✅ Issue 2: Dynamic VIP Customer Calculation **Problem:** VIP calculation was hardcoded (TODO comment) **Requirement:** Use dynamic settings from Customer Settings page **Fixed (AnalyticsController.php):** 1. **Individual Customer VIP Status** - Call `CustomerSettingsProvider::is_vip_customer()` for each customer - Add `is_vip` field to customer data - Set `segment` to "vip" for VIP customers - Count VIP customers dynamically 2. **Segments Overview** - Replace hardcoded `vip: 0` with actual `$vip_count` - VIP count updates automatically based on settings **How It Works:** - CustomerSettingsProvider reads settings from database - Checks: min_spent, min_orders, timeframe, require_both, exclude_refunded - Calculates VIP status in real-time based on current criteria - Updates immediately when settings change **Result:** - ✅ VIP badge shows correctly on customer list - ✅ VIP count in segments reflects actual qualified customers - ✅ Changes to VIP criteria instantly affect dashboard - ✅ No cache issues - recalculates on each request --- ## Files Modified: - `Customers.tsx` - Add credentials for cookie auth - `image-upload.tsx` - Add credentials for media upload - `AnalyticsController.php` - Dynamic VIP calculation ## Testing: 1. ✅ Customer settings save in standalone mode 2. ✅ Logo upload works in standalone mode 3. ✅ VIP customers show correct badge 4. ✅ Change VIP criteria → dashboard updates 5. ✅ Segments show correct VIP count
WooNooW
WooNooW is a modern experience layer for WooCommerce — enhancing UX, speed, and reliability without data migration.
It keeps WooCommerce as the core engine while providing a modern React-powered interface for both the storefront (cart, checkout, my‑account) and the admin (orders, dashboard).
Three Admin Modes:
- Normal Mode: Traditional wp-admin integration (
/wp-admin/admin.php?page=woonoow) - Fullscreen Mode: Distraction-free interface (toggle in header)
- Standalone Mode: Complete standalone app at
yoursite.com/adminwith custom login ✨
🔍 Background
WooCommerce is the most used e‑commerce engine in the world, but its architecture has become heavy and fragmented.
With React‑based blocks (Checkout, Cart, Product Edit) and HPOS now rolling out, many existing addons are becoming obsolete or unstable.
WooNooW bridges the gap between Woo’s legacy PHP system and the new modern stack — so users get performance and simplicity without losing compatibility.
🚀 Key Principles
- No Migration Needed – Woo data stays intact.
- Safe Activate/Deactivate – revert to native Woo anytime, no data loss.
- Hybrid by Default – SSR + React islands for Cart/Checkout/My‑Account.
- Full SPA Toggle – optional React‑only mode for max performance.
- HPOS Mandatory – optimized datastore and async operations.
- Compat Layer – hook mirror + slot rendering for legacy addons.
- Async Mail & Tasks – powered by Action Scheduler.
🧱 Tech Stack
| Layer | Technology |
|---|---|
| Backend | PHP 8.2+, WordPress, WooCommerce (HPOS), Action Scheduler |
| Frontend | React 18 + TypeScript, Vite, React Query, Tailwind (optional) |
| Build & Package | Composer, NPM, ESM scripts, Zip automation |
| Architecture | Modular PSR‑4 classes, REST‑driven SPA islands |
🧩 Project Structure
woonoow/
├── admin-spa/
│ ├── src/
│ │ ├── components/
│ │ │ ├── filters/
│ │ │ │ ├── DateRange.tsx
│ │ │ │ └── OrderBy.tsx
│ │ │ └── CommandPalette.tsx
│ │ ├── hooks/
│ │ │ └── useShortcuts.tsx
│ │ ├── lib/
│ │ │ ├── api.ts
│ │ │ ├── currency.ts
│ │ │ ├── dates.ts
│ │ │ ├── query-params.ts
│ │ │ ├── useCommandStore.ts
│ │ │ └── utils.ts
│ │ ├── pages/
│ │ │ └── orders/
│ │ │ ├── partials
│ │ │ │ └── OrderForm.tsx
│ │ │ ├── Orders.tsx
│ │ │ ├── OrdersNew.tsx
│ │ │ └── OrderShow.tsx
│ │ ├── routes/
│ │ │ └── Dashboard.tsx
│ │ ├── types/
│ │ │ └── qrcode.d.ts
│ │ ├── App.tsx
│ │ ├── index.css
│ │ └── main.tsx
│ └── vite.config.ts
├── includes/
│ ├── Admin/
│ │ ├── Assets.php
│ │ └── Menu.php
│ ├── Api/
│ │ ├── CheckoutController.php
│ │ ├── OrdersController.php
│ │ ├── Permissions.php
│ │ └── Routes.php
│ ├── Compat/
│ │ ├── HideWooMenus.php
│ │ └── HooksShim.php
│ └── Core/
│ ├── DataStores/
│ │ ├── OrderStore_HPOS.php
│ │ └── OrderStore.php
│ ├── Mail/
│ │ ├── MailQueue.php
│ │ └── WooEmailOverride.php
│ ├── Bootstrap.php
│ └── Features.php
├── woonoow.php
└── docs (project notes, SOP, etc.)
⚙️ Development Workflow
- LocalWP / Docker setup with WordPress + WooCommerce.
- Activate plugin:
WooNooWshould appear in the admin menu. - Build SPAs:
npm run build - Package zip:
npm run pack - Upload
dist/woonoow.zipinto WordPress → Plugins → Add New → Upload.
🧭 Vision
“WooCommerce, reimagined for now.”
WooNooW delivers modern speed and UX while keeping WooCommerce’s ecosystem alive.
No migration. No lock‑in. Just Woo, evolved.