feat: Implement notification system with 3 subpages (Events, Channels, Templates)
## ✅ Correct Implementation Following NOTIFICATION_STRATEGY.md
### Frontend (React) - 3 Subpages
**1. Main Notifications Page** (`Notifications.tsx`)
- Tab navigation for 3 sections
- Events | Channels | Templates
**2. Events Subpage** (`Notifications/Events.tsx`)
- Configure which channels per event
- Grouped by category (Orders, Products, Customers)
- Toggle channels (Email, WhatsApp, Telegram, etc.)
- Show recipient (Admin/Customer/Both)
- Switch UI for enable/disable per channel
**3. Channels Subpage** (`Notifications/Channels.tsx`)
- List available channels
- Built-in channels (Email)
- Addon channels (WhatsApp, Telegram, SMS, Push)
- Channel status (Active/Inactive)
- Configure button for each channel
- Addon discovery cards
**4. Templates Subpage** (`Notifications/Templates.tsx`)
- Email templates (link to WooCommerce)
- Addon channel templates
- Template variables reference
- Preview and edit buttons
- Variable documentation ({order_number}, {customer_name}, etc.)
### Backend (PHP) - Bridge to WooCommerce
**NotificationsController** (`includes/Api/NotificationsController.php`)
- Bridges to WooCommerce email system
- Does NOT reinvent notification system
- Provides addon integration hooks
**REST API Endpoints:**
```
GET /notifications/channels - List channels (email + addons)
GET /notifications/events - List events (maps to WC emails)
POST /notifications/events/update - Update event channel settings
```
**Key Features:**
✅ Leverages WooCommerce emails (not reinventing)
✅ Stores settings in wp_options
✅ Provides hooks for addons:
- `woonoow_notification_channels` filter
- `woonoow_notification_events` filter
- `woonoow_notification_event_updated` action
### Addon Integration
**Example: WhatsApp Addon**
```php
// Register channel
add_filter("woonoow_notification_channels", function($channels) {
$channels[] = [
"id" => "whatsapp",
"label" => "WhatsApp",
"icon" => "message-circle",
"enabled" => true,
"addon" => "woonoow-whatsapp",
];
return $channels;
});
// React to event updates
add_action("woonoow_notification_event_updated", function($event_id, $channel_id, $enabled, $recipient) {
if ($channel_id === "whatsapp" && $enabled) {
// Setup WhatsApp notification for this event
}
}, 10, 4);
// Hook into WooCommerce email triggers
add_action("woocommerce_order_status_processing", function($order_id) {
// Send WhatsApp notification
}, 10, 1);
```
### Architecture
**NOT a new notification system** ✅
- Uses WooCommerce email infrastructure
- Maps events to WC email IDs
- Addons hook into WC triggers
**IS an extensible framework** ✅
- Unified UI for all channels
- Per-event channel configuration
- Template management
- Addon discovery
### Files Created
- `Notifications.tsx` - Main page with tabs
- `Notifications/Events.tsx` - Events configuration
- `Notifications/Channels.tsx` - Channel management
- `Notifications/Templates.tsx` - Template editor
- `NotificationsController.php` - REST API bridge
### Files Modified
- `Routes.php` - Register NotificationsController
---
**Ready for addon development!** 🚀
Next: Build Telegram addon as proof of concept
ffdc7aae5f