Skip to content

Commit 41b75ff

Browse files
harsh3devharsh3dev
committed
hero section
1 parent cda0c45 commit 41b75ff

14 files changed

Lines changed: 405 additions & 21 deletions

File tree

‎app/(dashboard)/(routes)/buy/components/PostCard.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -84,9 +84,9 @@ const callImage = () =>{
8484
</div>
8585
</CardContent>
8686
<div className=" flex justify-between items-center text-base font-medium w-full mt-4 ">
87-
<div className=" flex justify-center items-center gap-2 border border-orange-200/50 p-2 rounded-md text-2xl ">
87+
<div title={entry.ticketPrice} className=" flex justify-center max-w-[270px] items-center gap-2 border border-orange-200/50 p-2 rounded-md text-xl ">
8888
<SiEthereum className="text-red-400" />{" "}
89-
<span className="bg-gradient-to-r from-red-200 to-red-200 bg-clip-text text-transparent">
89+
<span className="bg-gradient-to-r w-full truncate from-red-200 to-red-200 bg-clip-text text-transparent">
9090
{" "}
9191
{entry.ticketPrice}{" "} AVA
9292
</span>

‎app/(dashboard)/(routes)/buy/page.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ const page = () => {
88
<main className='text-white font-extrabold w-full h-full flex flex-col items-center justify-center mt-20 p-5 relative ' >
99
<div class="absolute inset-0 -z-10 h-full w-full items-center px-5 py-24 [background:radial-gradient(125%_125%_at_50%_10%,#000_40%,#63e_100%)]"></div>
1010
{/* <CallModal/> */}
11-
<Filter/>
11+
{/* <Filter/> */}
1212
<div className=' w-full h-full flex flex-col mx-auto rounded-md p-5 '>
1313
<PostsTab/>
1414
</div>

‎app/(dashboard)/(routes)/resell/components/ResellForm.jsx‎

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
"use client";
2+
import { Button } from "@/components/ui/button";
3+
import React, { useState } from "react";
4+
import { Label } from "@/components/ui/label";
5+
import { Input } from "@/components/ui/input";
6+
import { useForm } from "react-hook-form";
7+
import { web3, contractInstance } from "@/lib/web3";
8+
9+
const ResellForm = () => {
10+
const {
11+
register,
12+
handleSubmit,
13+
formState: { errors },
14+
reset,
15+
} = useForm();
16+
17+
const [error, setError] = useState(null);
18+
const onSubmit = async (data) => {
19+
console.log(data);
20+
reset();
21+
const accounts = await web3.eth.getAccounts();
22+
if (accounts.length === 0) {
23+
await window.ethereum.request({ method: 'eth_requestAccounts' });
24+
25+
};
26+
27+
28+
const ownerAddress = await contractInstance.methods.getTicketOwner(data.tokenID).call();
29+
if(ownerAddress===accounts[0]){
30+
console.log(ownerAddress);
31+
await contractInstance.methods.TicketListing(Number(data.tokenID),Number(data.resellPrice)).send({ from: accounts[0] });
32+
} else{
33+
setError("The ticket does not belong to the owner's wallet");
34+
setTimeout(() => {
35+
console.log(error);
36+
}, 1000);
37+
}
38+
}
39+
return (
40+
<form
41+
onSubmit={handleSubmit(onSubmit)}
42+
className="relative w-full flex justify-around items-center gap-4"
43+
>
44+
<h1 className="absolute top-[-52px] left-[42%] text-xl z-10 ">
45+
Resell your ticket
46+
</h1>
47+
<div className="grid grid-cols-3 items-center gap-4">
48+
<div className="space-y-2">
49+
<Label htmlFor="tokenID">Token ID</Label>
50+
<Input
51+
id="tokenID"
52+
placeholder="Enter token ID"
53+
{...register("tokenID", { required: true })}
54+
/>
55+
</div>
56+
<div className="space-y-2">
57+
<Label htmlFor="resellPrice">Selling Price</Label>
58+
<Input
59+
id="resellPrice"
60+
type="resellPrice"
61+
placeholder="Enter the reselling price"
62+
{...register("resellPrice", { required: true })}
63+
/>
64+
</div>
65+
<Button className='w-full align-bottom ' type="submit">Resell Ticket</Button>
66+
</div>
67+
</form>
68+
);
69+
};
70+
71+
export default ResellForm;

‎app/(dashboard)/(routes)/resell/components/ResellPostCard.jsx‎

Lines changed: 187 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,187 @@
1+
"use client"
2+
import React, { useEffect, useState } from "react";
3+
import { Button } from "@/components/ui/button";
4+
import { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from "@/components/ui/card"
5+
6+
import { IoLocationSharp } from "react-icons/io5";
7+
import { FiExternalLink } from "react-icons/fi";
8+
import { SiEthereum } from "react-icons/si";
9+
10+
import Link from "next/link";
11+
import Image from "next/image";
12+
13+
const ResellPostCard = ({ entry, className }) => {
14+
15+
const [open, setOpen] = useState(false);
16+
const [toggle, setToggle] = useState(false)
17+
18+
const handleClose = () => {
19+
setOpen(false);
20+
};
21+
22+
const handleOpen = () => {
23+
setOpen(true);
24+
};
25+
26+
27+
const callImage = () =>{
28+
29+
}
30+
31+
32+
return (
33+
<Card className="w-full max-w-md min-h-[250px] px-5 py-4 flex flex-col justify-between items-start rounded-lg border border-slate-700 hover:border-green-300 dark:backdrop-blur-xl transition-all ease-linear bg-gradient-to-t from-green-800/30 to-transparent hover:from-green-800/50">
34+
<div className="w-full flex justify-between items-center p-4 dark:border-b ">
35+
<span className="text-2xl font-bold">{entry.eventName}</span>
36+
<Link href={entry.artistLink} target="_blank" className="text-muted-foreground text-xl flex justify-start items-center gap-1 group ">
37+
<UserIcon className="w-4 h-4 inline-block" />
38+
{entry.artist}
39+
<FiExternalLink className=" w-3 h-3 group-hover:inline-block hidden " />
40+
</Link>
41+
{/* <CardDescription className="text-sm">{entry.description}</CardDescription> */}
42+
</div>
43+
<CardContent className="p-6 space-y-4 flex justify-between items-center gap-4 w-full ">
44+
45+
{/* <div className="grid place-items-center mx-auto p-2 w-[150px] h-[150px] border rounded-lg object-contain ">
46+
<Image src={photo} alt="altimage" className="w-full h-full" />
47+
</div> */}
48+
49+
<div className="flex flex-col justify-between items-start gap-2">
50+
<div className="flex items-center justify-between">
51+
<div className="text-muted-foreground">
52+
<MapPinIcon className="w-4 h-4 inline-block mr-2" />
53+
{entry.location}
54+
</div>
55+
</div>
56+
<div className="flex flex-col items-start justify-between">
57+
<div className="text-muted-foreground">
58+
<TicketIcon className="w-4 h-4 inline-block mr-2" />
59+
{entry.remainingSeats} seats left!
60+
</div>
61+
62+
</div>
63+
<div className="flex items-center justify-between">
64+
<div className="text-muted-foreground">
65+
<CalendarIcon className="w-4 h-4 inline-block mr-2" />
66+
{entry.date} - {entry.time}
67+
</div>
68+
</div>
69+
</div>
70+
</CardContent>
71+
<div className=" flex justify-between items-center text-base font-medium w-full mt-4 ">
72+
<div className=" flex justify-center items-center gap-2 border border-orange-200/50 p-2 rounded-md text-xl ">
73+
<SiEthereum className="text-red-400" />{" "}
74+
<span className="bg-gradient-to-r from-red-200 to-red-200 bg-clip-text text-transparent">
75+
{" "}
76+
{entry.ticketPrice}{" "} AVA
77+
</span>
78+
</div>
79+
80+
<Button onClick={()=>(setToggle(true))} className="">
81+
<Link href={`/buy/${entry.id}`}>
82+
Buy Tickets
83+
</Link>
84+
</Button>
85+
{/* {toggle && (
86+
<SeatChart
87+
88+
setToggle={setToggle}
89+
/>
90+
)} */}
91+
92+
</div>
93+
</Card>
94+
);
95+
};
96+
97+
export default ResellPostCard;
98+
99+
100+
101+
function CalendarIcon(props) {
102+
return (
103+
<svg
104+
{...props}
105+
xmlns="http://www.w3.org/2000/svg"
106+
width="24"
107+
height="24"
108+
viewBox="0 0 24 24"
109+
fill="none"
110+
stroke="currentColor"
111+
strokeWidth="2"
112+
strokeLinecap="round"
113+
strokeLinejoin="round"
114+
>
115+
<path d="M8 2v4" />
116+
<path d="M16 2v4" />
117+
<rect width="18" height="18" x="3" y="4" rx="2" />
118+
<path d="M3 10h18" />
119+
</svg>
120+
)
121+
}
122+
123+
124+
function MapPinIcon(props) {
125+
return (
126+
<svg
127+
{...props}
128+
xmlns="http://www.w3.org/2000/svg"
129+
width="24"
130+
height="24"
131+
viewBox="0 0 24 24"
132+
fill="none"
133+
stroke="currentColor"
134+
strokeWidth="2"
135+
strokeLinecap="round"
136+
strokeLinejoin="round"
137+
>
138+
<path d="M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z" />
139+
<circle cx="12" cy="10" r="3" />
140+
</svg>
141+
)
142+
}
143+
144+
145+
function TicketIcon(props) {
146+
return (
147+
<svg
148+
{...props}
149+
xmlns="http://www.w3.org/2000/svg"
150+
width="24"
151+
height="24"
152+
viewBox="0 0 24 24"
153+
fill="none"
154+
stroke="currentColor"
155+
strokeWidth="2"
156+
strokeLinecap="round"
157+
strokeLinejoin="round"
158+
>
159+
<path d="M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z" />
160+
<path d="M13 5v2" />
161+
<path d="M13 17v2" />
162+
<path d="M13 11v2" />
163+
</svg>
164+
)
165+
}
166+
167+
168+
function UserIcon(props) {
169+
return (
170+
<svg
171+
{...props}
172+
xmlns="http://www.w3.org/2000/svg"
173+
width="24"
174+
height="24"
175+
viewBox="0 0 24 24"
176+
fill="none"
177+
stroke="currentColor"
178+
strokeWidth="2"
179+
strokeLinecap="round"
180+
strokeLinejoin="round"
181+
>
182+
<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" />
183+
<circle cx="12" cy="7" r="4" />
184+
</svg>
185+
)
186+
}
187+

‎app/(dashboard)/(routes)/resell/components/ResellPosts.jsx‎

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
"use client"
2+
import React, { useEffect, useState } from 'react';
3+
4+
import { contractInstance, web3 } from '@/lib/web3';
5+
import ResellPostCard from './ResellPostCard';
6+
7+
const ResellPosts = () => {
8+
const [occasion, setOccasion] = useState([]);
9+
10+
useEffect(() => {
11+
fetchOccasion();
12+
}, []);
13+
14+
const fetchOccasion = async () => {
15+
16+
const total = await contractInstance.methods.totalSupply().call();
17+
18+
for(let i = 1; i <= total; i++){
19+
const isListed = await contractInstance.methods.isTicketListed(i).call();
20+
if(isListed){
21+
const tickets = await contractInstance.methods.tickets(i).call();
22+
console.log(tickets);
23+
}
24+
}
25+
}
26+
27+
28+
const parseOccasionData = (occasionDetails) => {
29+
const occas = {
30+
id: occasionDetails[1].toString(),
31+
eventName: occasionDetails[2],
32+
ticketPrice: web3.utils.fromWei(occasionDetails[3], 'ether'), // Convert price from Wei to Ether
33+
totalSeats: occasionDetails[5].toString(),
34+
date: occasionDetails[6],
35+
time: occasionDetails[7],
36+
remainingSeats: occasionDetails[4].toString(),
37+
artist: "The Rockers", // This seems to be hardcoded, you can fetch it dynamically if needed
38+
artistLink: "https://instagram.com/therockers", // This seems to be hardcoded, you can fetch it dynamically if needed
39+
location: occasionDetails[8],
40+
owner: occasionDetails[0]
41+
};
42+
console.log(occas);
43+
return occas;
44+
};
45+
return (
46+
<div className='w-full min-h-[50vh] grid grid-cols-3 gap-2'>
47+
{occasion.length > 0 ? (
48+
occasion.map((entry, index) => (
49+
<ResellPostCard entry={entry} key={index} />
50+
))
51+
) : (
52+
<p>Loading occasion data...</p>
53+
)}
54+
</div>
55+
);
56+
}
57+
58+
export default ResellPosts;

‎app/(dashboard)/(routes)/resell/page.jsx‎

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,19 @@
11
import React from 'react'
2+
import ResellForm from './components/ResellForm'
3+
import PostsTab from '../buy/components/PostsTab'
4+
import ResellPosts from './components/ResellPosts'
25

36
const page = () => {
47
return (
5-
<div className='text-white font-extrabold w-full h-full flex flex-col items-center justify-center mt-20 ' >
6-
<div>
7-
8+
<div className='text-white font-extrabold w-full h-full flex flex-col items-center justify-center mt-20 gap-5 p-8 ' >
9+
<div className='w-full h-fit rounded-lg border-2 border-white border-dashed p-5 bg-gradient-to-r from-emerald-500/70 to-emerald-900/70 '>
10+
<div className='w-[60%] grid place-items-center mx-auto '>
11+
<ResellForm/>
12+
</div>
13+
</div>
14+
15+
<div className='w-full min-h-[100vh] rounded-lg border-2 p-5 '>
16+
<ResellPosts/>
817
</div>
918
</div>
1019
)

0 commit comments

Comments
 (0)