97e76a837b
## ✅ Template Editor + Push Notifications ### Backend (PHP) **1. TemplateProvider** (`includes/Core/Notifications/TemplateProvider.php`) - Manages notification templates in wp_options - Default templates for all events x channels - Variable system (order, product, customer, store) - Template CRUD operations - Variable replacement engine **2. PushNotificationHandler** (`includes/Core/Notifications/PushNotificationHandler.php`) - VAPID keys generation and storage - Push subscription management - Queue system for push notifications - User-specific subscriptions - Service worker integration ready **3. NotificationsController** - Extended with: - GET /notifications/templates - List all templates - GET /notifications/templates/:eventId/:channelId - Get template - POST /notifications/templates - Save template - DELETE /notifications/templates/:eventId/:channelId - Reset to default - GET /notifications/push/vapid-key - Get VAPID public key - POST /notifications/push/subscribe - Subscribe to push - POST /notifications/push/unsubscribe - Unsubscribe **4. Push channel added to built-in channels** ### Frontend (React) **1. TemplateEditor Component** (`TemplateEditor.tsx`) - Modal dialog for editing templates - Subject + Body text editors - Variable insertion with dropdown - Click-to-insert variables - Live preview - Save and reset to default - Per event + channel customization **2. Templates Page** - Completely rewritten: - Lists all events x channels - Shows "Custom" badge for customized templates - Edit button opens template editor - Fetches templates from API - Variable reference guide - Organized by channel ### Key Features ✅ **Simple Text Editor** (not HTML builder) - Subject line - Body text with variables - Variable picker - Preview mode ✅ **Variable System** - Order variables: {order_number}, {order_total}, etc. - Customer variables: {customer_name}, {customer_email}, etc. - Product variables: {product_name}, {stock_quantity}, etc. - Store variables: {store_name}, {store_url}, etc. - Click to insert at cursor position ✅ **Push Notifications Ready** - VAPID key generation - Subscription management - Queue system - PWA integration ready - Built-in channel (alongside email) ✅ **Template Management** - Default templates for all events - Per-event, per-channel customization - Reset to default functionality - Custom badge indicator ### Default Templates Included **Email:** - Order Placed, Processing, Completed, Cancelled, Refunded - Low Stock, Out of Stock - New Customer, Customer Note **Push:** - Order Placed, Processing, Completed - Low Stock Alert ### Next Steps 1. ✅ Service worker for push notifications 2. ✅ Push subscription UI in Channels page 3. ✅ Test push notifications 4. ✅ Addon integration examples --- **Ready for testing!** 🚀
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.