From f268294b93c17f8b05a52fbed9a9985ac342b979 Mon Sep 17 00:00:00 2001
From: Mathis <avnyr@yidhra.fr>
Date: Thu, 20 Jun 2024 14:59:28 +0200
Subject: [PATCH] feat: Add new dashboard, admin, and wallet pages

Implement new page.tsx files for dashboard, admin, and wallet modules, providing essential UI logic and data-fetching mechanisms. These components handle their respective data retrieval and loading states, and present the information via relevant UI structures such as 'CryptosTable' and 'WalletTable'.
---
 src/app/dashboard/admin/page.tsx |  7 +++++
 src/app/dashboard/page.tsx       | 44 ++++++++++++++++++++++++++++++++
 src/app/wallet/page.tsx          | 40 +++++++++++++++++++++++++++++
 3 files changed, 91 insertions(+)
 create mode 100644 src/app/dashboard/admin/page.tsx
 create mode 100644 src/app/dashboard/page.tsx
 create mode 100644 src/app/wallet/page.tsx

diff --git a/src/app/dashboard/admin/page.tsx b/src/app/dashboard/admin/page.tsx
new file mode 100644
index 0000000..dfd8565
--- /dev/null
+++ b/src/app/dashboard/admin/page.tsx
@@ -0,0 +1,7 @@
+export default function AdminPage() {
+	return (<>
+		<section>
+			<h1>Welcome to the Dashboard</h1>
+		</section>
+	</>)
+}
\ No newline at end of file
diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx
new file mode 100644
index 0000000..53e2284
--- /dev/null
+++ b/src/app/dashboard/page.tsx
@@ -0,0 +1,44 @@
+"use client"
+
+import type {ICryptoInWalletInfo} from "@/interfaces/crypto.interface";
+import {CryptosTable} from "@/components/data-tables/cryptos-table";
+import {useEffect, useState} from "react";
+import {Skeleton} from "@/components/ui/skeleton";
+import ApiRequest from "@/services/apiRequest";
+import type {IApiAllOffersRes} from "@/interfaces/api.interface";
+
+
+export default function DashboardPage() {
+	const [isLoading, setIsLoading] = useState<boolean>(true)
+	const [cryptosList, setCryptosList] = useState<ICryptoInWalletInfo[]>([])
+	//FIX the loop
+
+	useEffect(() => {
+		ApiRequest.authenticated.get.json<ICryptoInWalletInfo[]>(
+			"crypto/all"
+		).then((response)=>{
+			if (response.data.length <= 0) {
+				setCryptosList([])
+				setIsLoading(false)
+				return
+			}
+			const resp = response.data
+			setCryptosList(resp)
+			setIsLoading(false)
+		})
+	}, []);
+
+	if (isLoading) {
+		return (<div className={"container flex flex-col justify-center items-center min-h-64 my-6 gap-4"}>
+			<h1 className={"text-2xl font-bold"}>Available cryptos</h1>
+			<Skeleton className={"container flex flex-col justify-center items-center min-h-64 my-6 gap-4"}/>
+		</div>)
+	}
+
+	return (<>
+		<section className={"container flex flex-col justify-center items-center min-h-64 my-6 gap-4"}>
+			<h1 className={"text-2xl font-bold"}>Available cryptos</h1>
+			<CryptosTable cryptosArray={cryptosList}/>
+		</section>
+	</>)
+}
\ No newline at end of file
diff --git a/src/app/wallet/page.tsx b/src/app/wallet/page.tsx
new file mode 100644
index 0000000..e3eb508
--- /dev/null
+++ b/src/app/wallet/page.tsx
@@ -0,0 +1,40 @@
+"use client"
+
+import type {ICryptoInWalletInfo} from "@/interfaces/crypto.interface";
+import {CryptosTable} from "@/components/data-tables/cryptos-table";
+import {useContext, useEffect, useState} from "react";
+import {Skeleton} from "@/components/ui/skeleton";
+import ApiRequest from "@/services/apiRequest";
+import type {IApiAllOffersRes} from "@/interfaces/api.interface";
+import {WalletTable} from "@/components/data-tables/wallet-table";
+import {UserDataContext} from "@/components/providers/userdata-provider";
+import {IUserWallet} from "@/interfaces/userdata.interface";
+
+
+export default function WalletPage() {
+	const [isLoading, setIsLoading] = useState<boolean>(true)
+	const [cryptosList, setCryptosList] = useState<ICryptoInWalletInfo[]>([])
+	const userContext = useContext(UserDataContext);
+	//FIX the loop
+
+	useEffect(() => {
+		console.log(userContext?.userData)
+		if (userContext?.userData) {
+			setIsLoading(false)
+		}
+	}, [userContext]);
+
+	if (isLoading || !userContext?.userData) {
+		return (<div className={"container flex flex-col justify-center items-center min-h-64 my-6 gap-4"}>
+			<h1 className={"text-2xl font-bold"}>Cryptos in your wallet</h1>
+			<Skeleton className={"container flex flex-col justify-center items-center min-h-64 my-6 gap-4"}/>
+		</div>)
+	}
+
+	return (<>
+		<section className={"container flex flex-col justify-center items-center min-h-64 my-6 gap-4"}>
+			<h1 className={"text-2xl font-bold"}>Cryptos in your wallet</h1>
+			<WalletTable walletArray={userContext.userData.wallet as unknown as IUserWallet}/>
+		</section>
+	</>)
+}
\ No newline at end of file