♻️ Add email pattern and refactor in frontend (#1138)

frontend/src/components/UserSettings/UserInformation.tsx

@@ -24,6 +24,7 @@ import {
 } from "../../client"
 import useAuth from "../../hooks/useAuth"
 import useCustomToast from "../../hooks/useCustomToast"
+import { emailPattern } from "../../utils"
 
 const UserInformation: React.FC = () => {
   const queryClient = useQueryClient()
@@ -114,10 +115,7 @@ const UserInformation: React.FC = () => {
                 id="email"
                 {...register("email", {
                   required: "Email is required",
-                  pattern: {
-                    value: /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i,
-                    message: "Invalid email address",
-                  },
+                  pattern: emailPattern,
                 })}
                 type="email"
                 size="md"