📧 SMTP Configuration

{\n e.preventDefault();\n testConnection();\n }}>\n

\n Hostname\n \n {errors.hostname && {errors.hostname}}\n

\n \n

\n From Email\n \n {errors.fromEmail && {errors.fromEmail}}\n

\n \n

\n Username\n \n {errors.username && {errors.username}}\n

\n \n

\n Port\n \n {errors.port && {errors.port}}\n

\n \n

\n Password\n \n {errors.password && {errors.password}}\n

\n \n

\n Security\n \n

\n\n

\n {connectionStatus.status === 'testing' && (\n

\n 🔄 Testing Connection...\n

\n )}\n {connectionStatus.status === 'success' && (\n

\n {connectionStatus.message}\n

\n )}\n {connectionStatus.status === 'error' && (\n

\n {connectionStatus.message}\n

\n )}\n

\n\n

\n \n \n

\n \n View Source\n \n

\n );\n}\n\nfunction App() {\n return ;\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n // Log the incoming request for debugging\n console.log('Incoming request:', {\n method: request.method,\n url: request.url,\n headers: Object.fromEntries(request.headers)\n });\n\n // Handle SMTP test route\n if (request.method === 'POST') {\n const url = new URL(request.url);\n \n // Check for both possible routes\n if (url.pathname === '/smtp-test' || url.pathname === '/test-smtp') {\n try {\n const config = await request.json();\n console.log('Received SMTP config:', config);\n\n // Validate configuration\n const requiredFields = ['hostname', 'username', 'password', 'port'];\n const missingFields = requiredFields.filter(field => !config[field]);\n\n if (missingFields.length > 0) {\n console.error('Missing fields:', missingFields);\n return Response.json({ \n success: false, \n message: `Missing required fields: ${missingFields.join(', ')}` \n }, { status: 400 });\n }\n\n // Simulate SMTP connection test\n await new Promise(resolve => setTimeout(resolve, 1000));\n\n return Response.json({ \n success: true,\n message: 'SMTP Connection Successful! 🎉',\n config: config // Echo back the config for debugging\n });\n } catch (error) {\n console.error('SMTP Test Error:', error);\n return Response.json({ \n success: false, \n message: error instanceof Error ? error.message : 'Unknown server error'\n }, { status: 500 });\n }\n }\n }\n\n // Serve the main HTML\n return new Response(`\n \n \n SMTP Configuration\n \n \n \n \n

\n \n \n \n \n `, {\n headers: { 'Content-Type': 'text/html' }\n });\n}\n\n// CSS remains the same as in the previous version\nconst css = `\n:root {\n --bg-color: #f0f4f8;\n --glass-bg: rgba(255, 255, 255, 0.7);\n --glass-border: rgba(255, 255, 255, 0.3);\n --text-color: #2d3748;\n --error-color: #e53e3e;\n --success-color: #48bb78;\n --testing-color: #ecc94b;\n}\n\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}\n\nbody {\n font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n min-height: 100vh;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 20px;\n color: var(--text-color);\n}\n\n.smtp-config-container {\n width: 100%;\n max-width: 600px;\n}\n\n.glass-card {\n background: var(--glass-bg);\n backdrop-filter: blur(10px);\n border-radius: 16px;\n border: 1px solid var(--glass-border);\n padding: 40px;\n box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);\n}\n\nh1 {\n text-align: center;\n margin-bottom: 30px;\n color: var(--text-color);\n font-size: 1.8rem;\n}\n\n.form-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 20px;\n}\n\n.form-group {\n display: flex;\n flex-direction: column;\n}\n\nlabel {\n margin-bottom: 8px;\n font-weight: 500;\n color: var(--text-color);\n}\n\ninput, select {\n width: 100%;\n padding: 12px;\n border: 1px solid rgba(0, 0, 0, 0.1);\n border-radius: 8px;\n background: rgba(255, 255, 255, 0.5);\n transition: all 0.3s ease;\n}\n\ninput:focus, select:focus {\n outline: none;\n border-color: #667eea;\n box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.2);\n}\n\ninput.error, select.error {\n border-color: var(--error-color);\n}\n\n.error-text {\n color: var(--error-color);\n font-size: 0.8rem;\n margin-top: 5px;\n}\n\n.button-group {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 15px;\n margin-top: 30px;\n}\n\nbutton {\n padding: 12px;\n border: none;\n border-radius: 8px;\n cursor: pointer;\n font-weight: 600;\n transition: all 0.3s ease;\n}\n\nbutton:first-child {\n background-color: #667eea;\n color: white;\n}\n\nbutton:last-child {\n background-color: #f56565;\n color: white;\n}\n\nbutton:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.connection-status {\n margin-top: 20px;\n text-align: center;\n}\n\n.status-message {\n padding: 10px;\n border-radius: 8px;\n font-weight: 500;\n}\n\n.status-message.testing {\n background-color: var(--testing-color);\n}\n\n.status-message.success {\n background-color: var(--success-color);\n color: white;\n}\n\n.status-message.error {\n background-color: var(--error-color);\n color: white;\n}\n\n.source-link {\n display: block;\n text-align: center;\n margin-top: 20px;\n color: var(--text-color);\n text-decoration: none;\n opacity: 0.7;\n transition: opacity 0.3s;\n}\n\n.source-link:hover {\n opacity: 1;\n}\n\n@media (max-width: 600px) {\n .form-grid {\n grid-template-columns: 1fr;\n }\n \n .glass-card {\n padding: 20px;\n }\n}\n`;","deleted","label",[98],"permalink","https://www.val.town/x/smsohag/smtp/code/main.tsx","extension","actionData","errors"]