From 7675bb45ce6b043fe92c32589b9ea2a03d604f1d Mon Sep 17 00:00:00 2001
From: tamalCodes <tamalcodes@gmail.com>
Date: Mon, 16 Dec 2024 23:13:32 +0530
Subject: [PATCH] fix: profile completions

---
 .../profileCompletion/ProfileCompletion.jsx   | 47 +++++++++++++++----
 .../profileCompletion/ProfileCompletion.scss  | 12 +++++
 src/hooks/useProfileCompletion.js             |  4 +-
 src/integrations/ApiEndpoints.js              |  3 +-
 src/pages/dashboard/Dashboard.jsx             | 32 ++++++++-----
 src/service/MilanApi.js                       | 12 +++--
 6 files changed, 83 insertions(+), 27 deletions(-)

diff --git a/src/components/shared/profileCompletion/ProfileCompletion.jsx b/src/components/shared/profileCompletion/ProfileCompletion.jsx
index 7f7473a2..4aea5c21 100644
--- a/src/components/shared/profileCompletion/ProfileCompletion.jsx
+++ b/src/components/shared/profileCompletion/ProfileCompletion.jsx
@@ -1,12 +1,14 @@
 /* eslint-disable no-unused-vars */
 import useProfileCompletion from "@hooks/useProfileCompletion";
+import { completeProfileApiCall } from "@service/MilanApi";
+import { showSuccessToast } from "@utils/Toasts";
 import clsx from "clsx";
 import { useState } from "react";
 import { RxCross2 } from "react-icons/rx";
 import { Button } from "..";
 import "./ProfileCompletion.scss";
 
