Shay/ticketchain
1
0
Fork 0
mirror of https://github.com/0xShay/ticketchain.git synced 2026-01-11 13:13:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refactor file structure

Browse Source
This commit is contained in:
Shay Patel
2024-10-26 15:25:36 +01:00
parent d77c490e01
commit ac7874318c
6 changed files with 139 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
app/Home.tsx
View File

@@ -1,67 +0,0 @@
'use client';
import { useEffect, useState } from 'react';
import Header from '../components/custom/header';
import Footer from '../components/custom/footer';
export default function Home() {
const [isClient, setIsClient] = useState(false);
useEffect(() => {
setIsClient(true);
}, []);
return (
<>
<Header />
<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"
>
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>
{/* Page Content Over the Video */}
<div className="relative z-20 min-h-screen bg-gradient-to-b from-transparent to-gray-900 pt-16">
<div className="container mx-auto p-4">
<input
type="text"
placeholder="Search events..."
className="search-bar mt-4 p-2 border border-gray-300 rounded w-full max-w-md mx-auto"
/>
<main>
<section className="mb-8">
<h2 className="text-2xl font-semibold text-white mb-4">
Featured Events
</h2>
<p className="text-gray-300">
No events available at the moment.
</p>
</section>
<section>
<h2 className="text-2xl font-semibold text-white mb-4">
Upcoming Events
</h2>
<ul className="list-disc list-inside text-gray-300">
<li>Event 1 - Date</li>
<li>Event 2 - Date</li>
<li>Event 3 - Date</li>
</ul>
</section>
</main>
<Footer />
</div>
</div>
</div>
</>
);
}

9
app/TicketListings/page.tsx
View File

@@ -1,9 +0,0 @@
import TicketListings from './TicketListings';
export default function Page() {
return (
<>
<TicketListings />
</>
);
}

75
app/contact/page.tsx Normal file
View File

@@ -0,0 +1,75 @@
'use client';
import React, { useEffect, useState, useRef } from 'react';
import Header from '../../components/custom/header';
import Footer from '../../components/custom/footer';
// Define the Event interface including new fields
interface Event {
EventID: number;
name: string;
date: string; // Should ideally be a Date object for better handling
location: string;
ticketPrice: number; // Changed to number for sorting
description: string;
capacity: number;
ticketsSold: number;
imageUrl: string;
host: string; // New field for host
}
// Dummy function to fetch events
const fetchEvents = (): Event[] => {
return [
{
EventID: 1,
name: 'Rock Concert',
date: '2023-12-01',
location: 'New York City',
ticketPrice: 99,
description: 'An exhilarating rock concert featuring famous bands.',
capacity: 5000,
ticketsSold: 4500,
imageUrl: 'https://via.placeholder.com/150',
host: 'Music Mania',
},
{
EventID: 2,
name: 'Art Expo',
date: '2023-11-15',
location: 'San Francisco',
ticketPrice: 55,
description: 'A showcase of modern art from around the world.',
capacity: 300,
ticketsSold: 260,
imageUrl: 'https://via.placeholder.com/150',
host: 'Art Lovers',
},
{
EventID: 3,
name: 'Tech Summit 2023',
date: '2023-12-10',
location: 'Chicago',
ticketPrice: 250,
description: 'The leading tech summit with top industry speakers.',
capacity: 2000,
ticketsSold: 1800,
imageUrl: 'https://via.placeholder.com/150',
host: 'Tech Alliance',
},
];
};
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;

4
app/TicketListings/TicketListings.tsx → app/events/page.tsx
View File

@@ -59,7 +59,7 @@ const fetchEvents = (): Event[] => {
]; ];
}; };
const TicketListing: React.FC = () => { const EventsPage: React.FC = () => {
const [events, setEvents] = useState<Event[]>([]); const [events, setEvents] = useState<Event[]>([]);
const [filteredEvents, setFilteredEvents] = useState<Event[]>([]); const [filteredEvents, setFilteredEvents] = useState<Event[]>([]);
const [searchQuery, setSearchQuery] = useState<string>(''); const [searchQuery, setSearchQuery] = useState<string>('');
@@ -340,4 +340,4 @@ const TicketListing: React.FC = () => {
); );
}; };
export default TicketListing; export default EventsPage;

64
app/page.tsx
View File

@@ -1,9 +1,67 @@
import Home from './Home'; 'use client';
import { useEffect, useState } from 'react';
import Header from '../components/custom/header';
import Footer from '../components/custom/footer';
export default function Home() {
const [isClient, setIsClient] = useState(false);
useEffect(() => {
setIsClient(true);
}, []);
export default function Page() {
return ( return (
<> <>
<Home /> <Header />
<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"
>
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>
{/* Page Content Over the Video */}
<div className="relative z-20 min-h-screen bg-gradient-to-b from-transparent to-gray-900 pt-16">
<div className="container mx-auto p-4">
<input
type="text"
placeholder="Search events..."
className="search-bar mt-4 p-2 border border-gray-300 rounded w-full max-w-md mx-auto"
/>
<main>
<section className="mb-8">
<h2 className="text-2xl font-semibold text-white mb-4">
Featured Events
</h2>
<p className="text-gray-300">
No events available at the moment.
</p>
</section>
<section>
<h2 className="text-2xl font-semibold text-white mb-4">
Upcoming Events
</h2>
<ul className="list-disc list-inside text-gray-300">
<li>Event 1 - Date</li>
<li>Event 2 - Date</li>
<li>Event 3 - Date</li>
</ul>
</section>
</main>
<Footer />
</div>
</div>
</div>
</> </>
); );
} }

2
components/custom/header.tsx
View File

@@ -46,7 +46,7 @@ const Header = () => {
</Link> </Link>
</li> </li>
<li> <li>
<Link href="/TicketListings" legacyBehavior> <Link href="/events" legacyBehavior>
<a className="text-white hover:text-blue-500 transition-colors duration-300"> <a className="text-white hover:text-blue-500 transition-colors duration-300">
Events Events
</a> </a>