9c5bdebf6f
## ✅ Issue 1: Customers Submenu Missing in WP-Admin **Problem:** Tax and Customer submenus only visible in standalone mode **Root Cause:** PHP navigation registry did not include Customers **Fixed:** Added Customers to NavigationRegistry.php settings children **Result:** Customers submenu now shows in all modes ## ✅ Issue 2: App Logo/Title in Topbar **Problem:** Should show logo → store name → "WooNooW" fallback **Fixed:** Header component now: - Fetches branding from /store/branding endpoint - Shows logo image if available - Falls back to store name text - Updates on store settings change event **Result:** Proper branding hierarchy in app header ## ✅ Issue 3: Zone Card Header Density on Mobile **Problem:** "Indonesia Addons" row with 3 icons too cramped on mobile **Fixed:** Shipping.tsx zone card header: - Reduced gap from gap-3 to gap-2/gap-1 on mobile - Smaller font size on mobile (text-sm md:text-lg) - Added min-w-0 for proper text truncation - flex-shrink-0 on icon buttons **Result:** Better mobile spacing and readability ## ✅ Issue 4: Go to WP Admin Button **Problem:** Should show in standalone mode, not wp-admin **Fixed:** More page now shows "Go to WP Admin" button: - Only in standalone mode - Before Logout button - Links to /wp-admin **Result:** Easy access to WP Admin from standalone mode ## ✅ Issue 5: Customer Settings 403 Error **Problem:** Permission check failing for customer-settings endpoint **Fixed:** StoreController.php check_permission(): - Added fallback: manage_woocommerce OR manage_options - Ensures administrators always have access **Result:** Customer Settings page loads successfully ## ✅ Issue 6: Dark Mode Logo Upload Field **Problem:** No UI to upload dark mode logo **Fixed:** Store settings page now has: - "Store logo (Light mode)" field - "Store logo (Dark mode)" field (optional) - Backend support in StoreSettingsProvider - Full save/load functionality **Result:** Users can upload separate logos for light/dark modes ## ✅ Issue 7: Login Card Background Too Dark **Problem:** Login card same color as background in dark mode **Fixed:** Login.tsx card styling: - Changed from dark:bg-gray-800 (solid) - To dark:bg-gray-900/50 (semi-transparent) - Added backdrop-blur-xl for glass effect - Added border for definition **Result:** Login card visually distinct with modern glass effect --- ## Summary **All 7 Issues Resolved:** 1. ✅ Customers submenu in all modes 2. ✅ Logo/title hierarchy in topbar 3. ✅ Mobile zone card spacing 4. ✅ Go to WP Admin in standalone 5. ✅ Customer Settings permission fix 6. ✅ Dark mode logo upload field 7. ✅ Lighter login card background **Files Modified:** - NavigationRegistry.php - Added Customers to nav - App.tsx - Logo/branding in header - Shipping.tsx - Mobile spacing - More/index.tsx - WP Admin button - StoreController.php - Permission fallback - Store.tsx - Dark logo field - StoreSettingsProvider.php - Dark logo backend - Login.tsx - Card background **Ready for production!** 🎉
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.