More error handling for frontend Create Matrix Page

ui/src/pages/CreateMatrix.tsx

@@ -45,6 +45,9 @@ export const CreateMatrix: React.FC = () => {
   const [snackbarErrorOpen, setSnackbarErrorOpen] = useState(false);
   const [titleError, setTitleError] = useState(false);
   const [snackbarTargetErrorOpen, setSnackbarTargetErrorOpen] = useState(false);
+  const [snackbarTargetErrorCharsOpen, setSnackbarTargetErrorCharsOpen] = useState(false);
+  const [snackbarCollaboratorsEmailsOpen, setSnackbarCollaboratorsEmailsOpen] = useState(false);
+  const [snackbarDuplicateEmailsOpen, setSnackbarDuplicateEmailsOpen] = useState(false);
   const [snackbarParticipantErrorOpen, setSnackbarParticipantErrorOpen] = useState(false);
   const [participantsData, setParticipantsData] = useState<
     { email: string; role: string }[]
@@ -240,6 +243,31 @@ export const CreateMatrix: React.FC = () => {
     try {
       // Duplicate check for targets
       const trimmedTargets = targets.map((target) => target.trim());
+
+      // Check for empty targets
+      const hasEmptyTarget = trimmedTargets.some((target) => target === "");
+      if (hasEmptyTarget) {
+        setSnackbarTargetErrorCharsOpen(true);
+        return;
+      }
+
+      // Check for empty emails
+      const hasEmptyEmail = participantsData.some((p) => p.email.trim() === "");
+      if (hasEmptyEmail) {
+        setSnackbarCollaboratorsEmailsOpen(true);
+        return;
+      }
+
+      // Check for duplicate emails
+      const emails = participantsData.map(p => p.email.trim().toLowerCase());
+      const uniqueEmails = new Set(emails);
+
+      if (uniqueEmails.size !== emails.length)
+      {
+        setSnackbarDuplicateEmailsOpen(true);
+        return;
+      }
+
       const uniqueTargets = new Set(trimmedTargets);
       if (uniqueTargets.size !== trimmedTargets.length) {
         setSnackbarErrorOpen(true);
@@ -280,7 +308,6 @@ export const CreateMatrix: React.FC = () => {
         recognizability: {},
         images: targetImages[index] || []
       }));
-
       const hosts = [
         email,
         ...participantsData
@@ -1210,6 +1237,81 @@ export const CreateMatrix: React.FC = () => {
         </Alert>
       </Snackbar>
 
+      <Snackbar
+        open={snackbarTargetErrorCharsOpen}
+        autoHideDuration={3000}
+        onClose={() => setSnackbarTargetErrorCharsOpen(false)}
+      >
+        <Alert
+          onClose={() => setSnackbarTargetErrorCharsOpen(false)}
+          severity="error"
+          variant="filled"
+          sx={{ 
+            width: "100%",
+            backgroundColor: '#7C0B02',
+            color: '#ffffff',
+            '& .MuiAlert-icon': {
+              color: '#ffffff'
+            },
+            boxShadow: '0 4px 6px rgba(0, 0, 0, 0.1)',
+            border: '1px solid rgba(255, 255, 255, 0.1)',
+            backdropFilter: 'blur(10px)',
+          }}
+        >
+          Each target must have at least 1 character
+        </Alert>
+      </Snackbar>
+
+      <Snackbar
+        open={snackbarCollaboratorsEmailsOpen}
+        autoHideDuration={3000}
+        onClose={() => setSnackbarCollaboratorsEmailsOpen(false)}
+      >
+        <Alert
+          onClose={() => setSnackbarCollaboratorsEmailsOpen(false)}
+          severity="error"
+          variant="filled"
+          sx={{ 
+            width: "100%",
+            backgroundColor: '#7C0B02',
+            color: '#ffffff',
+            '& .MuiAlert-icon': {
+              color: '#ffffff'
+            },
+            boxShadow: '0 4px 6px rgba(0, 0, 0, 0.1)',
+            border: '1px solid rgba(255, 255, 255, 0.1)',
+            backdropFilter: 'blur(10px)',
+          }}
+        >
+          Cannot have empty email
+        </Alert>
+      </Snackbar>
+
+      <Snackbar
+        open={snackbarDuplicateEmailsOpen}
+        autoHideDuration={3000}
+        onClose={() => setSnackbarDuplicateEmailsOpen(false)}
+      >
+        <Alert
+          onClose={() => setSnackbarDuplicateEmailsOpen(false)}
+          severity="error"
+          variant="filled"
+          sx={{ 
+            width: "100%",
+            backgroundColor: '#7C0B02',
+            color: '#ffffff',
+            '& .MuiAlert-icon': {
+              color: '#ffffff'
+            },
+            boxShadow: '0 4px 6px rgba(0, 0, 0, 0.1)',
+            border: '1px solid rgba(255, 255, 255, 0.1)',
+            backdropFilter: 'blur(10px)',
+          }}
+        >
+          Cannot have duplicate emails
+        </Alert>
+      </Snackbar>
+
       <Snackbar
         open={snackbarParticipantErrorOpen}
         autoHideDuration={3000}