From cc65a7e82a44314732c14075d848363f78dc9eeb Mon Sep 17 00:00:00 2001
From: ashprit <ashpritmehra@gmail.com>
Date: Sun, 27 Oct 2024 04:22:42 +0000
Subject: [PATCH] profile page extensions

---
 app/contact/page.tsx           | 19 ----------
 app/page.tsx                   |  4 +++
 app/profile/page.tsx           | 63 ++++++++++++++++++++++++++++++++
 components/PreviousTickets.tsx |  3 +-
 components/ProfilePage.tsx     | 65 +---------------------------------
 components/custom/Profile.tsx  | 42 ++++++----------------
 components/custom/header.tsx   |  4 +--
 env                            |  2 ++
 8 files changed, 85 insertions(+), 117 deletions(-)
 delete mode 100644 app/contact/page.tsx
 create mode 100644 app/profile/page.tsx
 create mode 100644 env

diff --git a/app/contact/page.tsx b/app/contact/page.tsx
deleted file mode 100644
index b998cdb..0000000
--- a/app/contact/page.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-'use client';
-import React from 'react';
-import Header from '../../components/custom/header';
-import Footer from '../../components/custom/footer';
-
-const ContactPage: React.FC = () => {
-  return (
-    <div className="relative min-h-screen overflow-hidden bg-black">
-      <Header />
-      <div className="relative z-20 container mx-auto p-4 pt-16">
-        {/* implement contact page here */}
-        <p className="text-white">Page to be implemented</p>
-      </div>
-      <Footer />
-    </div>
-  );
-};
-
-export default ContactPage;
diff --git a/app/page.tsx b/app/page.tsx
index 2e06782..6564df6 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -10,6 +10,10 @@ import { Button } from '@/components/ui/button';
 import React from 'react';
 import { FlipWords } from '@/components/ui/flip-words';
 
