💰 BATCH PRICE

Submit the price of your selected batch

\n\n \n\n {!isShareSupported && (\n

\n 📱 Your device might not fully support automatic email sharing\n

\n )}\n\n

\n {comments.map((c, index) => (\n

\n {c.name.charAt(0).toUpperCase()}\n

{c.name}

\n \n {new Date(c.timestamp).toLocaleTimeString([], { hour: \"2-digit\", minute: \"2-digit\" })}\n \n

{c.comment}

\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 const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n const { email } = await import(\"https://esm.town/v/std/email\");\n const KEY = \"Mailbox\";\n const SCHEMA_VERSION = 10; // Incrementing schema version\n\n // Create comments table\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${KEY}_comments_${SCHEMA_VERSION} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n name TEXT NOT NULL,\n email TEXT NOT NULL,\n comment TEXT NOT NULL,\n timestamp DATETIME DEFAULT CURRENT_TIMESTAMP\n )\n `);\n\n // Handle comment submission\n if (request.method === \"POST\" && new URL(request.url).pathname === \"/submit-comment\") {\n const { name, email: userEmail, comment } = await request.json();\n\n // Save to database\n await sqlite.execute(\n `\n INSERT INTO ${KEY}_comments_${SCHEMA_VERSION} (name, email, comment) \n VALUES (?, ?, ?)\n `,\n [name, userEmail, comment],\n );\n\n // Send notification email to val owner\n await email({\n subject: \"Batch Price Submitted\",\n text: `Name: ${name}\\nEmail: ${userEmail}\\nTarget Email: studypoormail@gmail.com\\n\\nBatch Price: ${comment}`,\n html: `\n

Batch Price Submitted

Name: ${name}

Email: ${userEmail}

Target Email: studypoormail@gmail.com

Batch Price: ${comment}`,\n });\n\n return new Response(JSON.stringify({ success: true }), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n // Fetch comments\n if (request.method === \"GET\" && new URL(request.url).pathname === \"/get-comments\") {\n const result = await sqlite.execute(`\n SELECT name, email, comment, timestamp \n FROM ${KEY}_comments_${SCHEMA_VERSION} \n ORDER BY timestamp DESC \n LIMIT 50\n `);\n return new Response(JSON.stringify(result.rows), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n // Serve HTML\n return new Response(\n `\n \n \n Batch Price Submission\n \n \n \n \n

\n \n \n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n },\n },\n );\n}\n\n// CSS remains unchanged\nconst css = `\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-color: #f4f6f9;\n display: flex;\n justify-content: center;\n min-height: 100vh;\n line-height: 1.6;\n}\n\n.comment-container {\n width: 100%;\n max-width: 600px;\n padding: 20px;\n}\n\n.comment-wrapper {\n background-color: white;\n border-radius: 12px;\n box-shadow: 0 10px 25px rgba(0,0,0,0.05);\n padding: 30px;\n}\n\n.share-warning {\n background-color: #fff3cd;\n color: #856404;\n padding: 10px;\n border-radius: 8px;\n margin-bottom: 20px;\n text-align: center;\n}\n\n.comment-header {\n text-align: center;\n margin-bottom: 25px;\n}\n\n.comment-header h1 {\n color: #2c3e50;\n margin-bottom: 10px;\n}\n\n.modern-comment-form {\n display: flex;\n flex-direction: column;\n gap: 15px;\n margin-bottom: 30px;\n}\n\n.input-group {\n display: flex;\n flex-direction: column;\n gap: 15px;\n}\n\n.modern-comment-form input,\n.modern-comment-form textarea {\n width: 100%;\n padding: 12px;\n border: 1px solid #e0e0e0;\n border-radius: 8px;\n transition: border-color 0.3s;\n}\n\n.modern-comment-form textarea {\n min-height: 120px;\n resize: vertical;\n}\n\n.modern-comment-form button {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 10px;\n background-color: #3498db;\n color: white;\n border: none;\n padding: 12px;\n border-radius: 8px;\n cursor: pointer;\n transition: background-color 0.3s;\n}\n\n.modern-comment-form button:hover {\n background-color: #2980b9;\n}\n\n.comments-display {\n display: flex;\n flex-direction: column;\n gap: 15px;\n}\n\n.comment-item {\n display: flex;\n align-items: flex-start;\n gap: 15px;\n background-color: #f9f9f9;\n padding: 15px;\n border-radius: 8px;\n}\n\n.comment-avatar {\n width: 40px;\n height: 40px;\n background-color: #3498db;\n color: white;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n font-weight: bold;\n}\n\n.comment-content {\n flex-grow: 1;\n}\n\n.comment-content .comment-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: left;\n margin-bottom: 10px;\n}\n\n.comment-content h4 {\n color: #2c3e50;\n}\n\n.comment-time {\n color: #7f8c8d;\n font-size: 0.8em;\n}\n\n@media (max-width: 600px) {\n .comment-wrapper {\n padding: 20px;\n }\n}\n`;","deleted","label",[98],"permalink","https://www.val.town/x/Nothingboy/Mailbox/code/main.tsx","extension","actionData","errors"]