src/components/AuthPages/Login/index.jsx

@@ -8,7 +8,7 @@ import usersService from "../../../services/UsersService";
 import InputCom from "../../Helpers/Inputs/InputCom";
 import AuthLayout from "../AuthLayout";
 //import { GoogleOAuthProvider } from '@react-oauth/google';
-import { googleLogout, useGoogleLogin } from '@react-oauth/google';
+// import { googleLogout, useGoogleLogin } from '@react-oauth/google';
 
 import { useDispatch } from "react-redux";
 import { updateUserDetails } from "../../../store/UserDetails";
@@ -222,7 +222,8 @@ const BrandBtn = ({ link, imgSrc, brand }) => {
   return (
     <div className="flex justify-center bottomMargin">
       <a
-          onClick={doGoogle}
+          // onClick={doGoogle}
+          href="#dd"
         className="w-full border border-light-purple dark:border-[#5356fb29]  rounded-[0.475rem] h-[48px] flex justify-center bg-[#FAFAFA] hover:bg-[#eff2f5] hover:text-[#7e8299] transition duration-300 dark:bg-[#11131F]  items-center font-medium cursor-pointer"
       >
         <img className="mr-3 h-6" src={imgSrc} alt="logo-icon(s)" />

src/components/FamilyAcc/FamilyTable.jsx

@@ -13,12 +13,12 @@ export default function FamilyTable({ className, familyList, loader }) {
       }`}
     >
       <div className="relative w-full overflow-x-auto sm:rounded-lg">
-        <table className="w-full text-sm text-left text-gray-500 dark:text-gray-400 relative">
           {loader ? (
             <div className="h-full min-h-[500px] w-full overflow-hidden flex justify-center items-center">
            <LoadingSpinner size='16' color='sky-blue' />
             </div>
           ) : (
+        <table className="w-full text-sm text-left text-gray-500 dark:text-gray-400 relative">
             <>
               <thead className="sticky top-0">
                 <tr className="text-base text-thin-light-gray whitespace-nowrap border-b dark:border-[#5356fb29]  default-border-bottom ">
@@ -81,8 +81,8 @@ export default function FamilyTable({ className, familyList, loader }) {
                       </tr>
                     ))
                   ) : (
-                    <tr class="font-bold text-xl text-dark-gray dark:text-white whitespace-nowrap">
-                      <td class="p-2" colspan="4">
+                    <tr className="font-bold text-xl text-dark-gray dark:text-white whitespace-nowrap">
+                      <td className="p-2" colSpan="4">
                         No Family Accounts Found!
                       </td>
                     </tr>
@@ -90,8 +90,8 @@ export default function FamilyTable({ className, familyList, loader }) {
                 </>
               </tbody>
             </>
-          )}
         </table>
+          )}
       </div>
     </div>
   );

src/components/FamilyAcc/index.jsx

@@ -1,5 +1,4 @@
-import React, { useCallback, useEffect, useId, useMemo, useState } from "react";
-import CustomPopUp from "../Helpers/CustomPopUp";
+import React, { useCallback, useEffect, useMemo, useState } from "react";
 import InputCom from "../Helpers/Inputs/InputCom";
 import Layout from "../Partials/Layout";
 import FamilyTable from "./FamilyTable";

src/components/Helpers/CustomPopUp/index.jsx

@@ -1,80 +0,0 @@
-import React, { useEffect } from "react";
-
-const CustomPopUp = ({
-  name,
-  btn_class,
-  title,
-  children,
-  isOpen,
-  setIsOpen,
-  modalHandler,
-}) => {
-  const handleOpen = () => {
-    setIsOpen(true);
-  };
-
-  const handleClose = () => {
-    setIsOpen(false);
-  };
-
-  useEffect(() => {
-    if (modalHandler) {
-      document.body.style.overflowY = "hidden";
-    }
-    return () => {
-      document.body.style.overflowY = "unset";
-    };
-  });
-
-  return (
-    <div>
-      <button onClick={handleOpen} className={btn_class}>
-        {name}
-      </button>
-
-      {isOpen && (
-        <div className="modal-com">
-          <div
-            className={`fixed top-0 left-0 w-full lg:h-[100vh] h-full bg-black bg-opacity-40 backdrop-filter backdrop-blur-sm z-50`}
-          ></div>
-          <div className="children-element fixed lg:h-100vh h-full z-[99999999999999] w-full lg:w-auto ">
-            <div className="bg-white rounded-md p-6 shadow-lg transform transition-all duration-300 ease-in-out dark:bg-dark-white logout-modal-wrapper lg:w-[460px] lg:h-auto  max-[467px]:max-w-[26rem]">
-              <div className="w-full flex items-center justify-between lg:px-4 lg:py-8 px-[30px] py-[23px] border-b dark:border-[#5356fb29] border-light-purple">
-                {title && (
-                  <h1 className="text-26 font-bold text-dark-gray dark:text-white tracking-wide cursor-default">
-                    {title}
-                  </h1>
-                )}
-                <button onClick={handleClose}>
-                  <CloseIcon />
-                </button>
-              </div>
-              <div className="logout-modal-body w-full flex flex-col items-center px-4 py-8">
-                {children && children}
-              </div>
-            </div>
-          </div>
-        </div>
-      )}
-    </div>
-  );
-};
-
-export default CustomPopUp;
-
-const CloseIcon = () => (
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    fill="none"
-    viewBox="0 0 24 24"
-    strokeWidth={1.5}
-    stroke="currentColor"
-    className="w-6 h-6"
-  >
-    <path
-      strokeLinecap="round"
-      strokeLinejoin="round"
-      d="M6 18L18 6M6 6l12 12"
-    />
-  </svg>
-);