From 57be599bb5f07b8513ae5ab44ebb8729d1838521 Mon Sep 17 00:00:00 2001
From: Ebube <ebube.ojinta@chiefsoft.com>
Date: Wed, 10 Jan 2024 17:41:52 +0100
Subject: [PATCH] added the pageload api

---
 src/components/YourPage/LoadedPage.jsx   | 32 ++++++++++++++++++++++
 src/components/YourPage/getMyPageLoad.js | 35 ++++++++++++++++++++++++
 src/components/YourPage/index.jsx        | 11 +++++++-
 src/services/UsersService.js             | 10 +++++++
 src/store/TableReloads.js                |  4 +++
 5 files changed, 91 insertions(+), 1 deletion(-)
 create mode 100644 src/components/YourPage/LoadedPage.jsx
 create mode 100644 src/components/YourPage/getMyPageLoad.js

diff --git a/src/components/YourPage/LoadedPage.jsx b/src/components/YourPage/LoadedPage.jsx
new file mode 100644
index 0000000..856bc38
--- /dev/null
+++ b/src/components/YourPage/LoadedPage.jsx
@@ -0,0 +1,32 @@
+import React from "react";
+import GetMyPageLoad from "./getMyPageLoad";
+
+
+const LoadedPage = () => {
+  const { loading, data, error } = GetMyPageLoad();
+  
+
+  return (
+    <div className="w-full border border-gray-400 rounded-md p-4 flex flex-col h-72 gap-2 overflow-y-auto">
+      {loading ? (
+        <>
+          <h1 className="text-xl font-bold tracking-wide">...</h1>
+          <p>...</p>
+        </>
+      ) : error ? (
+        <>
+          <h1 className="text-xl font-bold tracking-wide">Unable to load</h1>
+        </>
+      ) : (
+        <>
+          <h1 className="text-xl font-bold tracking-wide">
+            {!data.intro ? "Introduction" : data.intro}
+          </h1>
+          <p>{!data.description ? "Brief Details" : data.description}</p>
+        </>
+      )}
+    </div>
+  );
+};
+
+export default LoadedPage;
diff --git a/src/components/YourPage/getMyPageLoad.js b/src/components/YourPage/getMyPageLoad.js
new file mode 100644
index 0000000..d34339d
--- /dev/null
+++ b/src/components/YourPage/getMyPageLoad.js
@@ -0,0 +1,35 @@
+import { useEffect, useState } from "react";
+import usersService from "../../services/UsersService";
+import { useSelector } from "react-redux";
+
+
+const GetMyPageLoad = () => {
+  const { yourPageTable } = useSelector((state) => state.tableReload);
+
+    const [response, setResponse] = useState({
+      loading: true,
+      data: null,
+      error: null,
+    });
+  
+    useEffect(() => {
+      const fetchData = async () => {
+        let api = new usersService();
+        try {
+          const res = await api.MyPageLoad();
+
+          setResponse({ loading: false, data: res.data, error: null });
+
+          console.log(response.data)
+        } catch (error) {
+          setResponse({ loading: false, data: null, error: error.message });
+        }
+      };
+  
+      fetchData();
+    }, [yourPageTable]);
+  
+    return response;
+  };
+  
+  export default GetMyPageLoad;
\ No newline at end of file
diff --git a/src/components/YourPage/index.jsx b/src/components/YourPage/index.jsx
index 550f5cd..62e3d24 100644
--- a/src/components/YourPage/index.jsx
+++ b/src/components/YourPage/index.jsx
@@ -2,8 +2,12 @@ import React, { useState } from "react";
 import Layout from "../Partials/Layout";
 import usersService from "../../services/UsersService";
 import YourPageForm from "./YourPageForm";
+import LoadedPage from "./LoadedPage";
+import { useDispatch } from "react-redux";
+import { tableReload } from "../../store/TableReloads";
 
 const YourPage = () => {
+  const dispatch = useDispatch;
   const [pageValues, setPageValues] = useState({
     intro: "",
     description: "",
@@ -22,6 +26,8 @@ const YourPage = () => {
   };
 
   const updateYourPageDetails = async () => {
+    if (!pageValues.intro || !pageValues.description) return;
+    
     try {
       setResponse({ loading: true, error: "", msg: "" });
 
@@ -35,6 +41,8 @@ const YourPage = () => {
           msg: "Page updated successfully",
         });
 
+        dispatch(tableReload({ type: "YourPageTable" }));
+
         // Clear form after successful update
         setPageValues({ intro: "", description: "" });
       }, 2000);
@@ -52,7 +60,7 @@ const YourPage = () => {
     <Layout>
       <div className="notification-page w-full mb-10">
         <div className="notification-wrapper w-full">
-          <div className="update-table w-full h-full p-4 bg-white dark:bg-dark-white overflow-y-auto rounded-2xl section-shadow min-h-[520px]">
+          <div className="update-table w-full h-full p-4 bg-white dark:bg-dark-white overflow-y-auto rounded-2xl section-shadow min-h-[650px]">
             <h1 className="text-26 font-bold text-dark-gray dark:text-white tracking-wide mb-2">
               My page
             </h1>
@@ -63,6 +71,7 @@ const YourPage = () => {
               onSubmit={updateYourPageDetails}
               loading={response.loading}
             />
+            <LoadedPage />
           </div>
         </div>
       </div>
diff --git a/src/services/UsersService.js b/src/services/UsersService.js
index 58df97e..2e70874 100644
--- a/src/services/UsersService.js
+++ b/src/services/UsersService.js
@@ -15,6 +15,16 @@ class usersService {
     return this.postAuxEnd("/mypageintro", postData);
   }
 
+  MyPageLoad() {
+    var postData = {
+      uid: localStorage.getItem("uid"),
+      member_id: localStorage.getItem("member_id"),
+      sessionid: localStorage.getItem("session_token"),
+      action: 11070
+    };
+    return this.postAuxEnd("/mypageload", postData);
+  }
+
   CreateUser(reqData) {
     localStorage.setItem("session_token", ``);
     return this.postAuxEnd("/createuser", reqData);
diff --git a/src/store/TableReloads.js b/src/store/TableReloads.js
index cc1a298..d32cea5 100644
--- a/src/store/TableReloads.js
+++ b/src/store/TableReloads.js
@@ -8,6 +8,7 @@ const initialState = {
   couponTable: false,
   walletTable: false,
   uploadsTable: false,
+  yourPageTable: false,
 };
 
 export const tableReloadSlice = createSlice({
@@ -37,6 +38,9 @@ export const tableReloadSlice = createSlice({
         case "UPLOADSTABLE":
           state.uploadsTable = !state.uploadsTable;
           return;
+        case "YourPageTable":
+          state.yourPageTable = !state.yourPageTable;
+          return;
         default:
           return state;
       }