✨ Statistics page fetch data

app/statistics/hooks/useData.js

@@ -1,10 +1,36 @@
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 
 export const useData = () => {
-	const [settingsOpened, setSettingsOpened] = useState(false);
+	const [userData, setUserData] = useState(null);
+
+	useEffect(() => {
+		(async () => {
+			const token = localStorage.getItem('token');
+
+			const request = await fetch(
+				'https://lovemap-backend.vercel.app/user',
+				{
+					method: 'GET',
+					headers: {
+						Authorization: token,
+					},
+				}
+			);
+
+			const response = await request.json();
+
+			const formattedResponse = {
+				...response.user,
+				createdat: new Date(response.user.createdat).toLocaleDateString(
+					'fr-FR'
+				),
+			};
+
+			setUserData(formattedResponse);
+		})();
+	}, []);
 
 	return {
-		settingsOpened,
-		setSettingsOpened,
+		userData,
 	};
 };

app/statistics/page.jsx

@@ -9,18 +9,28 @@ import Link from 'next/link';
 import SlotCounter from 'react-slot-counter';
 // ---------------------------------------------------------------------------------------------------------------------
 
+// -------------------------------------------------- Hooks & Utils ----------------------------------------------------
+import { useData } from './hooks/useData';
+// ---------------------------------------------------------------------------------------------------------------------
+
 // ------------------------------------------------- Assets & Styles ---------------------------------------------------
 import SettingsIcon from '@/assets/SettingsIcon';
 import './styles.scss';
 // ---------------------------------------------------------------------------------------------------------------------
 
 const Statistics = () => {
+	const { userData } = useData();
+
+	if (!userData) {
+		return;
+	}
+
 	return (
 		<div className='accountContainer'>
 			<div className='header'>
 				<div className='infosContainer'>
-					<p className='username'>Un Épicier</p>
-					<p className='sinceDate'>Créé le: 02/09/2024</p>
+					<p className='username'>{userData.username}</p>
+					<p className='sinceDate'>Créé le: {userData.createdat}</p>
 				</div>
 
 				<Link