refactor: made phone field optional for signer/contact

Author: prafull-opensignlabs

apps/OpenSign/src/components/AddSigner.js

@@ -274,6 +274,7 @@ const AddSigner = (props) => {
               onChange={(e) => setPhone(e.target.value)}
               disabled={addYourself}
               className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
+              placeholder={t("phone-optional")}
             />
           </div>
           <div className="mt-4 flex gap-x-2 justify-start">

apps/OpenSign/src/components/AddUser.js

@@ -434,10 +434,9 @@ const AddUser = (props) => {
                     <input
                       type="text"
                       name="phone"
-                      placeholder="optional"
+                      placeholder={t("phone-optional")}
                       value={formdata.phone}
                       onChange={(e) => handleChange(e)}
-                      // required
                       className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
                     />
                   </div>

apps/OpenSign/src/pages/GuestLogin.js

@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from "react";
 import { useNavigate, useParams } from "react-router-dom";
 import axios from "axios";
-import { isEnableSubscription } from "../constant/const";
+import { emailRegex, isEnableSubscription } from "../constant/const";
 import {
   contractUsers,
   getAppLogo,
@@ -189,23 +189,30 @@ function GuestLogin() {
   };
   const handleUserData = async (e) => {
     e.preventDefault();
-    const params = { ...contact, docId: documentId };
-    try {
-      setLoading(true);
-      const linkContactRes = await Parse.Cloud.run("linkcontacttodoc", params);
-      setContactId(linkContactRes.contactId);
-      const IsEnableOTP = await navigateToDoc(
-        documentId,
-        linkContactRes.contactId
-      );
-      if (!IsEnableOTP) {
-        setEnterOtp(true);
-        await SendOtp();
+    if (!emailRegex.test(contact.email)) {
+      alert("Please enter a valid email address.");
+    } else {
+      const params = { ...contact, docId: documentId };
+      try {
+        setLoading(true);
+        const linkContactRes = await Parse.Cloud.run(
+          "linkcontacttodoc",
+          params
+        );
+        setContactId(linkContactRes.contactId);
+        const IsEnableOTP = await navigateToDoc(
+          documentId,
+          linkContactRes.contactId
+        );
+        if (!IsEnableOTP) {
+          setEnterOtp(true);
+          await SendOtp();
+        }
+      } catch (err) {
+        setLoading(false);
+        alert(t("something-went-wrong-mssg"));
+        console.log("Err in link ext contact", err);
       }
-    } catch (err) {
-      setLoading(false);
-      alert(t("something-went-wrong-mssg"));
-      console.log("Err in link ext contact", err);
     }
   };
   const handleInputChange = (e) => {
@@ -348,6 +355,7 @@ function GuestLogin() {
                       onChange={handleInputChange}
                       className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
                       disabled={loading}
+                      placeholder={t("phone-optional")}
                     />
                   </div>
                   <div className="mt-2 flex justify-start">

apps/OpenSign/src/pages/SSOVerify.js

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
 import { useLocation, useNavigate } from "react-router-dom";
 import Parse from "parse";
 import { appInfo } from "../constant/appinfo";
-import { isEnableSubscription } from "../constant/const";
+import { emailRegex, isEnableSubscription } from "../constant/const";
 import { fetchSubscription } from "../constant/Utils";
 import { useDispatch } from "react-redux";
 import { showTenant } from "../redux/reducers/ShowTenant";
@@ -88,54 +88,58 @@ const SSOVerify = () => {
   // `handleSubmitbtn` is used to create a user in the extended class
   const handleSubmitbtn = async (e) => {
     e.preventDefault();
-    setIsLoader(true);
-    let phone;
-    if (userDetails?.phone) {
-      phone = validateInput(userDetails?.phone);
+    if (!emailRegex.test(userDetails.email)) {
+      alert("Please enter a valid email address.");
     } else {
-      phone = true;
-    }
-    if (userDetails.Destination && userDetails.Company && phone) {
-      const payload = { sessionToken: localStorage.getItem("accesstoken") };
-      if (payload && payload.sessionToken) {
-        const params = {
-          userDetails: {
-            name: userDetails.name,
-            email: userDetails.email,
-            phone: userDetails?.phone || "",
-            role: "contracts_User",
-            company: userDetails.Company,
-            jobTitle: userDetails.Destination
-          }
-        };
-        try {
-          const userSignUp = await Parse.Cloud.run("usersignup", params);
-          if (userSignUp && userSignUp.sessionToken) {
-            const LocalUserDetails = params.userDetails;
-            localStorage.setItem(
-              "userDetails",
-              JSON.stringify(LocalUserDetails)
-            );
-            await thirdpartyLoginfn(userSignUp.sessionToken);
-            setIsLoader(false);
-          } else {
-            alert(userSignUp.message);
+      setIsLoader(true);
+      let phone;
+      if (userDetails?.phone) {
+        phone = validateInput(userDetails?.phone);
+      } else {
+        phone = true;
+      }
+      if (userDetails.Destination && userDetails.Company && phone) {
+        const payload = { sessionToken: localStorage.getItem("accesstoken") };
+        if (payload && payload.sessionToken) {
+          const params = {
+            userDetails: {
+              name: userDetails.name,
+              email: userDetails.email,
+              phone: userDetails?.phone || "",
+              role: "contracts_User",
+              company: userDetails.Company,
+              jobTitle: userDetails.Destination
+            }
+          };
+          try {
+            const userSignUp = await Parse.Cloud.run("usersignup", params);
+            if (userSignUp && userSignUp.sessionToken) {
+              const LocalUserDetails = params.userDetails;
+              localStorage.setItem(
+                "userDetails",
+                JSON.stringify(LocalUserDetails)
+              );
+              await thirdpartyLoginfn(userSignUp.sessionToken);
+              setIsLoader(false);
+            } else {
+              alert(userSignUp.message);
+              setIsLoader(false);
+            }
+          } catch (err) {
+            console.log("error in usersignup", err);
+            localStorage.removeItem("accesstoken");
+            alert(t("something-went-wrong-mssg"));
             setIsLoader(false);
           }
-        } catch (err) {
-          console.log("error in usersignup", err);
+        } else {
           localStorage.removeItem("accesstoken");
-          alert(t("something-went-wrong-mssg"));
+          alert(t("server-error"));
           setIsLoader(false);
         }
       } else {
-        localStorage.removeItem("accesstoken");
-        alert(t("server-error"));
+        alert(t("filed-required-correctly"));
         setIsLoader(false);
       }
-    } else {
-      alert(t("filed-required-correctly"));
-      setIsLoader(false);
     }
   };
   // `thirdpartyLoginfn` is used to save necessary parameters locally for the logged-in user

apps/OpenSign/src/primitives/AddContact.js

@@ -197,6 +197,7 @@ const AddContact = (props) => {
               onChange={(e) => setPhone(e.target.value)}
               disabled={addYourself}
               className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
+              placeholder={t("phone-optional")}
             />
           </div>