From 0d094d06604096e3d5ffeb3ff70ca92443f73b90 Mon Sep 17 00:00:00 2001
From: A-Hazzard <aaronsploit@gmail.com>
Date: Mon, 4 Nov 2024 00:47:42 -0400
Subject: [PATCH] Hid client withdrawals and invoices url from admin navbar &
 panel

---
 components/InvoiceManagement.tsx | 74 +++++++++++++-------------
 components/Navbar.tsx            | 91 ++++++++++++++++----------------
 components/Panel.tsx             | 86 +++++++++++++++---------------
 3 files changed, 125 insertions(+), 126 deletions(-)

diff --git a/components/InvoiceManagement.tsx b/components/InvoiceManagement.tsx
index 10a400d..ce7080a 100644
--- a/components/InvoiceManagement.tsx
+++ b/components/InvoiceManagement.tsx
@@ -80,50 +80,50 @@ const InvoiceManagement = () => {
     amountRange: "",
   });
   const [sortConfig, setSortConfig] = useState<SortConfig>({ field: '', direction: 'asc' });
-  const [unsubscribe, setUnsubscribe] = useState<(() => void) | null>(null);
 
   useEffect(() => {
-    subscribeToInvoices();
+    let unsubscribe: (() => void) | undefined;
+
+    const setupSubscription = () => {
+      setLoading(true);
+      try {
+        const invoicesCollection = collection(db, "invoices");
+        unsubscribe = onSnapshot(invoicesCollection, (snapshot) => {
+          const invoicesData: Invoice[] = snapshot.docs.map((doc) => {
+            const data = doc.data() as DocumentData;
+            return {
+              id: doc.id,
+              invoiceNumber: data.invoiceNumber,
+              description: data.description,
+              amount: parseFloat(data.amount) || 0,
+              date: data.date,
+              status: data.status,
+              userId: data.userId,
+              userEmail: data.userEmail,
+              createdAt: data.createdAt,
+              username: data.username,
+              country: data.country,
+              userName: data.username,
+            };
+          });
+          setInvoices(invoicesData);
+          setLoading(false);
+        });
+      } catch (err) {
+        console.error("Error subscribing to invoices:", err);
+        setLoading(false);
+      }
+    };
+
+    setupSubscription();
+
+    // Cleanup subscription on unmount
     return () => {
-      // Cleanup subscription on component unmount
       if (unsubscribe) {
         unsubscribe();
       }
     };
-  }, [unsubscribe]);
-
-  const subscribeToInvoices = () => {
-    setLoading(true);
-    try {
-      const invoicesCollection = collection(db, "invoices");
-      const unsub = onSnapshot(invoicesCollection, (snapshot) => {
-        const invoicesData: Invoice[] = snapshot.docs.map((doc) => {
-          const data = doc.data() as DocumentData;
-          return {
-            id: doc.id,
-            invoiceNumber: data.invoiceNumber,
-            description: data.description,
-            amount: parseFloat(data.amount) || 0,
-            date: data.date,
-            status: data.status,
-            userId: data.userId,
-            userEmail: data.userEmail,
-            createdAt: data.createdAt,
-            username: data.username,
-            country: data.country,
-            userName: data.username,
-          };
-        });
-        setInvoices(invoicesData);
-        setLoading(false);
-      });
-      
-      setUnsubscribe(() => unsub);
-    } catch (err) {
-      console.error("Error subscribing to invoices:", err);
-      setLoading(false);
-    }
-  };
+  }, []);
 
   const handleAddInvoice = async () => {
     // Validation
diff --git a/components/Navbar.tsx b/components/Navbar.tsx
index 42ad235..ce9bb26 100644
--- a/components/Navbar.tsx
+++ b/components/Navbar.tsx
@@ -79,33 +79,17 @@ const Navbar = () => {
               className="absolute top-4 right-4 cursor-pointer text-light"
             />
             <nav className="flex flex-col items-center gap-4">
-              <Link
-                href="/"
-                className={`text-lg text-light ${
-                  pathname === "/" ? "underline font-bold" : ""
-                }`}
-                onClick={toggleNavbar}
-              >
-                Dashboard
-              </Link>
-              <Link
-                href="/invoices"
-                className={`text-lg text-light ${
-                  pathname === "/invoices" ? "underline font-bold" : ""
-                }`}
-                onClick={toggleNavbar}
-              >
-                Invoices
-              </Link>
-              <Link
-                href="/withdrawals"
-                className={`text-lg text-light ${
-                  pathname === "/withdrawals" ? "underline font-bold" : ""
-                }`}
-                onClick={toggleNavbar}
-              >
-                Withdrawals
-              </Link>
+              {!isAdmin && (
+                <Link
+                  href="/"
+                  className={`text-lg text-light ${
+                    pathname === "/" ? "underline font-bold" : ""
+                  }`}
+                  onClick={toggleNavbar}
+                >
+                  Dashboard
+                </Link>
+              )}
               <Link
                 href="/resources"
                 className={`text-lg text-light ${
@@ -115,26 +99,46 @@ const Navbar = () => {
               >
                 Resources
               </Link>
-
+              {!isAdmin && (
+                <>
+                  <Link
+                    href="/invoices"
+                    className={`text-lg text-light ${
+                      pathname === "/invoices" ? "underline font-bold" : ""
+                    }`}
+                    onClick={toggleNavbar}
+                  >
+                    Invoices
+                  </Link>
+                  <Link
+                    href="/withdrawals"
+                    className={`text-lg text-light ${
+                      pathname === "/withdrawals" ? "underline font-bold" : ""
+                    }`}
+                    onClick={toggleNavbar}
+                  >
+                    Withdrawals
+                  </Link>
+                </>
+              )}
               {isAdmin && (
                 <>
+                  <div className="w-full border-t border-gray my-2"></div>
+                  <span className="text-gray text-sm">Admin Panel</span>
+                  
                   <Link
-                    href="/admin/manage-resources"
+                    href="/admin/user-management"
                     className={`text-lg text-light ${
-                      pathname === "/admin/manage-resources"
-                        ? "underline font-bold"
-                        : ""
+                      pathname === "/admin/user-management" ? "underline font-bold" : ""
                     }`}
                     onClick={toggleNavbar}
                   >
-                    Manage Resources
+                    User Management
                   </Link>
                   <Link
                     href="/admin/invoices"
                     className={`text-lg text-light ${
-                      pathname === "/admin/invoices"
-                        ? "underline font-bold"
-                        : ""
+                      pathname === "/admin/invoices" ? "underline font-bold" : ""
                     }`}
                     onClick={toggleNavbar}
                   >
@@ -143,9 +147,7 @@ const Navbar = () => {
                   <Link
                     href="/admin/deposits"
                     className={`text-lg text-light ${
-                      pathname === "/admin/deposits"
-                        ? "underline font-bold"
-                        : ""
+                      pathname === "/admin/deposits" ? "underline font-bold" : ""
                     }`}
                     onClick={toggleNavbar}
                   >
@@ -154,9 +156,7 @@ const Navbar = () => {
                   <Link
                     href="/admin/withdrawals"
                     className={`text-lg text-light ${
-                      pathname === "/admin/withdrawals"
-                        ? "underline font-bold"
-                        : ""
+                      pathname === "/admin/withdrawals" ? "underline font-bold" : ""
                     }`}
                     onClick={toggleNavbar}
                   >
@@ -172,16 +172,17 @@ const Navbar = () => {
                     Trade Results
                   </Link>
                   <Link
-                    href="/admin/user-management"
+                    href="/admin/manage-resources"
                     className={`text-lg text-light ${
-                      pathname === "/admin/user-management" ? "underline font-bold" : ""
+                      pathname === "/admin/manage-resources" ? "underline font-bold" : ""
                     }`}
                     onClick={toggleNavbar}
                   >
-                    User Management
+                    Manage Resources
                   </Link>
                 </>
               )}
+              <div className="w-full border-t border-gray my-2"></div>
               <div className="flex flex-col items-center gap-4">
                 <button
                   className="bg-none text-light inline w-fit"
diff --git a/components/Panel.tsx b/components/Panel.tsx
index 4812e52..821a404 100644
--- a/components/Panel.tsx
+++ b/components/Panel.tsx
@@ -64,16 +64,28 @@ export default function Panel() {
       </div>
 
       <ul className="flex flex-col gap-4">
+        {!isAdmin && (
+          <Link
+            href="/"
+            className={`text-lg text-light ${
+              pathname === "/" ? "underline font-bold" : ""
+            }`}
+          >
+            Dashboard
+          </Link>
+        )}
+
+        <Link
+          href="/resources"
+          className={`text-lg text-light ${
+            pathname === "/resources" ? "underline font-bold" : ""
+          }`}
+        >
+          Resources
+        </Link>
+
         {!isAdmin && (
           <>
-            <Link
-              href="/"
-              className={`text-lg text-light ${
-                pathname === "/" ? "underline font-bold" : ""
-              }`}
-            >
-              Dashboard
-            </Link>
             <Link
               href="/invoices"
               className={`text-lg text-light ${
@@ -93,77 +105,63 @@ export default function Panel() {
           </>
         )}
 
-        <Link
-          href="/resources"
-          className={`text-lg text-light ${
-            pathname === "/resources" ? "underline font-bold" : ""
-          }`}
-        >
-          Resources
-        </Link>
-
-        <button className="bg-none inline w-fit" onClick={openModal}>
-          Profile
-        </button>
-
         {isAdmin && (
           <>
+            <div className="w-full border-t border-gray my-2"></div>
+            <span className="text-gray text-sm">Admin Panel</span>
+            
+            <Link
+              href="/admin/user-management"
+              className={pathname === "/admin/user-management" ? "underline" : ""}
+            >
+              User Management
+            </Link>
             <Link
               href="/admin/invoices"
               className={pathname === "/admin/invoices" ? "underline" : ""}
             >
               Invoices
             </Link>
-
             <Link
               href="/admin/deposits"
               className={pathname === "/admin/deposits" ? "underline" : ""}
             >
               Deposits
             </Link>
-
             <Link
               href="/admin/withdrawals"
               className={pathname === "/admin/withdrawals" ? "underline" : ""}
             >
               Withdrawals
             </Link>
-
             <Link
               href="/admin/trades"
               className={pathname === "/admin/trades" ? "underline" : ""}
             >
               Trade Results
             </Link>
-
             <Link
               href="/admin/manage-resources"
-              className={
-                pathname === "/admin/manage-resources" ? "underline" : ""
-              }
+              className={pathname === "/admin/manage-resources" ? "underline" : ""}
             >
               Manage Resources
             </Link>
-
-            <Link
-              href="/admin/user-management"
-              className={
-                pathname === "/admin/user-management" ? "underline" : ""
-              }
-            >
-              User Management
-            </Link>
           </>
         )}
       </ul>
 
-      <button
-        className="bg-transparent w-fit text-light absolute bottom-0 left-0 flex items-center gap-2"
-        onClick={handleSignOut}
-      >
-        <LogOut size={20} />
-        Sign Out
-      </button>
+      <div className="mt-auto">
+        <button className="bg-none inline w-fit mb-4" onClick={openModal}>
+          Profile
+        </button>
+        <button
+          className="bg-transparent w-fit text-light flex items-center gap-2"
+          onClick={handleSignOut}
+        >
+          <LogOut size={20} />
+          Sign Out
+        </button>
+      </div>
       {isOpen && <ProfileSettingsModal onClose={closeModal} />}
     </div>
   );