4002 prevent user from creating twice the same blocklist item (#5213)

Closes #4002

packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsEmailsBlocklistInput.tsx

@@ -21,33 +21,42 @@ const StyledLinkContainer = styled.div`
 
 type SettingsAccountsEmailsBlocklistInputProps = {
   updateBlockedEmailList: (email: string) => void;
+  blockedEmailOrDomainList: string[];
 };
 
-const validationSchema = z
-  .object({
-    emailOrDomain: z
-      .string()
-      .trim()
-      .email('Invalid email or domain')
-      .or(
-        z
-          .string()
-          .refine(
-            (value) => value.startsWith('@') && isDomain(value.slice(1)),
-            'Invalid email or domain',
-          ),
-      ),
-  })
-  .required();
+const validationSchema = (blockedEmailOrDomainList: string[]) =>
+  z
+    .object({
+      emailOrDomain: z
+        .string()
+        .trim()
+        .email('Invalid email or domain')
+        .or(
+          z
+            .string()
+            .refine(
+              (value) => value.startsWith('@') && isDomain(value.slice(1)),
+              'Invalid email or domain',
+            ),
+        )
+        .refine(
+          (value) => !blockedEmailOrDomainList.includes(value),
+          'Email or domain is already in blocklist',
+        ),
+    })
+    .required();
 
-type FormInput = z.infer<typeof validationSchema>;
+type FormInput = {
+  emailOrDomain: string;
+};
 
 export const SettingsAccountsEmailsBlocklistInput = ({
   updateBlockedEmailList,
+  blockedEmailOrDomainList,
 }: SettingsAccountsEmailsBlocklistInputProps) => {
   const { reset, handleSubmit, control, formState } = useForm<FormInput>({
     mode: 'onSubmit',
-    resolver: zodResolver(validationSchema),
+    resolver: zodResolver(validationSchema(blockedEmailOrDomainList)),
     defaultValues: {
       emailOrDomain: '',
     },

packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsEmailsBlocklistSection.tsx

@@ -45,6 +45,7 @@ export const SettingsAccountsEmailsBlocklistSection = () => {
         description="Exclude the following people and domains from my email sync"
       />
       <SettingsAccountsEmailsBlocklistInput
+        blockedEmailOrDomainList={blocklist.map((item) => item.handle)}
         updateBlockedEmailList={updateBlockedEmailList}
       />
       <SettingsAccountsEmailsBlocklistTable