diff --git a/src/features/emails/components/EmailEditor/EmailSettings/PreviewTab.tsx b/src/features/emails/components/EmailEditor/EmailSettings/PreviewTab.tsx
index c99ae46f6..7ab8522d0 100644
--- a/src/features/emails/components/EmailEditor/EmailSettings/PreviewTab.tsx
+++ b/src/features/emails/components/EmailEditor/EmailSettings/PreviewTab.tsx
@@ -1,20 +1,33 @@
-import { FC } from 'react';
+import { FC, useEffect, useState } from 'react';
import {
Alert,
Box,
Button,
CircularProgress,
+ TextField,
Typography,
} from '@mui/material';
+import z from 'zod';
+import { ErrorOutlined } from '@mui/icons-material';
import messageIds from 'features/emails/l10n/messageIds';
import { Msg } from 'core/i18n';
import useCurrentUser from 'features/user/hooks/useCurrentUser';
import useSendTestEmail from 'features/emails/hooks/useSendTestEmail';
+const emailAddressIsValid = (emailAddress: string): boolean =>
+ z.string().email().safeParse(emailAddress).success;
+
const PreviewTab: FC = () => {
const user = useCurrentUser();
const { emailWasSent, isLoading, reset, sendTestEmail } = useSendTestEmail();
+ const [emailError, setEmailError] = useState(false);
+ const [destinationEmailAddress, setDestinationEmailAddress] = useState('');
+ useEffect(() => {
+ if (user && destinationEmailAddress == '') {
+ setDestinationEmailAddress(user.email);
+ }
+ }, [user?.email]);
if (!user) {
return null;
@@ -28,7 +41,21 @@ const PreviewTab: FC = () => {
- {user.email}
+ setDestinationEmailAddress(ev.target.value)}
+ type="email"
+ value={destinationEmailAddress}
+ />
+ {emailError && (
+ }>
+
+
+
+
+ )}
{emailWasSent && (
@@ -47,7 +74,12 @@ const PreviewTab: FC = () => {
{!emailWasSent && (