Files
WooNooW/includes/Modules/NewsletterSettings.php
Dwindi Ramadhana c6cef97ef8 feat: Implement Phase 2, 3, 4 - Module Settings System with Schema Forms and Addon API
Phase 2: Schema-Based Form System
- Add ModuleSettingsController with GET/POST/schema endpoints
- Create SchemaField component supporting 8 field types (text, textarea, email, url, number, toggle, checkbox, select)
- Create SchemaForm component for automatic form generation from schema
- Add ModuleSettings page with dynamic routing (/settings/modules/:moduleId)
- Add useModuleSettings React hook for settings management
- Implement NewsletterSettings as example with 8 configurable fields
- Add has_settings flag to module registry
- Settings stored as woonoow_module_{module_id}_settings

Phase 3: Advanced Features
- Create windowAPI.ts exposing React, hooks, components, icons, utils to addons via window.WooNooW
- Add DynamicComponentLoader for loading external React components
- Create TypeScript definitions (woonoow-addon.d.ts) for addon developers
- Initialize Window API in App.tsx on mount
- Enable custom React components for addon settings pages

Phase 4: Production Polish & Example
- Create complete Biteship addon example demonstrating both approaches:
  * Schema-based settings (no build required)
  * Custom React component (with build)
- Add comprehensive README with installation and testing guide
- Include package.json with esbuild configuration
- Demonstrate window.WooNooW API usage in custom component

Bug Fixes:
- Fix footer newsletter form visibility (remove redundant module check)
- Fix footer contact_data and social_links not saving (parameter name mismatch: snake_case vs camelCase)
- Fix useModules hook returning undefined (remove .data wrapper, add fallback)
- Add optional chaining to footer settings rendering
- Fix TypeScript errors in woonoow-addon.d.ts (use any for external types)

Files Added (15):
- includes/Api/ModuleSettingsController.php
- includes/Modules/NewsletterSettings.php
- admin-spa/src/components/forms/SchemaField.tsx
- admin-spa/src/components/forms/SchemaForm.tsx
- admin-spa/src/routes/Settings/ModuleSettings.tsx
- admin-spa/src/hooks/useModuleSettings.ts
- admin-spa/src/lib/windowAPI.ts
- admin-spa/src/components/DynamicComponentLoader.tsx
- types/woonoow-addon.d.ts
- examples/biteship-addon/biteship-addon.php
- examples/biteship-addon/src/Settings.jsx
- examples/biteship-addon/package.json
- examples/biteship-addon/README.md
- PHASE_2_3_4_SUMMARY.md

Files Modified (11):
- admin-spa/src/App.tsx
- admin-spa/src/hooks/useModules.ts
- admin-spa/src/routes/Appearance/Footer.tsx
- admin-spa/src/routes/Settings/Modules.tsx
- customer-spa/src/hooks/useModules.ts
- customer-spa/src/layouts/BaseLayout.tsx
- customer-spa/src/components/NewsletterForm.tsx
- includes/Api/Routes.php
- includes/Api/ModulesController.php
- includes/Core/ModuleRegistry.php
- woonoow.php

API Endpoints Added:
- GET /woonoow/v1/modules/{module_id}/settings
- POST /woonoow/v1/modules/{module_id}/settings
- GET /woonoow/v1/modules/{module_id}/schema

For Addon Developers:
- Schema-based: Define settings via woonoow/module_settings_schema filter
- Custom React: Build component using window.WooNooW API, externalize react/react-dom
- Both approaches use same storage and retrieval methods
- TypeScript definitions provided for type safety
- Complete working example (Biteship) included
2025-12-26 21:16:06 +07:00

97 lines
3.6 KiB
PHP

<?php
/**
* Newsletter Module Settings Schema
*
* Example of schema-based settings for the Newsletter module
*
* @package WooNooW\Modules
*/
namespace WooNooW\Modules;
class NewsletterSettings {
public static function init() {
// Register settings schema
add_filter('woonoow/module_settings_schema', [__CLASS__, 'register_schema']);
}
/**
* Register newsletter settings schema
*/
public static function register_schema($schemas) {
$schemas['newsletter'] = [
'sender_name' => [
'type' => 'text',
'label' => __('Sender Name', 'woonoow'),
'description' => __('The name that appears in the "From" field of newsletter emails', 'woonoow'),
'placeholder' => get_bloginfo('name'),
'default' => get_bloginfo('name'),
'required' => true,
],
'sender_email' => [
'type' => 'email',
'label' => __('Sender Email', 'woonoow'),
'description' => __('The email address that appears in the "From" field', 'woonoow'),
'placeholder' => get_option('admin_email'),
'default' => get_option('admin_email'),
'required' => true,
],
'reply_to_email' => [
'type' => 'email',
'label' => __('Reply-To Email', 'woonoow'),
'description' => __('Email address for replies (leave empty to use sender email)', 'woonoow'),
'placeholder' => get_option('admin_email'),
],
'double_opt_in' => [
'type' => 'toggle',
'label' => __('Double Opt-In', 'woonoow'),
'description' => __('Require subscribers to confirm their email address before being added to the list', 'woonoow'),
'default' => true,
],
'welcome_email' => [
'type' => 'toggle',
'label' => __('Send Welcome Email', 'woonoow'),
'description' => __('Automatically send a welcome email to new subscribers', 'woonoow'),
'default' => true,
],
'unsubscribe_page' => [
'type' => 'select',
'label' => __('Unsubscribe Page', 'woonoow'),
'description' => __('Page to redirect users after unsubscribing', 'woonoow'),
'placeholder' => __('-- Select Page --', 'woonoow'),
'options' => self::get_pages_options(),
],
'gdpr_consent' => [
'type' => 'toggle',
'label' => __('GDPR Consent Checkbox', 'woonoow'),
'description' => __('Show a consent checkbox on subscription forms (recommended for EU compliance)', 'woonoow'),
'default' => false,
],
'consent_text' => [
'type' => 'textarea',
'label' => __('Consent Text', 'woonoow'),
'description' => __('Text shown next to the consent checkbox', 'woonoow'),
'placeholder' => __('I agree to receive marketing emails', 'woonoow'),
'default' => __('I agree to receive marketing emails and understand I can unsubscribe at any time.', 'woonoow'),
],
];
return $schemas;
}
/**
* Get pages as options for select field
*/
private static function get_pages_options() {
$pages = get_pages();
$options = [];
foreach ($pages as $page) {
$options[$page->ID] = $page->post_title;
}
return $options;
}
}