@jhits/plugin-newsletter 0.0.15 → 0.0.17

package/src/views/components/TestEmailModal.tsx

@@ -6,6 +6,7 @@
 
 import React, { useState, useEffect } from 'react';
 import { X, Send, RefreshCw, CheckCircle2, AlertCircle, Mail, Globe, Sparkles, MailCheck } from 'lucide-react';
+import { DomainPromptModal } from './DomainPromptModal';
 
 interface TestEmailModalProps {
     isOpen: boolean;
@@ -29,10 +30,15 @@ export function TestEmailModal({ isOpen, onClose }: TestEmailModalProps) {
     const [isSending, setIsSending] = useState(false);
     const [sendSuccess, setSendSuccess] = useState(false);
     const [sendError, setSendError] = useState<string | null>(null);
+    
+    // Domain prompt state
+    const [showDomainPrompt, setShowDomainPrompt] = useState(false);
+    const [isCheckingDomain, setIsCheckingDomain] = useState(false);
 
     useEffect(() => {
         if (isOpen) {
             fetchWelcomeEmailStatus();
+            setShowDomainPrompt(false);
         }
     }, [isOpen]);
 
@@ -53,7 +59,7 @@ export function TestEmailModal({ isOpen, onClose }: TestEmailModalProps) {
         }
     };
 
-    const handleSend = async () => {
+    const handleSend = async (skipDomainCheck = false) => {
         if (!email.trim()) {
             setSendError('Please enter an email address');
             return;
@@ -65,6 +71,33 @@ export function TestEmailModal({ isOpen, onClose }: TestEmailModalProps) {
             return;
         }
 
+        // Check if we need to prompt for domain first (usually helpful in dev mode)
+        if (!skipDomainCheck) {
+            try {
+                setIsCheckingDomain(true);
+                // Check if this language has a domain configured
+                const response = await fetch('/api/plugin-website/settings');
+                const siteConfig = await response.json();
+                
+                const hasDomain = siteConfig.domainLocaleConfig?.some((c: any) => 
+                    c.locale === language && 
+                    c.domain && 
+                    c.domain !== 'undefined' && 
+                    c.domain.trim() !== ''
+                );
+                
+                if (!hasDomain) {
+                    setShowDomainPrompt(true);
+                    setIsCheckingDomain(false);
+                    return; // Stop here, wait for domain prompt
+                }
+            } catch (error) {
+                console.warn('Failed to check domain configuration:', error);
+            } finally {
+                setIsCheckingDomain(false);
+            }
+        }
+
         try {
             setIsSending(true);
             setSendError(null);
@@ -79,6 +112,12 @@ export function TestEmailModal({ isOpen, onClose }: TestEmailModalProps) {
             const data = await response.json();
 
             if (!response.ok) {
+                // If server detects missing domain, trigger prompt
+                if (data.code === 'DOMAIN_MISSING') {
+                    setShowDomainPrompt(true);
+                    setIsSending(false);
+                    return;
+                }
                 throw new Error(data.error || 'Failed to send test email');
             }
 
@@ -96,173 +135,220 @@ export function TestEmailModal({ isOpen, onClose }: TestEmailModalProps) {
         }
     };
 
+    const handleSaveDomain = async (domain: string) => {
+        try {
+            // Get current site config
+            const response = await fetch('/api/plugin-website/settings');
+            const siteConfig = await response.json();
+            
+            const currentConfigs = siteConfig.domainLocaleConfig || [];
+            const newConfigs = [...currentConfigs];
+            
+            const existingIndex = newConfigs.findIndex((c: any) => c.locale === language);
+            if (existingIndex >= 0) {
+                newConfigs[existingIndex] = { ...newConfigs[existingIndex], domain };
+            } else {
+                newConfigs.push({ locale: language, domain });
+            }
+            
+            // Save updated site config
+            const saveResponse = await fetch('/api/plugin-website/settings', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({
+                    ...siteConfig,
+                    domainLocaleConfig: newConfigs
+                }),
+            });
+            
+            if (!saveResponse.ok) throw new Error('Failed to save website settings');
+            
+            // Re-trigger send with domain check skipped
+            setShowDomainPrompt(false);
+            handleSend(true);
+        } catch (error) {
+            console.error('Failed to save domain:', error);
+            throw error;
+        }
+    };
+
     if (!isOpen) return null;
 
     return (
-        <div className="fixed inset-0 z-50 flex items-center justify-center">
-            {/* Backdrop */}
-            <div 
-                className="absolute inset-0 bg-black/50 backdrop-blur-sm"
-                onClick={() => !isSending && onClose()}
-            />
-            
-            {/* Modal */}
-            <div className="relative w-full max-w-md mx-4 bg-white dark:bg-neutral-900 rounded-3xl border border-dashboard-border shadow-2xl overflow-hidden">
-                {/* Header */}
-                <div className="flex items-center justify-between px-8 py-6 border-b border-dashboard-border">
-                    <div className="flex items-center gap-3">
-                        <div className="w-10 h-10 rounded-2xl bg-primary/10 flex items-center justify-center">
-                            <Mail className="w-5 h-5 text-primary" />
-                        </div>
-                        <div>
-                            <h2 className="text-xl font-black text-dashboard-text uppercase tracking-tight">
-                                Test Email
-                            </h2>
-                            <p className="text-xs text-dashboard-text-secondary">
-                                Send a test email to verify SMTP
-                            </p>
-                        </div>
-                    </div>
-                    <button
-                        onClick={() => !isSending && onClose()}
-                        disabled={isSending}
-                        className="p-2 rounded-full hover:bg-dashboard-border transition-colors"
-                    >
-                        <X size={20} className="text-dashboard-text-secondary" />
-                    </button>
-                </div>
-
-                {/* Content */}
-                <div className="p-8">
-                    <div className="space-y-4">
-                        {/* Email Type Toggle */}
-                        <div>
-                            <label className="text-xs font-bold text-dashboard-text-secondary uppercase tracking-widest block mb-2">
-                                Email Template
-                            </label>
-                            <div className="flex gap-2">
-                                <button
-                                    onClick={() => setEmailType('test')}
-                                    className={`flex-1 flex items-center justify-center gap-2 px-4 py-3 rounded-xl text-xs font-bold uppercase tracking-widest transition-colors ${
-                                        emailType === 'test'
-                                            ? 'bg-primary text-white'
-                                            : 'bg-dashboard-bg border border-dashboard-border text-dashboard-text hover:bg-dashboard-border'
-                                    }`}
-                                >
-                                    <Mail size={14} />
-                                    Test
-                                </button>
-                                <button
-                                    onClick={() => setEmailType('welcome')}
-                                    disabled={!welcomeEmailConfigured}
-                                    className={`flex-1 flex items-center justify-center gap-2 px-4 py-3 rounded-xl text-xs font-bold uppercase tracking-widest transition-colors ${
-                                        emailType === 'welcome'
-                                            ? 'bg-primary text-white'
-                                            : welcomeEmailConfigured
-                                                ? 'bg-dashboard-bg border border-dashboard-border text-dashboard-text hover:bg-dashboard-border'
-                                                : 'bg-dashboard-bg border border-dashboard-border text-dashboard-text-secondary opacity-50 cursor-not-allowed'
-                                    }`}
-                                >
-                                    <Sparkles size={14} />
-                                    Welcome
-                                    {!welcomeEmailConfigured && (
-                                        <span className="text-[9px] normal-case opacity-70">(Not configured)</span>
-                                    )}
-                                </button>
+        <>
+            <div className="fixed inset-0 z-50 flex items-center justify-center">
+                {/* Backdrop */}
+                <div 
+                    className="absolute inset-0 bg-black/50 backdrop-blur-sm"
+                    onClick={() => !isSending && onClose()}
+                />
+                
+                {/* Modal */}
+                <div className="relative w-full max-w-md mx-4 bg-white dark:bg-neutral-900 rounded-3xl border border-dashboard-border shadow-2xl overflow-hidden">
+                    {/* Header */}
+                    <div className="flex items-center justify-between px-8 py-6 border-b border-dashboard-border">
+                        <div className="flex items-center gap-3">
+                            <div className="w-10 h-10 rounded-2xl bg-primary/10 flex items-center justify-center">
+                                <Mail className="w-5 h-5 text-primary" />
+                            </div>
+                            <div>
+                                <h2 className="text-xl font-black text-dashboard-text uppercase tracking-tight">
+                                    Test Email
+                                </h2>
+                                <p className="text-xs text-dashboard-text-secondary">
+                                    Send a test email to verify SMTP
+                                </p>
                             </div>
                         </div>
+                        <button
+                            onClick={() => !isSending && onClose()}
+                            disabled={isSending}
+                            className="p-2 rounded-full hover:bg-dashboard-border transition-colors"
+                        >
+                            <X size={20} className="text-dashboard-text-secondary" />
+                        </button>
+                    </div>
 
-                        <div>
-                            <label className="text-xs font-bold text-dashboard-text-secondary uppercase tracking-widest block mb-2">
-                                Recipient Email
-                            </label>
-                            <input
-                                type="email"
-                                value={email}
-                                onChange={(e) => {
-                                    setEmail(e.target.value);
-                                    setSendError(null);
-                                }}
-                                onKeyDown={(e) => e.key === 'Enter' && handleSend()}
-                                placeholder="your@email.com"
-                                className="w-full px-4 py-3 bg-dashboard-bg border border-dashboard-border rounded-xl outline-none focus:ring-2 focus:ring-primary transition-colors text-dashboard-text"
-                            />
-                        </div>
-
-                        <div>
-                            <label className="text-xs font-bold text-dashboard-text-secondary uppercase tracking-widest block mb-2">
-                                <Globe size={12} className="inline mr-1" />
-                                Language
-                            </label>
-                            <div className="flex gap-2">
-                                {languages.map((lang) => (
+                    {/* Content */}
+                    <div className="p-8">
+                        <div className="space-y-4">
+                            {/* Email Type Toggle */}
+                            <div>
+                                <label className="text-xs font-bold text-dashboard-text-secondary uppercase tracking-widest block mb-2">
+                                    Email Template
+                                </label>
+                                <div className="flex gap-2">
                                     <button
-                                        key={lang.code}
-                                        onClick={() => setLanguage(lang.code)}
-                                        className={`px-4 py-2 rounded-xl text-xs font-bold uppercase tracking-widest transition-colors ${
-                                            language === lang.code
+                                        onClick={() => setEmailType('test')}
+                                        className={`flex-1 flex items-center justify-center gap-2 px-4 py-3 rounded-xl text-xs font-bold uppercase tracking-widest transition-colors ${
+                                            emailType === 'test'
                                                 ? 'bg-primary text-white'
                                                 : 'bg-dashboard-bg border border-dashboard-border text-dashboard-text hover:bg-dashboard-border'
                                         }`}
                                     >
-                                        {lang.label}
+                                        <Mail size={14} />
+                                        Test
+                                    </button>
+                                    <button
+                                        onClick={() => setEmailType('welcome')}
+                                        disabled={!welcomeEmailConfigured}
+                                        className={`flex-1 flex items-center justify-center gap-2 px-4 py-3 rounded-xl text-xs font-bold uppercase tracking-widest transition-colors ${
+                                            emailType === 'welcome'
+                                                ? 'bg-primary text-white'
+                                                : welcomeEmailConfigured
+                                                    ? 'bg-dashboard-bg border border-dashboard-border text-dashboard-text hover:bg-dashboard-border'
+                                                    : 'bg-dashboard-bg border border-dashboard-border text-dashboard-text-secondary opacity-50 cursor-not-allowed'
+                                        }`}
+                                    >
+                                        <Sparkles size={14} />
+                                        Welcome
+                                        {!welcomeEmailConfigured && (
+                                            <span className="text-[9px] normal-case opacity-70">(Not configured)</span>
+                                        )}
                                     </button>
-                                ))}
+                                </div>
+                            </div>
+
+                            <div>
+                                <label className="text-xs font-bold text-dashboard-text-secondary uppercase tracking-widest block mb-2">
+                                    Recipient Email
+                                </label>
+                                <input
+                                    type="email"
+                                    value={email}
+                                    onChange={(e) => {
+                                        setEmail(e.target.value);
+                                        setSendError(null);
+                                    }}
+                                    onKeyDown={(e) => e.key === 'Enter' && handleSend()}
+                                    placeholder="your@email.com"
+                                    className="w-full px-4 py-3 bg-dashboard-bg border border-dashboard-border rounded-xl outline-none focus:ring-2 focus:ring-primary transition-colors text-dashboard-text"
+                                />
                             </div>
-                        </div>
 
-                        {sendError && (
-                            <div className="flex items-center gap-2 text-red-500 text-sm">
-                                <AlertCircle size={16} />
-                                {sendError}
+                            <div>
+                                <label className="text-xs font-bold text-dashboard-text-secondary uppercase tracking-widest block mb-2">
+                                    <Globe size={12} className="inline mr-1" />
+                                    Language
+                                </label>
+                                <div className="flex gap-2">
+                                    {languages.map((lang) => (
+                                        <button
+                                            key={lang.code}
+                                            onClick={() => setLanguage(lang.code)}
+                                            className={`px-4 py-2 rounded-xl text-xs font-bold uppercase tracking-widest transition-colors ${
+                                                language === lang.code
+                                                    ? 'bg-primary text-white'
+                                                    : 'bg-dashboard-bg border border-dashboard-border text-dashboard-text hover:bg-dashboard-border'
+                                            }`}
+                                        >
+                                            {lang.label}
+                                        </button>
+                                    ))}
+                                </div>
                             </div>
-                        )}
 
-                        <p className="text-xs text-dashboard-text-secondary">
-                            A test email will be sent to this address using your configured SMTP settings.
-                        </p>
+                            {sendError && (
+                                <div className="flex items-center gap-2 text-red-500 text-sm">
+                                    <AlertCircle size={16} />
+                                    {sendError}
+                                </div>
+                            )}
+
+                            <p className="text-xs text-dashboard-text-secondary">
+                                A test email will be sent to this address using your configured SMTP settings.
+                            </p>
+                        </div>
                     </div>
-                </div>
 
-                {/* Footer */}
-                <div className="flex items-center justify-end gap-3 px-8 py-6 border-t border-dashboard-border bg-dashboard-bg/50">
-                    <button
-                        onClick={onClose}
-                        disabled={isSending}
-                        className="px-6 py-3 rounded-full text-[10px] font-black uppercase tracking-widest transition-colors bg-dashboard-bg border border-dashboard-border text-dashboard-text hover:bg-dashboard-border"
-                    >
-                        Cancel
-                    </button>
-                    <button
-                        onClick={handleSend}
-                        disabled={isSending || sendSuccess}
-                        className={`inline-flex items-center gap-2 px-6 py-3 rounded-full text-[10px] font-black uppercase tracking-widest transition-colors shadow-lg ${
-                            isSending 
-                                ? 'bg-neutral-400 text-white cursor-not-allowed'
-                                : sendSuccess
-                                    ? 'bg-green-600 text-white'
-                                    : 'bg-primary text-white hover:bg-primary/90'
-                        }`}
-                    >
-                        {isSending ? (
-                            <>
-                                <RefreshCw className="w-4 h-4 animate-spin" />
-                                Sending...
-                            </>
-                        ) : sendSuccess ? (
-                            <>
-                                <CheckCircle2 className="w-4 h-4" />
-                                Sent!
-                            </>
-                        ) : (
-                            <>
-                                <Send className="w-4 h-4" />
-                                Send Test
-                            </>
-                        )}
-                    </button>
+                    {/* Footer */}
+                    <div className="flex items-center justify-end gap-3 px-8 py-6 border-t border-dashboard-border bg-dashboard-bg/50">
+                        <button
+                            onClick={onClose}
+                            disabled={isSending}
+                            className="px-6 py-3 rounded-full text-[10px] font-black uppercase tracking-widest transition-colors bg-dashboard-bg border border-dashboard-border text-dashboard-text hover:bg-dashboard-border"
+                        >
+                            Cancel
+                        </button>
+                        <button
+                            onClick={() => handleSend()}
+                            disabled={isSending || sendSuccess || isCheckingDomain}
+                            className={`inline-flex items-center gap-2 px-6 py-3 rounded-full text-[10px] font-black uppercase tracking-widest transition-colors shadow-lg ${
+                                isSending || isCheckingDomain
+                                    ? 'bg-neutral-400 text-white cursor-not-allowed'
+                                    : sendSuccess
+                                        ? 'bg-green-600 text-white'
+                                        : 'bg-primary text-white hover:bg-primary/90'
+                            }`}
+                        >
+                            {isSending || isCheckingDomain ? (
+                                <>
+                                    <RefreshCw className="w-4 h-4 animate-spin" />
+                                    {isCheckingDomain ? 'Checking...' : 'Sending...'}
+                                </>
+                            ) : sendSuccess ? (
+                                <>
+                                    <CheckCircle2 className="w-4 h-4" />
+                                    Sent!
+                                </>
+                            ) : (
+                                <>
+                                    <Send className="w-4 h-4" />
+                                    Send Test
+                                </>
+                            )}
+                        </button>
+                    </div>
                 </div>
             </div>
-        </div>
+
+            {/* Domain Prompt Modal */}
+            <DomainPromptModal
+                isOpen={showDomainPrompt}
+                onClose={() => setShowDomainPrompt(false)}
+                onSave={handleSaveDomain}
+                language={language}
+            />
+        </>
     );
 }

package/src/registry/BlockRegistry.ts

@@ -1,53 +0,0 @@
-/**
- * Block Registry for Newsletter Plugin
- * Dynamic registry for all block types in system
- * Multi-Tenant Architecture: Blocks are provided by client applications
- * 
- * The registry is a singleton that starts empty and is populated by client apps
- */
-
-import {
-    BlockTypeDefinition,
-    ClientBlockDefinition
-} from '../types/block';
-
-// Local interface to avoid import issues
-interface IBlockRegistry {
-    register(definition: BlockTypeDefinition): void;
-    get(type: string): BlockTypeDefinition | undefined;
-    getAll(): BlockTypeDefinition[];
-    has(type: string): boolean;
-    clear(): void;
-}
-
-/** 
- * Block Registry Implementation
- * Singleton that manages all block types in the system
- */
-class BlockRegistryImpl implements IBlockRegistry {
-    private blocks: Map<string, BlockTypeDefinition> = new Map();
-
-    register(definition: BlockTypeDefinition): void {
-        this.blocks.set(definition.type, definition);
-    }
-
-    get(type: string): BlockTypeDefinition | undefined {
-        return this.blocks.get(type);
-    }
-
-    getAll(): BlockTypeDefinition[] {
-        return Array.from(this.blocks.values());
-    }
-
-    has(type: string): boolean {
-        return this.blocks.has(type);
-    }
-
-    clear(): void {
-        this.blocks.clear();
-    }
-}
-
-// Export singleton instance
-export const BlockRegistry = new BlockRegistryImpl();
-export const blockRegistry = BlockRegistry;