+// profile
+// profile props
+// profile hanle
+
 export default function Home() {
   const router = useRouter();
   const [isClient, setIsClient] = useState(false);
diff --git a/app/profile/page.tsx b/app/profile/page.tsx
new file mode 100644
index 0000000..7289dce
--- /dev/null
+++ b/app/profile/page.tsx
@@ -0,0 +1,63 @@
+'use client';
+import React, { useEffect, useState } from 'react';
+import Header from '../../components/custom/header';
+import Footer from '../../components/custom/footer';
+import Profile from '@/components/custom/Profile';
+import PreviousTickets from '@/components/PreviousTickets';
+
+const ProfilePage: React.FC = () => {
+  const [isClient, setIsClient] = useState(false);
+  const [isAuth, setAuth] = useState(false);
+
+  useEffect(() => {
+    // This ensures the component renders only on the client side
+    setIsClient(true);
+  }, []);
+
+  useEffect(() => {});
+
+  return (
+    <>
+      <div className="relative min-h-screen overflow-hidden bg-black">
+        <Header />
+        <div className="relative z-20 container mx-auto p-4 pt-16">
+          <div className="relative min-h-screen overflow-hidden">
+            {/* Video Background */}
+            {isClient && (
+              <video
+                autoPlay
+                loop
+                muted
+                className="absolute inset-0 w-full h-full object-cover z-0"
+                src="/BGVid2.mp4" // Ensure the video file is placed in the public folder
+              >
+                Your browser does not support the video tag.
+              </video>
+            )}
+
+            {/* Dark Overlay for Enhanced Readability */}
+            <div className="absolute inset-0 bg-black opacity-50 z-10"></div>
+
+            <div className="relative flex flex-col space-y-10 mt-20 z-20 ml-10">
+              <Profile profileKey="38902kj2-8hf082gb0f20g02h082" />
+
+              {/* Render PreviousTickets component with appropriate props */}
+              <PreviousTickets
+                name="Sample Event"
+                status={true}
+                description="Description of the event"
+                capacity={100}
+                ticketPrice={50}
+                eventStartDate={new Date('2024-11-01T10:00:00')}
+                eventHost="Host Name"
+              />
+            </div>
+          </div>
+        </div>
+        <Footer />
+      </div>
+    </>
+  );
+};
+
+export default ProfilePage;
diff --git a/components/PreviousTickets.tsx b/components/PreviousTickets.tsx
index 8f17eb8..e799007 100644
--- a/components/PreviousTickets.tsx
+++ b/components/PreviousTickets.tsx
@@ -1,7 +1,8 @@
 import React from 'react';
 import { PreviousTicketComponent } from '@/components/custom/previousTicket';
+import { PreviousTicket } from '@/components/custom/previousTicket';
 
-const PreviousTickets = () => {
+const PreviousTickets = ({}: PreviousTicket) => {
   return (
     <div className="flex flex-col space-y-4">
       <PreviousTicketComponent
diff --git a/components/ProfilePage.tsx b/components/ProfilePage.tsx
index 6bd0bb8..8599cd2 100644
--- a/components/ProfilePage.tsx
+++ b/components/ProfilePage.tsx
@@ -51,70 +51,7 @@ const ProfilePage = () => {
         <div className="absolute inset-0 bg-black opacity-50 z-10"></div>
 
         {/* Page Content Over the Video */}
-        <div className="relative z-20 min-h-screen bg-gradient-to-b from-transparent to-gray-900 pt-20">
-          <div className="container mx-auto p-4">
-            <div className="container mx-auto justify-center items-center p-4">
-              <div className="text-6xl font-bold text-white text-center text-shadow-lg">
-                Book your next
-                <FlipWords
-                  words={words}
-                  className="text-pink-500 text-opacity-75 pl-3.5"
-                />
-                on the Flare blockchain.
-              </div>
-            </div>
-
-            <div className="flex items-center justify-center mt-6 flex-col gap-4">
-              <input
-                type="text"
-                placeholder="Search for your next experience..."
-                className="flex w-full rounded-md border border-input bg-white bg-opacity-50 placeholder:text-black px-4 py-6 text-lg shadow-sm"
-                ref={inputRef}
-              />
-              <Button
-                className="bg-pink-600 bg-opacity-50 text-white px-4 py-6 text-lg w-full hover:bg-pink-500"
-                onClick={searchForEvents}
-              >
-                Search for events
-              </Button>
-            </div>
-            <main>
-              <section className="mb-8 mt-4 mx-auto grid grid-cols-4 gap-4">
-                <FeaturedEvent
-                  name="FAB XO Halloween"
-                  description="Halloween is upon us and is one of the biggest nights of the FAB XO calendar.  Fancy dress is encouraged! So have your fancy dress ready and we look forward to seeing who have the best fancy dress on the night!  As a special treat we will be serving our very own witches brew!!!"
-                  location="Birmingham, UK"
-                  eventStartDate={1729980000}
-                  eventHost="0x225C73C8c536C4F5335a2C1abECa95b0f221eeF6"
-                  imageURL={
-                    'https://www.guildofstudents.com/asset/Event/7572/Halloween-Fab-XO-Web-Event.jpg'
-                  }
-                />
-                <FeaturedEvent
-                  name="Halls Halloween Spooktacular"
-                  description="Put on your spookiest costume and head on down to Pritchatts Park and join your Event Activators for our ResLife SPOOKTACULAR on Wednesday 30th October 5-8pm."
-                  location="Birmingham, UK"
-                  eventStartDate={1730307600}
-                  eventHost="0x225C73C8c536C4F5335a2C1abECa95b0f221eeF6"
-                  imageURL={
-                    'https://www.guildofstudents.com/asset/Event/41187/Spooktacular-Web-Event-2024.png'
-                  }
-                />
-                <FeaturedEvent
-                  name="Housing Fair"
-                  description="We’re hosting a Housing Fair, so make sure you save the date! Whether you’re living in student accommodation or the local community, this will be a great place to start as you begin thinking about where you’ll be living next year."
-                  location="Birmingham, UK"
-                  eventStartDate={1730804400}
-                  eventHost="0x225C73C8c536C4F5335a2C1abECa95b0f221eeF6"
-                  imageURL={
-                    'https://www.guildofstudents.com/asset/Event/41111/Housing-Fair-Web-Event.png'
-                  }
-                />
-              </section>
-            </main>
-            <Footer />
-          </div>
-        </div>
+        <div className="relative z-20 min-h-screen bg-gradient-to-b from-transparent to-gray-900 pt-20"></div>
       </div>
     </>
   );
diff --git a/components/custom/Profile.tsx b/components/custom/Profile.tsx
index a554df0..9c410cd 100644
--- a/components/custom/Profile.tsx
+++ b/components/custom/Profile.tsx
@@ -11,6 +11,11 @@ import {
 import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
 import { motion } from 'framer-motion';
+import { PreviousTicketComponent } from './previousTicket';
+
+interface profileProps {
+  profileKey: string;
+}
 
 // Dark theme and animation setup
 const cardVariants = {
@@ -18,7 +23,7 @@ const cardVariants = {
   visible: { opacity: 1, y: 0 },
 };
 
-const Profile = () => {
+const Profile = ({ profileKey }: profileProps) => {
   return (
     <motion.div
       initial="hidden"
@@ -32,42 +37,21 @@ const Profile = () => {
             initial={{ opacity: 0, y: -10 }}
             animate={{ opacity: 1, y: 0 }}
             transition={{ delay: 0.1, duration: 0.5 }}
-          >
-            <CardTitle className="text-lg font-semibold">Profile</CardTitle>
-          </motion.div>
+          ></motion.div>
         </CardHeader>
         <CardContent>
           <form>
             <div className="grid w-full items-center gap-4">
-              <motion.div
-                className="flex flex-col space-y-1.5"
-                initial={{ opacity: 0, x: -10 }}
-                animate={{ opacity: 1, x: 0 }}
-                transition={{ delay: 0.2, duration: 0.4 }}
-              >
-                <Label htmlFor="name" className="text-gray-300">
-                  Name
-                </Label>
-                <Input
-                  id="name"
-                  placeholder="Name"
-                  className="bg-[#2b3a4a] text-white placeholder-gray-400"
-                />
-              </motion.div>
               <motion.div
                 className="flex flex-col space-y-1.5"
                 initial={{ opacity: 0, x: -10 }}
                 animate={{ opacity: 1, x: 0 }}
                 transition={{ delay: 0.3, duration: 0.4 }}
               >
-                <Label htmlFor="framework" className="text-gray-300">
-                  MetaMask Public Key
+                <Label htmlFor="framework" className="text-gray-300 text-lg">
+                  MetaMask Public Key:
                 </Label>
-                <Input
-                  id="name"
-                  placeholder="Key"
-                  className="bg-[#2b3a4a] text-white placeholder-gray-400"
-                />
+                <Label id="name">{'#9383r]3r32r2rni20r9'}</Label>
               </motion.div>
             </div>
           </form>
@@ -77,11 +61,7 @@ const Profile = () => {
             initial={{ opacity: 0, y: 10 }}
             animate={{ opacity: 1, y: 0 }}
             transition={{ delay: 0.4, duration: 0.4 }}
-          >
-            <Button className="bg-[#365b85] text-white hover:bg-[#2b4a70]">
-              Save
-            </Button>
-          </motion.div>
+          ></motion.div>
         </CardFooter>
       </Card>
     </motion.div>
diff --git a/components/custom/header.tsx b/components/custom/header.tsx
index c25cdfd..9d40803 100644
--- a/components/custom/header.tsx
+++ b/components/custom/header.tsx
@@ -73,12 +73,12 @@ const Header = () => {
               </Link>
             </li>
             <li>
-              <Link href="/contact" legacyBehavior>
+              <Link href="/profile" legacyBehavior>
                 <a
                   className="text-white hover:text-light-purple hover:text-opacity-75 transition-colors duration-300"
                   style={{ textShadow: '1px 1px 2px rgba(0, 0, 0, 0.5)' }}
                 >
-                  Contact
+                  Profile
                 </a>
               </Link>
             </li>
diff --git a/env b/env
new file mode 100644
index 0000000..6beaef3
--- /dev/null
+++ b/env
@@ -0,0 +1,2 @@
+NEXT_PUBLIC_RPC_URL=https://coston2.enosys.global/ext/C/rpc
+NEXT_PUBLIC_CONTRACT_ADDRESS=0xe84032D41216B21153f4Ab0d98EA396f777fc957