Merge branch 'main' into connector-component

mubarak23 · Feb 27, 2025 · a4936bb · a4936bb
2 parents c6fe1f3 + 4153b25
commit a4936bb
Show file tree

Hide file tree

Showing 5 changed files with 196 additions and 98 deletions.
diff --git a/src/app/events/[eventId]/page.jsx b/src/app/events/[eventId]/page.jsx
@@ -18,6 +18,30 @@ function page({ params }) {
   //   high: BigInt(0),
   // };
 
+  useEffect(() => {
+    async function fetchEventDetails() {
+      try {
+        let request = await fetch(
+          "https://chainevents-backend.onrender.com/event/id/1"
+        );
+        if (!request.ok) {
+          throw new Error("Failed to fetch data");
+        }
+        let response = await request.json();
+        if (data?.length === 0) {
+          console.log("No data");
+          setEventData([]);
+          return;
+        }
+        console.log(response.data);
+        setEventData(response.data);
+      } catch (error) {
+        console.error(error);
+      }
+    }
+    fetchEventDetails();
+  }, []);
+
   const { data, isLoading, error, isFetching } = useContractFetch(
     contractAbi,
     "event_details",
@@ -44,7 +68,7 @@ function page({ params }) {
     if (data) {
       const processed = processEventData(data);
       console.log("Processed event data:", processed);
-      setEventData(processed);
+      //setEventData(processed);
     }
   }, [data]);
 
@@ -72,34 +96,41 @@ function page({ params }) {
       <main className="pt-[74px] pb-[197px]">
         <div className="w-[740px] mx-auto bg-[#1E1D1D] rounded border-[.3px] border-[#FFFFFF] p-4 grid grid-cols-[250px_1fr] gap-x-6">
           <div>
-            <img src="/assets/eventImage.png" className="w-full mb-4" alt="" />
+            <img
+              src={`${eventData?.["event_image_url"] ?? "/assets/eventImage.png"}`}
+              className="w-full mb-4"
+              alt=""
+            />
             <h3 className="pb-2 border-b-[.4px] border-b-[#C4C4CC44] mb-2">
               Hosted By
             </h3>
             <div className="flex flex-col gap-y-2 text-xs leading-4 font-medium py-2 mb-6">
               <div className="flex gap-x-2 items-center">
                 <img src="/assets/host-avatar.svg" className="w-5 h-5" alt="" />
-                <h3>June Kankanda</h3>
+                <h3>{eventData?.["event_owner"]}</h3>
               </div>
               <div className="flex gap-x-2 items-center">
                 <img src="/assets/host-avatar.svg" className="w-5 h-5" alt="" />
-                <h3>Daniel John</h3>
+                <h3>{eventData?.["event_email"]}</h3>
               </div>
             </div>
 
             <h3 className="text-[#D9D9D9] text-xs leading-4">Contact Host</h3>
+            <h3 className="text-[#D9D9D9] text-xs leading-4">
+              {eventData?.["event_email"]}
+            </h3>
             <h3 className="text-[#D9D9D9] mt-3 text-xs leading-4">
               Report Event
             </h3>
           </div>
           <div>
             <h2 className="text-xl leading-6 font-semibold mb-4">
-              Workshop: Leveraging The Graph to build Your Dapp
+              {eventData?.name}
             </h2>
             <div className="flex items-center">
               <img src="/" alt="" />
               <div>
-                <h3 className="font-medium text-sm">Colab Innovation Campus</h3>
+                <h3 className="font-medium text-sm">{eventData?.location}</h3>
                 <h4 className="text-[#D9D9D9] text-xs">
                   No, 1 Technology City Boulevard/Crocodile road
                 </h4>
@@ -110,7 +141,10 @@ function page({ params }) {
               <div>
                 <h3 className="font-medium text-sm">Friday, Sep 6</h3>
                 <h4 className="text-[#D9D9D9] text-xs">
-                  10:00 AM - 12:00 PM GMT +1
+                  {eventData?.["event_start_date"] ?? "10:00 AM"} -{" "}
+                  {eventData?.["event_end_date"] ??
+                    `12:00 PM GMT
+                  +1`}
                 </h4>
               </div>
             </div>
@@ -131,28 +165,31 @@ function page({ params }) {
                 Welcome to join the Event, Please register below
               </p>
 
-              <button className="py-2 text-sm font-semibold rounded-full text-[#3A3A3A] bg-[#D9D9D9] w-full">
-                Request to Join
-              </button>
+              {eventData?.["open_for_registration"] && (
+                <button className="py-2 text-sm font-semibold rounded-full text-[#3A3A3A] bg-[#D9D9D9] w-full">
+                  Request to Join
+                </button>
+              )}
             </div>
             <h2 className="pb-2 text-xs border-b-[#C4C4CC44] border-b-[.4px] font-semibold text-white mb-4 mt-4">
               About Event
             </h2>
             <p className="text-xs leading-5">
-              Get hyped for the ultimate mixer at Devcon 🎉, brought to you by
+              {eventData?.description ??
+                ` Get hyped for the ultimate mixer at Devcon 🎉, brought to you by
               StarkWare & Pantera Capital & Braavos🚀 Vibe out with fellow
               crypto people 🪙 at a party where the drinks flow 🍹, the food is
               on point 🍣, and connections spark 🔥 We&apos;re turning the Stark
               Space in Bangkok into the place to be 🌆 on November 13th. Come at
               8 p.m., mingle with developers 👨‍💻👩‍💻 and other blockchain pioneers
               🛠️, and soak in the energy ⚡ Spots are limited, so it&apos;s
               first come, first served—make sure to get there early to secure
-              your place! ✨✨✨
+              your place! ✨✨✨`}
             </p>
             <h2 className="pb-2 text-xs border-b-[#C4C4CC44] border-b-[.4px] font-semibold text-white mb-4 mt-4">
               Location
             </h2>
-            <h3 className="text-sm font-semibold">Colab Innovation Campus</h3>
+            <h3 className="text-sm font-semibold">{eventData?.location}</h3>
             <h4 className="text-xs text-[#D9D9D9]">
               No, 1 Technology City Boulevard/Crocodile road
             </h4>

diff --git a/src/app/layout.jsx b/src/app/layout.jsx
@@ -3,6 +3,8 @@ import "./globals.css";
 import { Providers } from "../components/Providers";
 import { Toaster } from 'react-hot-toast';
 import { TanstackQueryProvider } from "@/components/provider/TanstackQueryProvider";
+import Navbar from "@/components/Navbar";
+import Footer from "@/components/Footer";
 
 const geistSans = Geist({
   variable: "--font-geist-sans",
@@ -22,10 +24,14 @@ export const metadata = {
 export default function RootLayout({ children }) {
   return (
     <html lang="en">
-      <body>
+      <body className=" bg-primaryBackground bg-[#1E1D1D]">
 
         <TanstackQueryProvider>
-          <Providers>{children}</Providers>
+          <Providers>
+            <Navbar />
+            {children}
+            <Footer />
+            </Providers>
           <Toaster position="bottom-left" />
         </TanstackQueryProvider>
       </body>

diff --git a/src/app/page.jsx b/src/app/page.jsx
@@ -2,11 +2,9 @@
 
 import { useState } from "react";
 import GenericModal from "../components/GenericModal";
-import Navbar from "../components/Navbar";
 import { createPortal } from "react-dom";
 import Link from "next/link";
 import { useAccount } from "@starknet-react/core";
-import Footer from "../components/Footer";
 import { useRouter } from "next/navigation";
 import Image from "next/image";
 import EventCard from "@/components/EventCard";
@@ -15,8 +13,7 @@ function HomePage() {
   const { address } = useAccount();
 
   return (
-    <div className="text-white overflow-x-hidden flex flex-col items-center text-center bg-primaryBackground bg-[#1E1D1D]">
-      <Navbar />
+    <div className="text-white overflow-x-hidden flex flex-col items-center text-center">
       <main className="pt-[74px] pb-[197px]">
         {!address ? (
           <div className="mt-48 lg:mt-56 px-5 mx-auto max-w-screen-lg text-center">
@@ -86,7 +83,6 @@ function HomePage() {
         )}
       </main>
 
-      <Footer />
     </div>
   );
 }

diff --git a/src/components/EventCard.jsx b/src/components/EventCard.jsx
@@ -1,5 +1,4 @@
 "use client"
-
 import Image from "next/image";
 import { useRouter } from "next/navigation";