-const ProfileCompletion = ({ edit }) => {
+const ProfileCompletion = ({ edit, setShowEditModal, refreshProfileData }) => {
   const { errors, validateForm, handleChange, credentials } =
     useProfileCompletion();
 
@@ -30,14 +32,41 @@ const ProfileCompletion = ({ edit }) => {
       <div className="profilecompletion_modal">
         <div className="profilecompletion_header">
           {edit === false ? (
-            <>
-              {" "}
-              <h1> We&apos;re almost done </h1>
-              <p>
-                To make your Organization visible to others, please complete
-                your profile.
-              </p>
-            </>
+            <div className="profilecompletion_header_top">
+              <div>
+                <h1> We&apos;re almost done </h1>
+                <p>
+                  To make your Organization visible to others, please complete
+                  your profile.
+                </p>
+              </div>
+
+              <Button
+                type="submit"
+                disabled={
+                  !credentials?.description ||
+                  !credentials?.address?.line1 ||
+                  !credentials?.address?.line2 ||
+                  !credentials?.address?.city ||
+                  !credentials?.address?.state ||
+                  !credentials?.address?.country ||
+                  !credentials?.address?.pincode
+                }
+                onClickfunction={async () => {
+                  const data = await completeProfileApiCall({
+                    credentials,
+                  });
+
+                  if (data?.status === 200) {
+                    showSuccessToast(data?.data?.message);
+                    setShowEditModal(false);
+                    refreshProfileData();
+                  }
+                }}
+              >
+                Save
+              </Button>
+            </div>
           ) : (
             <div className="profilecompletion_header_edit">
               <RxCross2 />
diff --git a/src/components/shared/profileCompletion/ProfileCompletion.scss b/src/components/shared/profileCompletion/ProfileCompletion.scss
index b230d6c3..8b757d47 100644
--- a/src/components/shared/profileCompletion/ProfileCompletion.scss
+++ b/src/components/shared/profileCompletion/ProfileCompletion.scss
@@ -40,6 +40,17 @@
       z-index: 10;
       padding: 10px 1rem;
 
+      .profilecompletion_header_top {
+        display: flex;
+        align-items: start;
+        justify-content: space-between;
+
+        button {
+          width: 15%;
+          font-family: var(--outfit);
+        }
+      }
+
       .profilecompletion_header_edit {
         display: flex;
         align-items: center;
@@ -57,6 +68,7 @@
           font-family: var(--outfit);
           width: 15%;
           border-radius: 10px;
+          margin-top: 0;
         }
       }
 
diff --git a/src/hooks/useProfileCompletion.js b/src/hooks/useProfileCompletion.js
index bc9e303f..09d68559 100644
--- a/src/hooks/useProfileCompletion.js
+++ b/src/hooks/useProfileCompletion.js
@@ -1,5 +1,5 @@
 import { STATUSCODE } from "@/static/Constants";
-import { UpdateUserApiCall } from "@service/MilanApi";
+import { completeProfileApiCall } from "@service/MilanApi";
 import { showSuccessToast } from "@utils/Toasts";
 import { useState } from "react";
 
@@ -76,7 +76,7 @@ const useProfileCompletion = () => {
 
     setErrors(newErrors);
 
-    const data = await UpdateUserApiCall({
+    const data = await completeProfileApiCall({
       credentials: {
         ...updatedCredentials,
         config: {
diff --git a/src/integrations/ApiEndpoints.js b/src/integrations/ApiEndpoints.js
index 8d0458fd..004e39d0 100644
--- a/src/integrations/ApiEndpoints.js
+++ b/src/integrations/ApiEndpoints.js
@@ -3,8 +3,9 @@ const API = import.meta.env.VITE_API_URL;
 const userEndpoints = {
   details: (userName) => `${API}/user?userName=${userName}`,
   profile: `${API}/user/profile`,
-  update: `${API}/user/update`,
+  update: `${API}/user/update/profile`,
   report: `${API}/user/report`,
+  completeProfile: `${API}/user/completeprofile`,
 };
 
 const clubEndpoints = {
diff --git a/src/pages/dashboard/Dashboard.jsx b/src/pages/dashboard/Dashboard.jsx
index ff9ca2c1..2169ed61 100644
--- a/src/pages/dashboard/Dashboard.jsx
+++ b/src/pages/dashboard/Dashboard.jsx
@@ -13,14 +13,18 @@ const Dashboard = () => {
   const [showEditModal, setShowEditModal] = useState(false);
   const dispatch = useDispatch();
 
-  const { data: profileData } = useSWR(userEndpoints.profile, fetcher, {
-    onSuccess: (data) => {
-      dispatch(updateUserData(data));
+  const { data: profileData, mutate: refreshProfileData } = useSWR(
+    userEndpoints.profile,
+    fetcher,
+    {
+      onSuccess: (data) => {
+        dispatch(updateUserData(data?.user));
+      },
+      onError: (error) => {
+        showErrorToast(error?.response?.data?.message);
+      },
     },
-    onError: (error) => {
-      showErrorToast(error?.response?.data?.message);
-    },
-  });
+  );
 
   return (
     <>
@@ -60,8 +64,8 @@ const Dashboard = () => {
             </button>
 
             <div className="profile_details">
-              <h2>{profileData?.name}</h2>
-              <p>{profileData?.description}</p>
+              <h2>{profileData?.user?.name}</h2>
+              <p>{profileData?.user?.description}</p>
             </div>
           </div>
 
@@ -75,8 +79,14 @@ const Dashboard = () => {
         </div>
       </div>
 
-      {(profileData?.config?.hasCompletedProfile === false ||
-        showEditModal === true) && <ProfileCompletion edit={showEditModal} />}
+      {(profileData?.user?.config?.hasCompletedProfile === false ||
+        showEditModal === true) && (
+        <ProfileCompletion
+          edit={showEditModal}
+          setShowEditModal={setShowEditModal}
+          refreshProfileData={refreshProfileData}
+        />
+      )}
     </>
   );
 };
diff --git a/src/service/MilanApi.js b/src/service/MilanApi.js
index 0fb31933..08bcdb24 100644
--- a/src/service/MilanApi.js
+++ b/src/service/MilanApi.js
@@ -62,11 +62,15 @@ export const ReportProblem = async (credentials) => {
 };
 
 // UPDATE USER
-export const UpdateUserApiCall = async ({ credentials }) => {
+export const completeProfileApiCall = async ({ credentials }) => {
   try {
-    const response = await Axios.patch(userEndpoints.update, credentials, {
-      withCredentials: true,
-    });
+    const response = await Axios.patch(
+      userEndpoints.completeProfile,
+      credentials,
+      {
+        withCredentials: true,
+      },
+    );
 
     return response;
   } catch (error) {