import * as React from 'npm:react@18.3.1' import { Body, Container, Head, Heading, Html, Preview, Text, Button } from 'npm:@react-email/components@0.0.22' import type { TemplateEntry } from './registry.ts' const SITE_NAME = 'Avria Community Management' const DEFAULT_LINK = 'https://avria.cloud/dashboard/tasks' interface Props { taskTitle?: string assignedByName?: string link?: string } const TaskNotificationEmail = ({ taskTitle, assignedByName, link }: Props) => ( New task assigned to you New task assigned {assignedByName ? `${assignedByName} has assigned ` : 'You have been assigned '} a new task: {taskTitle || 'New task'} This notification was sent by {SITE_NAME}. ) export const template = { component: TaskNotificationEmail, subject: (d: Record) => `New Task Assigned: ${d.taskTitle || 'New task'}`, displayName: 'Task notification', previewData: { taskTitle: 'Review monthly financial report', assignedByName: 'Jane Admin', link: DEFAULT_LINK }, } satisfies TemplateEntry const main = { backgroundColor: '#ffffff', fontFamily: 'Inter, Arial, sans-serif' } const container = { maxWidth: '600px', margin: '0 auto', padding: '28px 24px' } const h1 = { color: '#111827', fontSize: '22px', lineHeight: '30px', margin: '0 0 14px', fontWeight: '700' } const text = { color: '#374151', fontSize: '15px', lineHeight: '24px', margin: '0 0 12px' } const taskBox = { background: '#f6f7f9', border: '1px solid #e5e7eb', borderRadius: '6px', padding: '12px 14px', color: '#111827', fontSize: '15px', margin: '0 0 20px' } const button = { backgroundColor: '#2941a4', color: '#ffffff', borderRadius: '6px', fontSize: '14px', fontWeight: '600', textDecoration: 'none', padding: '12px 18px' } const footer = { color: '#6b7280', fontSize: '12px', lineHeight: '18px', margin: '28px 0 0' }