an unexpected error ocurred when trying to save the template

src/app/admin/settings/email-templates/page.tsx

@@ -28,7 +28,7 @@ function EmailPreview({ template }: { template: EmailTemplate }) {
             <p class="text-2xl font-bold">[Ready-Made Hours]+ hours</p>
         </div>
     </div>`
-  ).replace(/\n/g, '<br />');
+  ).replace('[User Name]', 'Valued Customer').replace(/\n/g, '<br />');
 
   return (
     <div className="w-full rounded-lg border bg-muted p-6">
@@ -43,6 +43,7 @@ function EmailPreview({ template }: { template: EmailTemplate }) {
 export default function EmailTemplatesPage() {
   const [isEditing, setIsEditing] = useState(false);
   const [template, setTemplate] = useState<EmailTemplate>({ subject: '', body: '' });
+  const [originalTemplate, setOriginalTemplate] = useState<EmailTemplate>({ subject: '', body: '' });
   const [isLoading, setIsLoading] = useState(true);
   const { toast } = useToast();
 
@@ -53,6 +54,7 @@ export default function EmailTemplatesPage() {
         const fetchedTemplate = await getEmailTemplate();
         if (fetchedTemplate) {
           setTemplate(fetchedTemplate);
+          setOriginalTemplate(fetchedTemplate);
         } else {
            throw new Error('Could not find email template.');
         }
@@ -69,6 +71,11 @@ export default function EmailTemplatesPage() {
     fetchTemplate();
   }, [toast]);
 
+  const handleCancel = () => {
+    setTemplate(originalTemplate);
+    setIsEditing(false);
+  };
+
   const handleSave = async () => {
     try {
       const result = await updateEmailTemplate(template);
@@ -77,6 +84,7 @@ export default function EmailTemplatesPage() {
           title: 'Success',
           description: 'Email template updated successfully.',
         });
+        setOriginalTemplate(template);
         setIsEditing(false);
       } else {
         throw new Error(result.message);
@@ -109,7 +117,7 @@ export default function EmailTemplatesPage() {
               <Button variant="outline" onClick={() => setIsEditing(true)}>Edit Template</Button>
             ) : (
                 <div className="flex gap-2">
-                    <Button variant="outline" onClick={() => setIsEditing(false)}>Cancel</Button>
+                    <Button variant="outline" onClick={handleCancel}>Cancel</Button>
                     <Button onClick={handleSave}>Save Changes</Button>
                 </div>
             )}

src/lib/actions/email.ts

@@ -24,7 +24,8 @@ export async function getEmailTemplate(): Promise<{ subject: string; body: strin
     return template;
   } catch (error) {
     console.error('Failed to get email template:', error);
-    return null;
+    // Propagate the error to be handled by the caller
+    throw new Error('Database error while fetching email template.');
   }
 }
 
@@ -43,12 +44,16 @@ export async function updateEmailTemplate(data: { subject: string; body: string
   try {
     const stmt = db.prepare('UPDATE email_templates SET subject = ?, body = ? WHERE id = ?');
     // We assume we're updating the template with id = 1
-    stmt.run(subject, body, 1);
+    const info = stmt.run(subject, body, 1);
+    
+    if (info.changes === 0) {
+      return { success: false, message: 'Could not find the template to update. No changes were made.' };
+    }
 
     revalidatePath('/admin/settings/email-templates');
     return { success: true, message: 'Email template updated successfully!' };
-  } catch (error) {
+  } catch (error: any) {
     console.error('Failed to update email template:', error);
-    return { success: false, message: 'An unexpected error occurred.' };
+    return { success: false, message: error.message || 'An unexpected database error occurred.' };
   }
 }