Fix button roundtrip in editor, alignment persistence, and test email rendering

This commit is contained in:
Dwindi Ramadhana
2026-01-17 13:10:50 +07:00
parent 0e9ace902d
commit 6d2136d3b5
61 changed files with 8287 additions and 866 deletions

View File

@@ -226,6 +226,26 @@ class NotificationsController {
'permission_callback' => [$this, 'check_permission'],
],
]);
// POST /woonoow/v1/notifications/templates/:eventId/:channelId/send-test
register_rest_route($this->namespace, '/' . $this->rest_base . '/templates/(?P<eventId>[a-zA-Z0-9_-]+)/(?P<channelId>[a-zA-Z0-9_-]+)/send-test', [
[
'methods' => 'POST',
'callback' => [$this, 'send_test_email'],
'permission_callback' => [$this, 'check_permission'],
'args' => [
'email' => [
'required' => true,
'type' => 'string',
'sanitize_callback' => 'sanitize_email',
],
'recipient' => [
'default' => 'customer',
'type' => 'string',
],
],
],
]);
}
/**
@@ -931,4 +951,411 @@ class NotificationsController {
'per_page' => $per_page,
], 200);
}
/**
* Send test email for a notification template
*
* @param WP_REST_Request $request Request object
* @return WP_REST_Response|WP_Error
*/
public function send_test_email(WP_REST_Request $request) {
$event_id = $request->get_param('eventId');
$channel_id = $request->get_param('channelId');
$recipient_type = $request->get_param('recipient') ?? 'customer';
$to_email = $request->get_param('email');
// Validate email
if (!is_email($to_email)) {
return new \WP_Error(
'invalid_email',
__('Invalid email address', 'woonoow'),
['status' => 400]
);
}
// Only support email channel for test
if ($channel_id !== 'email') {
return new \WP_Error(
'unsupported_channel',
__('Test sending is only available for email channel', 'woonoow'),
['status' => 400]
);
}
// Get template
$template = TemplateProvider::get_template($event_id, $channel_id, $recipient_type);
if (!$template) {
return new \WP_Error(
'template_not_found',
__('Template not found', 'woonoow'),
['status' => 404]
);
}
// Build sample data for variables
$sample_data = $this->get_sample_data_for_event($event_id);
// Replace variables in subject and body
$subject = '[TEST] ' . $this->replace_variables($template['subject'] ?? '', $sample_data);
$body_markdown = $this->replace_variables($template['body'] ?? '', $sample_data);
// Render email using EmailRenderer
$email_renderer = \WooNooW\Core\Notifications\EmailRenderer::instance();
// We need to manually render since we're not triggering a real event
$html = $this->render_test_email($body_markdown, $subject, $sample_data);
// Set content type to HTML
$headers = ['Content-Type: text/html; charset=UTF-8'];
// Send email
$sent = wp_mail($to_email, $subject, $html, $headers);
if (!$sent) {
return new \WP_Error(
'send_failed',
__('Failed to send test email. Check your mail server configuration.', 'woonoow'),
['status' => 500]
);
}
return new WP_REST_Response([
'success' => true,
'message' => sprintf(__('Test email sent to %s', 'woonoow'), $to_email),
], 200);
}
/**
* Get sample data for an event type
*
* @param string $event_id
* @return array
*/
private function get_sample_data_for_event($event_id) {
$base_data = [
'site_name' => get_bloginfo('name'),
'store_name' => get_bloginfo('name'),
'store_url' => home_url(),
'shop_url' => get_permalink(wc_get_page_id('shop')),
'my_account_url' => get_permalink(wc_get_page_id('myaccount')),
'support_email' => get_option('admin_email'),
'current_year' => date('Y'),
'customer_name' => 'John Doe',
'customer_first_name' => 'John',
'customer_last_name' => 'Doe',
'customer_email' => 'john@example.com',
'customer_phone' => '+1 234 567 8900',
'login_url' => wp_login_url(),
];
// Order-related events
if (strpos($event_id, 'order') !== false) {
$base_data = array_merge($base_data, [
'order_number' => '12345',
'order_id' => '12345',
'order_date' => date('F j, Y'),
'order_total' => wc_price(129.99),
'order_subtotal' => wc_price(109.99),
'order_tax' => wc_price(10.00),
'order_shipping' => wc_price(10.00),
'order_discount' => wc_price(0),
'order_status' => 'Processing',
'order_url' => '#',
'payment_method' => 'Credit Card',
'payment_status' => 'Paid',
'payment_date' => date('F j, Y'),
'transaction_id' => 'TXN123456789',
'shipping_method' => 'Standard Shipping',
'estimated_delivery' => date('F j', strtotime('+3 days')) . '-' . date('j', strtotime('+5 days')),
'completion_date' => date('F j, Y'),
'billing_address' => '123 Main St, City, State 12345, Country',
'shipping_address' => '123 Main St, City, State 12345, Country',
'tracking_number' => 'TRACK123456',
'tracking_url' => '#',
'shipping_carrier' => 'Standard Carrier',
'payment_retry_url' => '#',
'review_url' => '#',
'order_items' => $this->get_sample_order_items_html(),
'order_items_table' => $this->get_sample_order_items_html(),
]);
}
// Customer account events
if (strpos($event_id, 'customer') !== false || strpos($event_id, 'account') !== false) {
$base_data = array_merge($base_data, [
'customer_username' => 'johndoe',
'user_temp_password' => 'SamplePass123',
'reset_link' => '#',
'reset_key' => 'abc123xyz',
'user_login' => 'johndoe',
'user_email' => 'john@example.com',
]);
}
return $base_data;
}
/**
* Get sample order items HTML
*
* @return string
*/
private function get_sample_order_items_html() {
return '<table style="width: 100%; border-collapse: collapse; margin: 16px 0;">
<thead>
<tr style="background: #f5f5f5;">
<th style="padding: 12px; text-align: left; border-bottom: 2px solid #ddd;">Product</th>
<th style="padding: 12px; text-align: center; border-bottom: 2px solid #ddd;">Qty</th>
<th style="padding: 12px; text-align: right; border-bottom: 2px solid #ddd;">Price</th>
</tr>
</thead>
<tbody>
<tr>
<td style="padding: 12px; border-bottom: 1px solid #eee;">
<strong>Sample Product</strong><br>
<span style="color: #666; font-size: 13px;">Size: M, Color: Blue</span>
</td>
<td style="padding: 12px; text-align: center; border-bottom: 1px solid #eee;">2</td>
<td style="padding: 12px; text-align: right; border-bottom: 1px solid #eee;">' . wc_price(59.98) . '</td>
</tr>
<tr>
<td style="padding: 12px; border-bottom: 1px solid #eee;">
<strong>Another Product</strong><br>
<span style="color: #666; font-size: 13px;">Option: Standard</span>
</td>
<td style="padding: 12px; text-align: center; border-bottom: 1px solid #eee;">1</td>
<td style="padding: 12px; text-align: right; border-bottom: 1px solid #eee;">' . wc_price(50.01) . '</td>
</tr>
</tbody>
</table>';
}
/**
* Replace variables in text
*
* @param string $text
* @param array $variables
* @return string
*/
private function replace_variables($text, $variables) {
foreach ($variables as $key => $value) {
$text = str_replace('{' . $key . '}', $value, $text);
}
return $text;
}
/**
* Render test email HTML
*
* @param string $body_markdown
* @param string $subject
* @param array $variables
* @return string
*/
private function render_test_email($body_markdown, $subject, $variables) {
// Parse cards
$content = $this->parse_cards_for_test($body_markdown);
// Get appearance settings for colors
$appearance = get_option('woonoow_appearance_settings', []);
$colors = $appearance['general']['colors'] ?? [];
$primary_color = $colors['primary'] ?? '#7f54b3';
$secondary_color = $colors['secondary'] ?? '#7f54b3';
$hero_gradient_start = $colors['gradientStart'] ?? '#667eea';
$hero_gradient_end = $colors['gradientEnd'] ?? '#764ba2';
// Get email settings for branding
$email_settings = get_option('woonoow_email_settings', []);
$logo_url = $email_settings['logo_url'] ?? '';
$header_text = $email_settings['header_text'] ?? $variables['store_name'];
$footer_text = $email_settings['footer_text'] ?? sprintf('© %s %s. All rights reserved.', date('Y'), $variables['store_name']);
$footer_text = str_replace('{current_year}', date('Y'), $footer_text);
// Build header
if (!empty($logo_url)) {
$header = sprintf(
'<a href="%s"><img src="%s" alt="%s" style="max-width: 200px; max-height: 60px;"></a>',
esc_url($variables['store_url']),
esc_url($logo_url),
esc_attr($variables['store_name'])
);
} else {
$header = sprintf(
'<a href="%s" style="font-size: 24px; font-weight: 700; color: #333; text-decoration: none;">%s</a>',
esc_url($variables['store_url']),
esc_html($header_text)
);
}
// Build full HTML
$html = '<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>' . esc_html($subject) . '</title>
<style>
body { font-family: "Inter", Arial, sans-serif; background: #f8f8f8; margin: 0; padding: 20px; }
.container { max-width: 600px; margin: 0 auto; }
.header { padding: 32px; text-align: center; background: #f8f8f8; }
.card-gutter { padding: 0 16px; }
.card { background: #ffffff; border-radius: 8px; margin-bottom: 24px; padding: 32px 40px; width: 100%; box-sizing: border-box; }
.card-hero { background: linear-gradient(135deg, ' . esc_attr($hero_gradient_start) . ' 0%, ' . esc_attr($hero_gradient_end) . ' 100%); color: #ffffff; }
.card-hero * { color: #ffffff !important; }
.card-success { background-color: #f0fdf4; }
.card-info { background-color: #f0f7ff; }
.card-warning { background-color: #fff8e1; }
.card-basic { background: none; padding: 0; }
h1, h2, h3 { margin-top: 0; color: #333; }
p { font-size: 16px; line-height: 1.6; color: #555; margin-bottom: 16px; }
.button { display: inline-block; background: ' . esc_attr($primary_color) . '; color: #ffffff !important; padding: 14px 28px; border-radius: 6px; text-decoration: none; font-weight: 600; }
.button-outline { display: inline-block; background: transparent; color: ' . esc_attr($secondary_color) . ' !important; padding: 12px 26px; border: 2px solid ' . esc_attr($secondary_color) . '; border-radius: 6px; text-decoration: none; font-weight: 600; }
.footer { padding: 32px; text-align: center; color: #888; font-size: 13px; }
</style>
</head>
<body>
<div class="container">
<div class="header">' . $header . '</div>
<div class="card-gutter">' . $content . '</div>
<div class="footer"><p>' . nl2br(esc_html($footer_text)) . '</p></div>
</div>
</body>
</html>';
return $html;
}
/**
* Parse cards for test email
*
* @param string $content
* @return string
*/
private function parse_cards_for_test($content) {
// Parse [card:type] syntax
$content = preg_replace_callback(
'/\[card:(\w+)\](.*?)\[\/card\]/s',
function($matches) {
$type = $matches[1];
$card_content = $this->markdown_to_html($matches[2]);
return '<div class="card card-' . esc_attr($type) . '">' . $card_content . '</div>';
},
$content
);
// Parse [card type="..."] syntax
$content = preg_replace_callback(
'/\[card([^\]]*)\](.*?)\[\/card\]/s',
function($matches) {
$attrs = $matches[1];
$card_content = $this->markdown_to_html($matches[2]);
$type = 'default';
if (preg_match('/type=["\']([^"\']+)["\']/', $attrs, $type_match)) {
$type = $type_match[1];
}
return '<div class="card card-' . esc_attr($type) . '">' . $card_content . '</div>';
},
$content
);
// Parse buttons - new [button:style](url)Text[/button] syntax
$content = preg_replace_callback(
'/\[button:(\w+)\]\(([^)]+)\)([^\[]+)\[\/button\]/',
function($matches) {
$style = $matches[1];
$url = $matches[2];
$text = trim($matches[3]);
$class = $style === 'outline' ? 'button-outline' : 'button';
return '<p style="text-align: center;"><a href="' . esc_url($url) . '" class="' . $class . '">' . esc_html($text) . '</a></p>';
},
$content
);
// Parse buttons - old [button url="..." style="..."]Text[/button] syntax
$content = preg_replace_callback(
'/\[button\s+url=["\']([^"\']+)["\'](?:\s+style=["\'](\w+)["\'])?\]([^\[]+)\[\/button\]/',
function($matches) {
$url = $matches[1];
$style = $matches[2] ?? 'solid';
$text = trim($matches[3]);
$class = $style === 'outline' ? 'button-outline' : 'button';
return '<p style="text-align: center;"><a href="' . esc_url($url) . '" class="' . $class . '">' . esc_html($text) . '</a></p>';
},
$content
);
// If no cards found, wrap in default card
if (strpos($content, '<div class="card') === false) {
$content = '<div class="card">' . $this->markdown_to_html($content) . '</div>';
}
return $content;
}
/**
* Basic markdown to HTML conversion
*
* @param string $text
* @return string
*/
private function markdown_to_html($text) {
// Parse buttons FIRST - new [button:style](url)Text[/button] syntax
$text = preg_replace_callback(
'/\[button:(\w+)\]\(([^)]+)\)([^\[]+)\[\/button\]/',
function($matches) {
$style = $matches[1];
$url = $matches[2];
$btn_text = trim($matches[3]);
$class = $style === 'outline' ? 'button-outline' : 'button';
return '<p style="text-align: center;"><a href="' . esc_url($url) . '" class="' . $class . '">' . esc_html($btn_text) . '</a></p>';
},
$text
);
// Parse buttons - old [button url="..."] syntax
$text = preg_replace_callback(
'/\[button\s+url=["\']([^"\']+)["\'](?:\s+style=[\'"](\\w+)[\'"])?\]([^\[]+)\[\/button\]/',
function($matches) {
$url = $matches[1];
$style = $matches[2] ?? 'solid';
$btn_text = trim($matches[3]);
$class = $style === 'outline' ? 'button-outline' : 'button';
return '<p style="text-align: center;"><a href="' . esc_url($url) . '" class="' . $class . '">' . esc_html($btn_text) . '</a></p>';
},
$text
);
// Headers
$text = preg_replace('/^### (.+)$/m', '<h3>$1</h3>', $text);
$text = preg_replace('/^## (.+)$/m', '<h2>$1</h2>', $text);
$text = preg_replace('/^# (.+)$/m', '<h1>$1</h1>', $text);
// Bold
$text = preg_replace('/\*\*(.+?)\*\*/', '<strong>$1</strong>', $text);
// Italic
$text = preg_replace('/\*(.+?)\*/', '<em>$1</em>', $text);
// Links (but not button syntax - already handled above)
$text = preg_replace('/\[(?!button)([^\]]+)\]\(([^)]+)\)/', '<a href="$2">$1</a>', $text);
// List items
$text = preg_replace('/^- (.+)$/m', '<li>$1</li>', $text);
$text = preg_replace('/(<li>.*<\/li>)/s', '<ul>$1</ul>', $text);
// Paragraphs - wrap lines that aren't already wrapped
$lines = explode("\n", $text);
$result = [];
foreach ($lines as $line) {
$line = trim($line);
if (empty($line)) continue;
if (!preg_match('/^<(h[1-6]|ul|li|div|p|table|tr|td|th)/', $line)) {
$line = '<p>' . $line . '</p>';
}
$result[] = $line;
}
return implode("\n", $result);
}
}

View File

@@ -5,7 +5,9 @@ use WP_REST_Request;
use WP_REST_Response;
use WP_Error;
use WooNooW\Frontend\PlaceholderRenderer;
use WooNooW\Frontend\PageSSR;
use WooNooW\Templates\TemplateRegistry;
/**
* Pages Controller
@@ -19,6 +21,13 @@ class PagesController
public static function register_routes()
{
$namespace = 'woonoow/v1';
// Unset SPA Landing (Must be before generic slug route)
register_rest_route($namespace, '/pages/unset-spa-landing', [
'methods' => 'POST',
'callback' => [__CLASS__, 'unset_spa_landing'],
'permission_callback' => [__CLASS__, 'check_admin_permission'],
]);
// List all pages and templates
register_rest_route($namespace, '/pages', [
@@ -41,6 +50,13 @@ class PagesController
],
]);
// Get template presets (Must be before generic template cpt route)
register_rest_route($namespace, '/templates/presets', [
'methods' => 'GET',
'callback' => [__CLASS__, 'get_template_presets'],
'permission_callback' => '__return_true',
]);
// Get/Save CPT templates
register_rest_route($namespace, '/templates/(?P<cpt>[a-zA-Z0-9_-]+)', [
[
@@ -61,6 +77,8 @@ class PagesController
'callback' => [__CLASS__, 'get_content_with_template'],
'permission_callback' => '__return_true',
]);
// Create new page
register_rest_route($namespace, '/pages', [
@@ -82,6 +100,22 @@ class PagesController
'callback' => [__CLASS__, 'render_template_preview'],
'permission_callback' => [__CLASS__, 'check_admin_permission'],
]);
// Set page as SPA Landing (shown at SPA root route)
register_rest_route($namespace, '/pages/(?P<id>\d+)/set-as-spa-landing', [
'methods' => 'POST',
'callback' => [__CLASS__, 'set_as_spa_landing'],
'permission_callback' => [__CLASS__, 'check_admin_permission'],
]);
// Delete page
register_rest_route($namespace, '/pages/(?P<id>\d+)', [
'methods' => 'DELETE',
'callback' => [__CLASS__, 'delete_page'],
'permission_callback' => [__CLASS__, 'check_admin_permission'],
]);
}
/**
@@ -91,14 +125,26 @@ class PagesController
{
return current_user_can('manage_woocommerce');
}
/**
* Get available template presets
*/
public static function get_template_presets()
{
return new WP_REST_Response(TemplateRegistry::get_templates(), 200);
}
/**
* Get all pages and templates
* Get all editable pages (and templates)
*/
public static function get_pages(WP_REST_Request $request)
public static function get_pages()
{
$result = [];
// Get SPA settings
$settings = get_option('woonoow_appearance_settings', []);
$spa_frontpage_id = $settings['general']['spa_frontpage'] ?? 0;
// Get structural pages (pages with WooNooW structure)
$pages = get_posts([
'post_type' => 'page',
@@ -119,6 +165,7 @@ class PagesController
'title' => $page->post_title,
'url' => get_permalink($page),
'icon' => 'page',
'is_spa_frontpage' => (int)$page->ID === (int)$spa_frontpage_id,
];
}
@@ -155,6 +202,10 @@ class PagesController
$structure = get_post_meta($page->ID, '_wn_page_structure', true);
// Get SPA settings
$settings = get_option('woonoow_appearance_settings', []);
$spa_frontpage_id = $settings['general']['spa_frontpage'] ?? 0;
// Get SEO data (Yoast/Rank Math)
$seo = self::get_seo_data($page->ID);
@@ -163,8 +214,8 @@ class PagesController
'type' => 'page',
'slug' => $page->post_name,
'title' => $page->post_title,
'url' => get_permalink($page),
'seo' => $seo,
'is_spa_frontpage' => (int)$page->ID === (int)$spa_frontpage_id,
'structure' => $structure ?: ['sections' => []],
], 200);
}
@@ -198,6 +249,9 @@ class PagesController
update_post_meta($page->ID, '_wn_page_structure', $save_data);
// Invalidate SSR cache
delete_transient("wn_ssr_page_{$page->ID}");
return new WP_REST_Response([
'success' => true,
'page' => [
@@ -327,6 +381,53 @@ class PagesController
], 200);
}
/**
* Set page as SPA Landing (the page shown at SPA root route)
* This does NOT affect WordPress page_on_front setting.
*/
public static function set_as_spa_landing(WP_REST_Request $request) {
$id = (int)$request->get_param('id');
// Verify the page exists
$page = get_post($id);
if (!$page || $page->post_type !== 'page') {
return new WP_Error('invalid_page', 'Page not found', ['status' => 404]);
}
// Update WooNooW SPA settings - set this page as the SPA frontpage
$settings = get_option('woonoow_appearance_settings', []);
if (!isset($settings['general'])) {
$settings['general'] = [];
}
$settings['general']['spa_frontpage'] = $id;
update_option('woonoow_appearance_settings', $settings);
return new WP_REST_Response([
'success' => true,
'id' => $id,
'message' => 'SPA Landing page set successfully'
], 200);
}
/**
* Unset SPA Landing (the page shown at SPA root route)
* After unsetting, SPA will redirect to /shop or /checkout based on mode
*/
public static function unset_spa_landing(WP_REST_Request $request) {
// Update WooNooW SPA settings - clear the SPA frontpage
$settings = get_option('woonoow_appearance_settings', []);
if (isset($settings['general'])) {
$settings['general']['spa_frontpage'] = 0;
}
update_option('woonoow_appearance_settings', $settings);
return new WP_REST_Response([
'success' => true,
'message' => 'SPA Landing page unset. Root will now redirect to shop/checkout.'
], 200);
}
/**
* Create new page
*/
@@ -365,6 +466,15 @@ class PagesController
'created_at' => current_time('mysql'),
];
// Apply template if provided
$template_id = $body['templateId'] ?? null;
if ($template_id) {
$template = TemplateRegistry::get_template($template_id);
if ($template) {
$structure['sections'] = $template['sections'];
}
}
update_post_meta($page_id, '_wn_page_structure', $structure);
return new WP_REST_Response([
@@ -378,6 +488,42 @@ class PagesController
], 201);
}
/**
* Delete page
*/
public static function delete_page(WP_REST_Request $request) {
$id = (int)$request->get_param('id');
$page = get_post($id);
if (!$page || $page->post_type !== 'page') {
return new WP_Error('not_found', 'Page not found', ['status' => 404]);
}
// Check if it's the SPA front page
$settings = get_option('woonoow_appearance_settings', []);
$spa_frontpage_id = $settings['general']['spa_frontpage'] ?? 0;
if ((int)$id === (int)$spa_frontpage_id) {
// Unset SPA frontpage if deleting it
if (isset($settings['general'])) {
$settings['general']['spa_frontpage'] = 0;
update_option('woonoow_appearance_settings', $settings);
}
}
$deleted = wp_delete_post($id, true); // Force delete
if (!$deleted) {
return new WP_Error('delete_failed', 'Failed to delete page', ['status' => 500]);
}
return new WP_REST_Response([
'success' => true,
'id' => $id,
'message' => 'Page deleted successfully'
], 200);
}
// ========================================
// Helper Methods
// ========================================