updated image and Form server

src/components/Contact/Form.jsx

@@ -28,6 +28,7 @@ import discord from "../../assets/images/contactDiscord.png";
 import forml from "../../assets/images/forml.png";
 import { Link } from "react-router-dom";
 import ReCAPTCHA from "react-google-recaptcha";
+import { contactUs } from "../../service/api";
 
 const Contact = () => {
   const {
@@ -42,44 +43,33 @@ const Contact = () => {
   const [recaptchaToken, setRecaptchaToken] = useState(null);
   const [captchaError, setCaptchaError] = useState("");
 
-  const email = "rubix@gmail.com";
+  // const email = "rubix@gmail.com";
 
   const handleVerify = (token) => {
     setRecaptchaToken(token);
   };
 
+  console.log(errors);
   const onSubmit = async (data) => {
-    // console.log(data);
-    if (!recaptchaToken) {
-      setCaptchaError("Please complete the reCAPTCHA.");
-    } else {
-      setIsLoading(true);
-      try {
-        const formdata = new FormData();
-        formdata.append("email", data.email);
-        formdata.append("phone", data.phone);
-        formdata.append("message", data.message);
-        formdata.append("firstname", data.firstName);
-        formdata.append("lastname", data.lastName);
-        formdata.append("typeofenquiry", data.typeofenquiry);
-        // formdata.append(
-        //   "subject",
-        //   `Thank you for contacting us | ${data.firstName + " " + data.lastName}`
-        // );
-        for (const pair of formdata.entries()) {
-          console.log(pair[0] + ":", pair[1]);
-        }
-        // formdata.append("html", html);
-        //   await contactUs(formdata);
-        setIsLoading(false);
-      } catch (error) {
-        setIsLoading(false);
-        setCaptchaError("Failed to submit the form. Please try again.");
-        console.log(error);
+    // if (!recaptchaToken) {
+    //   setCaptchaError("Please complete the reCAPTCHA.");
+    // } else {
+    //   setIsLoading(true);
+
+    //   reset();
+    // }
+    try {
+      const result = await contactUs(data);
+      if (result.status) {
+        onOpen();
       }
-      reset();
-      onOpen();
+      setIsLoading(false);
+    } catch (error) {
+      setIsLoading(false);
+      setCaptchaError("Failed to submit the form. Please try again.");
+      console.log(error);
     }
+    reset();
   };
 
   useEffect(() => {
@@ -334,19 +324,19 @@ const Contact = () => {
                       borderRadius: "5px",
                     }}
                     //   placeholder="First Name"
-                    {...register("firstName", {
+                    {...register("firstname", {
                       pattern: {
                         value: /^[A-Za-z]+$/i,
                         message:
                           "Please enter a valid First Name with only letters",
                       },
-                      required: true,
+                      required: "First Name is required",
                       maxLength: 20,
                     })}
                   />
-                  {errors.firstName && (
+                  {errors.firstname && (
                     <p style={{ fontSize: "13px", color: "red" }}>
-                      {errors.firstName.message}
+                      {errors.firstname.message}
                     </p>
                   )}
                 </Box>
@@ -372,18 +362,18 @@ const Contact = () => {
                       borderRadius: "5px",
                     }}
                     //   placeholder="Last Name"
-                    {...register("lastName", {
+                    {...register("lastname", {
                       pattern: {
                         value: /^[A-Za-z]+$/i,
                         message:
                           "Please enter a valid Last Name with only letters",
                       },
-                      required: true,
+                      required: "Last Name is required",
                     })}
                   />
-                  {errors.lastName && (
+                  {errors.lastname && (
                     <p style={{ fontSize: "13px", color: "red" }}>
-                      {errors.lastName.message}
+                      {errors.lastname.message}
                     </p>
                   )}
                 </Box>
@@ -581,7 +571,7 @@ const Contact = () => {
                 required
                 {...register("message", { required: true })}
               />
-              <ReCAPTCHA
+              {/* <ReCAPTCHA
                 style={{ display: "grid", placeContent: "left" }}
                 sitekey="6LfV87gpAAAAAMAAhyjTuaVjS7y6T_dXtMiLhsGJ"
                 onChange={handleVerify}
@@ -590,7 +580,7 @@ const Contact = () => {
                 <div style={{ color: "red", fontSize: "1.2rem" }}>
                   {captchaError}
                 </div>
-              )}
+              )} */}
               <Button
                 type="submit"
                 border={"none"}

src/components/HomePage/Partner.jsx

@@ -20,6 +20,13 @@ import ondc from "../../assets/images/ondc.png";
 import smartcity from "../../assets/images/smartcity.png";
 import ymca from "../../assets/images/ymca.png";
 import bescom from "../../assets/images/bescom.png";
+import kpmg from "../../assets/images/kpmg.png";
+import cwde from "../../assets/images/cwde.png";
+import tzero from "../../assets/images/tzero.png";
+import irctc from "../../assets/images/irctc.png";
+import hdfc from "../../assets/images/hdfc.png";
+import bharat from "../../assets/images/bharat.png";
+import zing from "../../assets/images/zing.png";
 
 import { Swiper, SwiperSlide } from "swiper/react";
 
@@ -151,11 +158,11 @@ export default function Partner() {
                   "@media (max-width: 996px)": {},
                 }}
               >
-                <Image src={chainx} sx={imgWidth} />
-                <Image src={jupiter} sx={imgWidth} />
-                <Image src={finalo} sx={imgWidth} />
-                <Image src={ymca} sx={imgWidth} />
-                <Image src={ondc} sx={imgWidth} />
+                <Image src={kpmg} sx={imgWidth} />
+                <Image src={cwde} sx={imgWidth} />
+                <Image src={tzero} sx={imgWidth} />
+                <Image src={irctc} sx={imgWidth} />
+                <Image src={hdfc} sx={imgWidth} />
               </Box>
               <Box
                 display={"flex"}
@@ -166,8 +173,8 @@ export default function Partner() {
                   "@media (max-width: 996px)": {},
                 }}
               >
-                <Image src={ensurity} sx={imgWidth} />
-                <Image src={exr} sx={imgWidth} />
+                <Image src={bharat} sx={imgWidth} />
+                <Image src={zing} sx={imgWidth} />
                 <Image src={iskon} sx={imgWidth} />
                 <Image src={smartcity} sx={imgWidth} />
                 <Image src={bescom} sx={imgWidth} />

src/service/api.js

@@ -0,0 +1,18 @@
+import axios from "axios";
+const API_URL = import.meta.env.VITE_API_BASE_URL;
+const instance = axios.create({
+    // baseURL:`${process.env.REACT_APP_DB_HOST}api/development/v1`,
+    baseURL: API_URL,
+    headers: {
+        "Content-Type": "application/json",
+    },
+});
+
+export const contactUs = async (data) => {
+    try {
+        console.log(data);
+        return await instance.post('/api/contactUs', data)
+    } catch (error) {
+        throw new Error("Failed Error occure :" + error.response?.data?.message)
+    }
+}