From edb511fd038da907a25c4e35332e9f5fd253a08b Mon Sep 17 00:00:00 2001
From: shajeed <shajeed@live.fr>
Date: Mon, 16 Oct 2023 08:52:31 -0400
Subject: [PATCH] Utilities

---
 client/src/App.js                             |  2 +-
 .../LaunchpadCollectionLiveUtilities.js       | 22 +++++-----
 .../LaunchpadCollectionLive.js                | 41 +++++++++++++++++--
 3 files changed, 49 insertions(+), 16 deletions(-)

diff --git a/client/src/App.js b/client/src/App.js
index a4564898..f1f34220 100644
--- a/client/src/App.js
+++ b/client/src/App.js
@@ -616,7 +616,7 @@ function App() {
                   />
                   <Route path="*" element={<ErrorPage />} />
                   <Route
-                    path="/collectionlive/:id/:collectionAddress"
+                    path="/collectionlive/:id/:collectionAddressurl"
                     element={
                       <LaunchpadCollectionLive isLogged={loggedInUser} />
                     }
diff --git a/client/src/Components/LaunchpadCollectionLiveUtilities/LaunchpadCollectionLiveUtilities.js b/client/src/Components/LaunchpadCollectionLiveUtilities/LaunchpadCollectionLiveUtilities.js
index 52f84aa8..52a661da 100644
--- a/client/src/Components/LaunchpadCollectionLiveUtilities/LaunchpadCollectionLiveUtilities.js
+++ b/client/src/Components/LaunchpadCollectionLiveUtilities/LaunchpadCollectionLiveUtilities.js
@@ -2,24 +2,24 @@ import React from "react";
 import UtilitiesComponent from "../UtilitiesComponent/UtilitiesComponent";
 import "./LaunchpadCollectionLiveUtilities.css";
 import { v4 as uuidv4 } from "uuid";
-function LaunchpadCollectionLiveUtilities({
-  utilitiesArray
-}) {
-
-
+function LaunchpadCollectionLiveUtilities({ utilitiesArray }) {
   return (
     <section className="launchpad-collection-live-utilities-container">
       <div className="launchpad-collection-live-utilities-title">Utilité</div>
-   {utilitiesArray.map((element) => (
+      {utilitiesArray && utilitiesArray.length > 0 ? (
+        utilitiesArray.map((utility) => (
           <UtilitiesComponent
             key={uuidv4()}
-            utilitiesTitle={element.title}
-            utilitiesStatus={element.status}
-            utilitiesDescription={element.description}
-            utilitiesDate={element.date}
+            utilitiesTitle={utility?.title}
+            utilitiesStatus={utility?.claimed_status}
+            utilitiesDescription={utility?.description}
+            utilitiesDate={utility?.date ? new Date(utility.date.seconds * 1000).toDateString() : 'N/A'}
             launchpadCollectionLiveUtilities={true}
           />
-        ))}
+        ))
+      ) : (
+        <p>Pas d'Utilité disponibles pour le moment.</p>
+      )}
     </section>
   );
 }
diff --git a/client/src/Pages/LaunchpadCollectionLive/LaunchpadCollectionLive.js b/client/src/Pages/LaunchpadCollectionLive/LaunchpadCollectionLive.js
index ed205b8e..6b604c34 100644
--- a/client/src/Pages/LaunchpadCollectionLive/LaunchpadCollectionLive.js
+++ b/client/src/Pages/LaunchpadCollectionLive/LaunchpadCollectionLive.js
@@ -11,8 +11,11 @@ import {
   limit,
   getDocs,
   getDoc,
+  doc,
 } from "firebase/firestore";
 import { db } from "../../Configs/firebase";
+import { useParams } from "react-router-dom";
+
 import LaunchpadCollectionLiveHeader from "../../Components/LaunchpadCollectionLiveHeader/LaunchpadCollectionLiveHeader";
 import LaunchpadCollectionLiveUtilities from "../../Components/LaunchpadCollectionLiveUtilities/LaunchpadCollectionLiveUtilities";
 import MoreAboutThisCollection from "../../Components/MoreAboutThisCollection/MoreAboutThisCollection";
@@ -48,6 +51,7 @@ function LaunchpadCollectionLive(isLogged) {
   const [nftLimitByWalletInfo, setNftLimitByWalletInfo] = useState();
   const [totalPriceInUSDC, setTotalPriceInUSDC] = useState();
   const [mintCounter, setMintCounter] = useState(1);
+  const [utilities, setUtilities] = useState([]);
 
   const [athleteFanNumber, setAthleteFanNumber] = useState();
   const { alchemy } = useToggleNetwork();
@@ -208,6 +212,37 @@ function LaunchpadCollectionLive(isLogged) {
       getPrice();
     }
   }, [alchemy]);
+
+  // ----------------------- Shajeed -------------------------
+
+  const { collectionAddressurl } = useParams();
+
+  useEffect(() => {
+    const q = query(
+      collection(db, "nft_collections"),
+      where("collection_address", "==", collectionAddress)
+    );
+
+    getDocs(q).then((querySnapshot) => {
+      const docData = querySnapshot.docs[0];
+      if (docData) {
+        const docId = docData.id;
+        const unsub = onSnapshot(
+          collection(db, "nft_collections", docId, "utilities"),
+          (snapshot) => {
+            const utilitiesData = snapshot.docs.map((doc) => doc.data());
+            setUtilities(utilitiesData);
+          }
+        );
+
+        return () => {
+          unsub();
+        };
+      }
+    });
+  }, [collectionAddress]);
+
+  // ---------------------------------------------------------
   const dataBackend = {
     header: [
       {
@@ -229,7 +264,7 @@ function LaunchpadCollectionLive(isLogged) {
         date: "July 9th 2023",
       },
       {
-        title: "3 online VIP live ",
+        title: "3 online VIP live",
         status: "Disponible",
         description:
           "Have access with all other members to 3 live important events during the entire competition, at three key times.",
@@ -543,9 +578,7 @@ function LaunchpadCollectionLive(isLogged) {
         />
         <div className="launchpad-collection-live-page-left-container">
           {crossmintPayLoadLocalStorage ? "sqhdddddddddddsqdhhhhhhhhh" : ""}
-          <LaunchpadCollectionLiveUtilities
-            utilitiesArray={dataBackend.utilities}
-          />
+          <LaunchpadCollectionLiveUtilities utilitiesArray={utilities} />
           <div className="launchpad-collection-live-page-more-about-collection-container">
             <LaunchpadCollectionLiveMoreAboutCollection
               knowMoreAboutCollection={