dwindown/WooNooW
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Complete Dashboard API Integration with Analytics Controller

Browse Source 
✨ Features:
- Implemented API integration for all 7 dashboard pages
- Added Analytics REST API controller with 7 endpoints
- Full loading and error states with retry functionality
- Seamless dummy data toggle for development

📊 Dashboard Pages:
- Customers Analytics (complete)
- Revenue Analytics (complete)
- Orders Analytics (complete)
- Products Analytics (complete)
- Coupons Analytics (complete)
- Taxes Analytics (complete)
- Dashboard Overview (complete)

🔌 Backend:
- Created AnalyticsController.php with REST endpoints
- All endpoints return 501 (Not Implemented) for now
- Ready for HPOS-based implementation
- Proper permission checks

🎨 Frontend:
- useAnalytics hook for data fetching
- React Query caching
- ErrorCard with retry functionality
- TypeScript type safety
- Zero build errors

📝 Documentation:
- DASHBOARD_API_IMPLEMENTATION.md guide
- Backend implementation roadmap
- Testing strategy

🔧 Build:
- All pages compile successfully
- Production-ready with dummy data fallback
- Zero TypeScript errors
This commit is contained in:
dwindown
2025-11-04 11:19:00 +07:00
commit 232059e928
148 changed files with 28984 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

250
SPA_ADMIN_MENU_PLAN.md Normal file
View File

