From 10ef74af65d58042dbf5d507d4404dd412459b3c Mon Sep 17 00:00:00 2001
From: Wing-Kam Wong <wingkwong.code@gmail.com>
Date: Mon, 20 Mar 2023 18:49:55 +0800
Subject: [PATCH] enhancement(nc-gui): email validation in form view

---
 .../nc-gui/components/smartsheet/Form.vue     | 21 +++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/packages/nc-gui/components/smartsheet/Form.vue b/packages/nc-gui/components/smartsheet/Form.vue
index 0171c83a76..6edfc320d4 100644
--- a/packages/nc-gui/components/smartsheet/Form.vue
+++ b/packages/nc-gui/components/smartsheet/Form.vue
@@ -23,6 +23,7 @@ import {
   useUIPermission,
   useViewColumns,
   useViewData,
+  validateEmail,
   watch,
 } from '#imports'
 import type { Permission } from '~/lib'
@@ -101,6 +102,25 @@ const { t } = useI18n()
 
 const { betaFeatureToggleState } = useBetaFeatureToggle()
 
+const formRules = {
+  email: [
+    {
+      validator: (rule: any, value: string, callback: (errMsg?: string) => void) => {
+        if (!value || value.length === 0) {
+          callback('Email is required')
+          return
+        }
+        const invalidEmails = (value || '').split(/\s*,\s*/).filter((e: string) => !validateEmail(e))
+        if (invalidEmails.length > 0) {
+          callback(`${invalidEmails.length > 1 ? ' Invalid emails:' : 'Invalid email:'} ${invalidEmails.join(', ')} `)
+        } else {
+          callback()
+        }
+      },
+    },
+  ],
+}
+
 const updateView = useDebounceFn(
   () => {
     if ((formViewData.value?.subheading?.length || 0) > 255) {
@@ -719,6 +739,7 @@ watch(view, (nextView) => {
                         required: isRequired(element, element.required),
                         message: `${element.label || element.title} is required`,
                       },
+                      ...(element.uidt === UITypes.Email && formRules.email),
                     ]"
                   >
                     <LazySmartsheetCell