bug fixes

Signed-off-by: sayyedarib <[email protected]>
anmode · Oct 21, 2023 · 392e793 · 392e793
1 parent 61582fe
commit 392e793
Show file tree

Hide file tree

Showing 6 changed files with 36 additions and 15 deletions.
diff --git a/components/UI/Button/Button.js b/components/UI/Button/Button.js
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import styles from "./Button.module.css";
 
 function Button({
@@ -8,9 +8,12 @@ function Button({
   className,
   type = "button",
   onClick,
+  loading=false
 }) {
-  const [isLoading, setIsLoading] = useState(false);
+  const [isLoading, setIsLoading] = useState(loading);
   let variantClass = `btn${variant.charAt(0).toUpperCase()}${variant.slice(1)}`;
+
+  useEffect(()=>{setIsLoading(loading)}, [loading])
   return isLoading ? (
     <div className="tw-flex tw-justify-center tw-items-center">
       <img

diff --git a/components/basic/ComingSoon.js b/components/basic/ComingSoon.js
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { useRouter } from "next/router";
 import axios from "axios";
 import { RiFacebookFill, RiTwitterFill, RiLinkedinFill } from "react-icons/ri";
@@ -17,6 +17,8 @@ const ComingSoon = () => {
   const [email, setEmail] = useState("");
   const [subscriptionSuccess, setSubscriptionSuccess] = useState(false);
 
+  useEffect(()=>{}, [isLoading]);
+
   const handleSubmit = (e) => {
     e.preventDefault();
     setIsLoading(true);
@@ -58,6 +60,7 @@ const ComingSoon = () => {
           LeftIcon={MdKeyboardArrowLeft}
           text="back"
           className="tw-flex tw-items-center"
+          loading={true}
         />
 
         {/* header and form section */}
@@ -97,6 +100,7 @@ const ComingSoon = () => {
                   type="submit"
                   onClick={handleSubmit}
                   className="tw-w-full tw-mt-4 sm:tw-mt-0 sm:tw-w-fit"
+                  loading={isLoading}
                 />
               )}
             </form>

diff --git a/components/layout/Footer.js b/components/layout/Footer.js
@@ -13,25 +13,29 @@ import FooterColumn from "./FooterColumn";
 import { FaCheckCircle } from "react-icons/fa";
 
 function Footer() {
+
+  const [email, setEmail] = useState("");
+  const [subscriptionSuccess, setSubscriptionSuccess] = useState(false);
+  const [isLoading, setIsLoading] = useState(false);
+  const currentYear = new Date().getFullYear();
+
   const handleSubmit = (e) => {
     e.preventDefault();
-
+    setIsLoading(true);
     axios
       .post(`${process.env.NEXT_PUBLIC_BACKEND_URL}/api/newsletter/subscribe`, {
         email,
       })
       .then((response) => {
-        console.log(response.data);
+        setIsLoading(false);
         setSubscriptionSuccess(true);
       })
       .catch((error) => {
+        setIsLoading(false);
         console.error(error);
       });
   };
 
-  const [email, setEmail] = useState("");
-  const [subscriptionSuccess, setSubscriptionSuccess] = useState(false);
-  const currentYear = new Date().getFullYear();
   return (
     <footer className="tw-font-sans tw-bg-base-100 tw-px-5">
       <div className="tw-w-full tw-max-w-7xl tw-py-16 tw-mx-auto">
@@ -124,6 +128,7 @@ function Footer() {
                   type="submit"
                   onClick={handleSubmit}
                   className="tw-w-full md:tw-w-max"
+                  loading={isLoading}
                 />
               </form>
             )}

diff --git a/components/mentorDashboard/ListedSessionComponent/AddForm.js b/components/mentorDashboard/ListedSessionComponent/AddForm.js
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import axios from "axios";
 import { toast } from "react-toastify";
 import { Button } from "../../UI";
@@ -11,24 +11,27 @@ const AddSessionComponent = ({ setSessions, setAddSession }) => {
     duration: "",
     price: "",
   };
+  const [isLoading, setIsLoading] = useState(false);
   const [data, setData] = useState(initialData);
 
   // on submit funxtion for add form
   const handleSubmit = async (e) => {
     e.preventDefault();
     try {
+      setIsLoading(true);
       const url = `${process.env.NEXT_PUBLIC_BACKEND_URL}/api/mentors/addListedSession`;
       const response = await axios.put(url, data, { withCredentials: true });
-
-      if (!response.data.session) {
+      if (!response.data.sessions) {
         // Handle null session here
         toast.error("Session creation failed. Please check your input.");
       } else {
         setSessions(response.data.sessions);
         setAddSession(false);
         toast.success("New Session added successfully.");
       }
+      setIsLoading(false);
     } catch (error) {
+      setIsLoading(false);
       if (
         error.response &&
         error.response.status >= 400 &&
@@ -50,6 +53,8 @@ const AddSessionComponent = ({ setSessions, setAddSession }) => {
     }));
   };
 
+  useEffect(()=>{}, [isLoading])
+
   return (
     <>
       <div className="tw-flex tw-justify-center tw-items-center tw-pb-[5rem] tw-flex-wrap max-[512px]:tw-p-0 max-[512px]:tw-m-0">
@@ -193,7 +198,7 @@ const AddSessionComponent = ({ setSessions, setAddSession }) => {
                 }}
               />
 
-              <Button text="Add Session" type="submit" onClick={handleSubmit} />
+              <Button text="Add Session" type="submit" onClick={handleSubmit} loading={isLoading}/>
             </form>
           </div>
         </div>

diff --git a/components/mentorDashboard/ListedSessionComponent/EditForm.js b/components/mentorDashboard/ListedSessionComponent/EditForm.js
@@ -8,7 +8,7 @@ const EditSessionComponent = ({ sessionID, setSessionID, setSessions }) => {
   const [data, setData] = useState(null);
   const mentorData = JSON.parse(localStorage.getItem("mentorData"));
   const username = mentorData?.mentor_username;
-
+  const [isLoading, setIsLoading] = useState(false);
   // fetching session on load
   useEffect(() => {
     // Fetch session data only if data hasn't been fetched yet
@@ -31,12 +31,15 @@ const EditSessionComponent = ({ sessionID, setSessionID, setSessions }) => {
   const handleSubmit = async (e) => {
     e.preventDefault();
     try {
+      setIsLoading(true);
       const url = `${process.env.NEXT_PUBLIC_BACKEND_URL}/api/mentors/updateListedSession`;
       const response = await axios.put(url, data, { withCredentials: true });
       setSessions(response.data.updatedSessions);
       setSessionID(null);
+      setIsLoading(false);
       toast.success("Changes saved successfully.");
     } catch (error) {
+      setIsLoading(false);
       if (
         error.response &&
         error.response.status >= 400 &&
@@ -206,6 +209,7 @@ const EditSessionComponent = ({ sessionID, setSessionID, setSessions }) => {
                   text="Save Changes"
                   type="submit"
                   onClick={handleSubmit}
+                  loading={isLoading}
                 />
               </form>
             </div>

diff --git a/components/mentorDashboard/home.js b/components/mentorDashboard/home.js
@@ -275,15 +275,15 @@ const Home = ({
                     )}
                     {card.session && (
                       <div className="tw-flex tw-flex-col tw-gap-2 tw-items-center tw-justify-center">
-                        {card.session.length > 0 ? (
+                        {card?.session?.type ? (
                           <div>
                             <h2 className="tw-font-semibold tw-text-md">
                               Title:{" "}
                               <span className="tw-text-sm tw-text-primary-200">
                                 {card.session.title}
                               </span>
                             </h2>
-                            <div className="tw-flex tw-flex-col tw-items-center tw-gap-1">
+                            <div className="tw-flex tw-flex-col tw-items-start pl-4 tw-gap-1">
                               <p className="tw-text-sm tw-font-semibold tw-text-primary-200">
                                 {card.session.type}
                               </p>