@@ -0,0 +1,250 @@
# WooNooW — Single Source of Truth for WooCommerce Admin Menus → SPA Routes
This document enumerates the **default WooCommerce admin menus & submenus** (no add‑ons) and defines how each maps to our **SPA routes**. It is the canonical reference for nav generation and routing.
> Scope: WordPress **wp‑admin** defaults from WooCommerce core and WooCommerce Admin (Analytics/Marketing). Add‑ons will be collected dynamically at runtime and handled separately.
---
## Legend
- **WP Admin**: the native admin path/slug WooCommerce registers
- **Purpose**: what the screen is about
- **SPA Route**: our hash route (admin‑spa), used by nav + router
- **Status**:
- **SPA** = fully replaced by a native SPA view
- **Bridge** = temporarily rendered in a legacy bridge (iframe) inside SPA
- **Planned** = route reserved, SPA view pending
---
## Top‑level: WooCommerce (`woocommerce`)
| Menu | WP Admin | Purpose | SPA Route | Status |
|---|---|---|---|---|
| Home | `admin.php?page=wc-admin` | WC Admin home / activity | `/home` | Bridge (for now) |
| Orders | `edit.php?post_type=shop_order` | Order list & management | `/orders` | **SPA** |
| Add Order | `post-new.php?post_type=shop_order` | Create order | `/orders/new` | **SPA** |
| Customers | `admin.php?page=wc-admin&path=/customers` | Customer index | `/customers` | Planned |
| Coupons | `edit.php?post_type=shop_coupon` | Coupon list | `/coupons` | Planned |
| Settings | `admin.php?page=wc-settings` | Store settings (tabs) | `/settings` | Bridge (tabbed) |
| Status | `admin.php?page=wc-status` | System status/tools | `/status` | Bridge |
| Extensions | `admin.php?page=wc-addons` | Marketplace | `/extensions` | Bridge |
> Notes
> - “Add Order” does not always appear as a submenu in all installs, but we expose `/orders/new` explicitly in SPA.
> - Some sites show **Reports** (classic) if WooCommerce Admin is disabled; we route that under `/reports` (Bridge) if present.
---
## Top‑level: Products (`edit.php?post_type=product`)
| Menu | WP Admin | Purpose | SPA Route | Status |
|---|---|---|---|---|
| All Products | `edit.php?post_type=product` | Product catalog | `/products` | Planned |
| Add New | `post-new.php?post_type=product` | Create product | `/products/new` | Planned |
| Categories | `edit-tags.php?taxonomy=product_cat&post_type=product` | Category mgmt | `/products/categories` | Planned |
| Tags | `edit-tags.php?taxonomy=product_tag&post_type=product` | Tag mgmt | `/products/tags` | Planned |
| Attributes | `edit.php?post_type=product&page=product_attributes` | Attributes mgmt | `/products/attributes` | Planned |
---
## Top‑level: Analytics (`admin.php?page=wc-admin&path=/analytics/overview`)
| Menu | WP Admin | Purpose | SPA Route | Status |
|---|---|---|---|---|
| Overview | `admin.php?page=wc-admin&path=/analytics/overview` | KPIs dashboard | `/analytics/overview` | Bridge |
| Revenue | `admin.php?page=wc-admin&path=/analytics/revenue` | Revenue report | `/analytics/revenue` | Bridge |
| Orders | `admin.php?page=wc-admin&path=/analytics/orders` | Orders report | `/analytics/orders` | Bridge |
| Products | `admin.php?page=wc-admin&path=/analytics/products` | Products report | `/analytics/products` | Bridge |
| Categories | `admin.php?page=wc-admin&path=/analytics/categories` | Categories report | `/analytics/categories` | Bridge |
| Coupons | `admin.php?page=wc-admin&path=/analytics/coupons` | Coupons report | `/analytics/coupons` | Bridge |
| Taxes | `admin.php?page=wc-admin&path=/analytics/taxes` | Taxes report | `/analytics/taxes` | Bridge |
| Downloads | `admin.php?page=wc-admin&path=/analytics/downloads` | Downloads report | `/analytics/downloads` | Bridge |
| Stock | `admin.php?page=wc-admin&path=/analytics/stock` | Stock report | `/analytics/stock` | Bridge |
| Settings | `admin.php?page=wc-admin&path=/analytics/settings` | Analytics settings | `/analytics/settings` | Bridge |
> Analytics entries are provided by **WooCommerce Admin**. We keep them accessible via a **Bridge** until replaced.
---
## Top‑level: Marketing (`admin.php?page=wc-admin&path=/marketing`)
| Menu | WP Admin | Purpose | SPA Route | Status |
|---|---|---|---|---|
| Hub | `admin.php?page=wc-admin&path=/marketing` | Marketing hub | `/marketing` | Bridge |
---
## Cross‑reference for routing
When our SPA receives a `wp-admin` URL, map using these regex rules first; if no match, fall back to Legacy Bridge:
```ts
// Admin URL → SPA route mapping
export const WC_ADMIN_ROUTE_MAP: Array<[RegExp, string]> = [
[/edit\.php\?post_type=shop_order/i, '/orders'],
[/post-new\.php\?post_type=shop_order/i, '/orders/new'],
[/edit\.php\?post_type=product/i, '/products'],
[/post-new\.php\?post_type=product/i, '/products/new'],
[/edit-tags\.php\?taxonomy=product_cat/i, '/products/categories'],
[/edit-tags\.php\?taxonomy=product_tag/i, '/products/tags'],
[/product_attributes/i, '/products/attributes'],
[/wc-admin.*path=%2Fcustomers/i, '/customers'],
[/wc-admin.*path=%2Fanalytics%2Foverview/i, '/analytics/overview'],
[/wc-admin.*path=%2Fanalytics%2Frevenue/i, '/analytics/revenue'],
[/wc-admin.*path=%2Fanalytics%2Forders/i, '/analytics/orders'],
[/wc-admin.*path=%2Fanalytics%2Fproducts/i, '/analytics/products'],
[/wc-admin.*path=%2Fanalytics%2Fcategories/i, '/analytics/categories'],
[/wc-admin.*path=%2Fanalytics%2Fcoupons/i, '/analytics/coupons'],
[/wc-admin.*path=%2Fanalytics%2Ftaxes/i, '/analytics/taxes'],
[/wc-admin.*path=%2Fanalytics%2Fdownloads/i, '/analytics/downloads'],
[/wc-admin.*path=%2Fanalytics%2Fstock/i, '/analytics/stock'],
[/wc-admin.*path=%2Fanalytics%2Fsettings/i, '/analytics/settings'],
[/wc-admin.*page=wc-settings/i, '/settings'],
[/wc-status/i, '/status'],
[/wc-addons/i, '/extensions'],
];
```
> Keep this map in sync with the SPA routers. New SPA screens should switch a route’s **Status** from Bridge → SPA.
---
## Implementation notes
- **Nav Data**: The runtime menu collector already injects `window.WNM_WC_MENUS`. Use this file as the *static* canonical mapping and the collector data as the *dynamic* source for what exists in a given site.
- **Hidden WP‑Admin**: wp‑admin menus will be hidden in final builds; all entries must be reachable via SPA.
- **Capabilities**: Respect `capability` from WP when we later enforce per‑user visibility. For now, the collector includes only titles/links.
- **Customers & Coupons**: Some installs place these differently. Our SPA routes should remain stable; mapping rules above handle variants.
---
## Current SPA coverage (at a glance)
- **Orders** (list/new/edit/show) → SPA ✅
- **Products** (catalog/new/attributes/categories/tags) → Planned
- **Customers, Coupons, Analytics, Marketing, Settings, Status, Extensions** → Bridge → SPA gradually
---
## Visual Menu Tree (Default WooCommerce Admin)
This tree mirrors what appears in the WordPress admin sidebar for a default WooCommerce installation — excluding add‑ons.
```text
WooCommerce
├── Home (wc-admin)
├── Orders
│ ├── All Orders
│ └── Add Order
├── Customers
├── Coupons
├── Reports (deprecated classic) [may not appear if WC Admin enabled]
├── Settings
│ ├── General
│ ├── Products
│ ├── Tax
│ ├── Shipping
│ ├── Payments
│ ├── Accounts & Privacy
│ ├── Emails
│ ├── Integration
│ └── Advanced
├── Status
│ ├── System Status
│ ├── Tools
│ ├── Logs
│ └── Scheduled Actions
└── Extensions
Products
├── All Products
├── Add New
├── Categories
├── Tags
└── Attributes
Analytics (WooCommerce Admin)
├── Overview
├── Revenue
├── Orders
├── Products
├── Categories
├── Coupons
├── Taxes
├── Downloads
├── Stock
└── Settings
Marketing
└── Hub
```
> Use this as a structural reference for navigation hierarchy when rendering nested navs in SPA (e.g., hover or sidebar expansion).
## Proposed SPA Main Menu (Authoritative)
This replaces wp‑admin’s structure with a focused SPA hierarchy. Analytics & Marketing are folded into **Dashboard**. **Status** and **Extensions** live under **Settings**.
```text
Dashboard
├── Overview (/dashboard) ← default landing
├── Revenue (/dashboard/revenue)
├── Orders (/dashboard/orders)
├── Products (/dashboard/products)
├── Categories (/dashboard/categories)
├── Coupons (/dashboard/coupons)
├── Taxes (/dashboard/taxes)
├── Downloads (/dashboard/downloads)
└── Stock (/dashboard/stock)
Orders
├── All Orders (/orders)
└── Add Order (/orders/new)
Products
├── All Products (/products)
├── Add New (/products/new)
├── Categories (/products/categories)
├── Tags (/products/tags)
└── Attributes (/products/attributes)
Coupons
└── All Coupons (/coupons)
Customers
└── All Customers (/customers)
(Customers are derived from orders + user profiles; non‑buyers are excluded by default.)
Settings
├── General (/settings/general)
├── Products (/settings/products)
├── Tax (/settings/tax)
├── Shipping (/settings/shipping)
├── Payments (/settings/payments)
├── Accounts & Privacy (/settings/accounts)
├── Emails (/settings/emails)
├── Integrations (/settings/integrations)
├── Advanced (/settings/advanced)
├── Status (/settings/status)
└── Extensions (/settings/extensions)
```
### Routing notes
- **Dashboard** subsumes Analytics & (most) Marketing metrics. Each item maps to a SPA page. Until built, these can open a Legacy Bridge view of the corresponding wc‑admin screen.
- **Status** and **Extensions** are still reachable (now under Settings) and can bridge to `wc-status` and `wc-addons` until replaced.
- Existing map (`WC_ADMIN_ROUTE_MAP`) remains, but should redirect legacy URLs to the new SPA paths above.
---
### What is “Marketing / Hub” in WooCommerce?
The **Marketing** (Hub) screen is part of **WooCommerce Admin**. It aggregates recommended extensions and campaign tools (e.g., MailPoet, Facebook/Google listings, coupon promos). It’s not essential for day‑to‑day store ops. In WooNooW we fold campaign performance into **Dashboard** metrics; the extension browsing/management aspect is covered under **Settings → Extensions** (Bridge until native UI exists).
### Customers in SPA
WooCommerce’s wc‑admin provides a Customers table; classic wp‑admin does not. Our SPA’s **Customers** pulls from **orders** + **user profiles** to show buyers. Non‑buyers are excluded by default (configurable later). Route: `/customers`.
---
### Action items
- [ ] Update quick‑nav to use this SPA menu tree for top‑level buttons.
- [ ] Extend `WC_ADMIN_ROUTE_MAP` to point legacy analytics URLs to the new `/dashboard/*` paths.
- [ ] Implement `/dashboard/*` pages incrementally; use Legacy Bridge where needed.
- [ ] Keep `window.WNM_WC_MENUS` for add‑on items (dynamic), nesting them under **Settings** or **Dashboard** as appropriate.