From de8be84c835d2d6659ad16c1bdbcc460797670e4 Mon Sep 17 00:00:00 2001
From: Monu <ms88006218@gmail.com>
Date: Sat, 23 Mar 2024 23:54:16 +0530
Subject: [PATCH 1/4] feat: Handle past events

---
 components/Venue/venue.js | 23 ++++++++++++++++++-----
 pages/venue/[id].js       | 16 +++++++++++-----
 2 files changed, 29 insertions(+), 10 deletions(-)

diff --git a/components/Venue/venue.js b/components/Venue/venue.js
index 5fdd5b8e..5d344be6 100644
--- a/components/Venue/venue.js
+++ b/components/Venue/venue.js
@@ -1,26 +1,38 @@
 /* eslint-disable react/no-unescaped-entities */
 import React from 'react';
 
+ function isEventEnded(date){
+	const eventDate = date.split(" ");
+	const month = eventDate[0];
+	const year = eventDate[eventDate.length-1];
+	const startDay = eventDate[1].split("-")[0];
+	return new Date(`${startDay} ${month} ${year}`) < Date.now()
+}
+
+
 function Venue({ className, city }) {
+
+	const eventEnded = isEventEnded(city.date);
+	const textColor = eventEnded ? "text-gray-300": "text-white";
+
 	return (
 		<div>
 			<div style={{'--image-url': `url(${city.img})`}} 
 			className='relative w-[300px] h-[400px] sm:w-[250px] sm:h-[350px] card-bg bg-[image:var(--image-url)] flex items-center justify-center p-4 cursor-pointer'>
 				<div className='flex justify-between flex-col w-full h-full'>
 					<div className='flex justify-between items-center'>
-						<div><div className={`border text-white text-md rounded-lg p-1 text-center mt-2 ${city.cfp ? 'block': 'hidden' }`}>cfp is open</div></div>
+						<div><div className={`border ${textColor} text-md rounded-lg p-1 text-center mt-2 ${city.cfp ? 'block': 'hidden' }`}>cfp is open</div></div>
 						<a href={city.map} target='_blank' className='w-8 h-8 bg-white rounded-xl flex items-center justify-center' rel="noreferrer">
 						<img src='/img/mapIcon.svg' className='w-6' />
 						</a>
 					</div>
 					<div></div>
-					<div className='text-white'>
+					<div className={textColor}>
 						<div>
 							<span className='text-lg font-bold'>{city.country}, {city.name}</span>
 						</div>
-						<div className='flex items-center justify-between w-full'>
-						<div className='border border-gray-400 rounded-lg p-1 text-center mt-2'>{city.date}</div>
-						</div>
+						<div className='inline-block border border-gray-400 rounded-lg py-1 px-2 text-center mt-2'>{city.date}</div>
+						<span className='text-xs text-white'> - {eventEnded ? "ENDED" : "UPCOMING"}</span>
 					</div>
 					</div>
 				</div>
@@ -29,3 +41,4 @@ function Venue({ className, city }) {
 }
 
 export default Venue;
+export {isEventEnded}
diff --git a/pages/venue/[id].js b/pages/venue/[id].js
index 92be3609..d9eecf21 100644
--- a/pages/venue/[id].js
+++ b/pages/venue/[id].js
@@ -6,6 +6,7 @@ import Heading from '../../components/Typography/heading';
 import Paragraph from '../../components/Typography/paragraph';
 import speakers from '../../config/speakers.json';
 import Sponsors from '../../components/Sponsors/sponsors';
+import { isEventEnded } from '../../components/Venue/venue';
 
 export async function getStaticProps({ params }) {
 	let res = {};
@@ -32,29 +33,34 @@ export async function getStaticPaths() {
 }
 
 function Venue({ city }) {
+	
+	const eventEnded = isEventEnded(city.date);
+	const textColor = eventEnded ? "text-gray-400": "text-white";
+
 	return (
 		<div>
 			<div className='w-full h-[500px] sm:h-[auto] bg-madrid bg-cover bg-center'>
 				<div className='w-full h-full kinda-dark items-center flex flex-col justify-between'>
 					<div className='mt-[82px] container text-center flex flex-col items-center w-[1100px] lg:w-full sm:text-center'>
-						<Heading className='text-white'>
+						<Heading className={textColor}>
 							{city.name}, {city.country}
 						</Heading>
-						<Paragraph className='mt-[24px]' textColor='text-white'>{city.description}</Paragraph>
+						{eventEnded && <p className='text-xs text-white border border-white py-1 px-2'>ENDED</p>}
+						<Paragraph className='mt-[24px]' textColor={textColor}>{city.description}</Paragraph>
 
-						<Heading typeStyle='lg' className='text-white mt-[24px] hover:underline'>
+						<Heading typeStyle='lg' className={`${textColor} mt-[24px] hover:underline`}>
 							<a href={city.map} target='_blank' rel="noreferrer">
     							{city.address}
   							</a>
 						</Heading>
-						<Heading typeStyle='lg' className='text-white mt-[24px]'>
+						<Heading typeStyle='lg' className={`${textColor} mt-[24px]`}>
 							{city.date}
 						</Heading>
 						{city.ended ? "" : <div className='m-[30px]'>
 							{city.ticket && <a href={city.ticket} target='_blank' rel='noreferrer'>
 							<Button className="px-8 m-2 w-[250px]">{city.isFree ? "Register for free" : "Register now"}</Button>
 						</a>}
-						{city.cfp && <a href={city.cfp} target='_blank' rel='noreferrer'>
+						{(!eventEnded && city.cfp) && <a href={city.cfp} target='_blank' rel='noreferrer'>
 							<Button className="px-8 m-2 w-[250px]">Apply to be a speaker</Button>
 						</a>}
 						</div>}

From 5119efa5323a6986c58f7ed96d9bfed95fe3abcc Mon Sep 17 00:00:00 2001
From: Monu <142221687+monoMonu@users.noreply.github.com>
Date: Sun, 24 Mar 2024 10:03:25 +0530
Subject: [PATCH 2/4] Update venue.js

remove explicit export from Venue/venue.js
---
 components/Venue/venue.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/components/Venue/venue.js b/components/Venue/venue.js
index 5d344be6..a577d259 100644
--- a/components/Venue/venue.js
+++ b/components/Venue/venue.js
@@ -1,7 +1,7 @@
 /* eslint-disable react/no-unescaped-entities */
 import React from 'react';
 
- function isEventEnded(date){
+export function isEventEnded(date){
 	const eventDate = date.split(" ");
 	const month = eventDate[0];
 	const year = eventDate[eventDate.length-1];
@@ -41,4 +41,3 @@ function Venue({ className, city }) {
 }
 
 export default Venue;
-export {isEventEnded}

From f5eb45c3f83c76e3f5e00ff77724f05310551556 Mon Sep 17 00:00:00 2001
From: Monu <142221687+monoMonu@users.noreply.github.com>
Date: Tue, 9 Jul 2024 00:03:46 +0530
Subject: [PATCH 3/4] remove "upcoming" tag

---
 components/Venue/venue.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/Venue/venue.js b/components/Venue/venue.js
index c96f2394..f686e812 100644
--- a/components/Venue/venue.js
+++ b/components/Venue/venue.js
@@ -34,7 +34,7 @@ function Venue({ className, city }) {
 							<span className='text-lg font-bold'>{city.country}, {city.name}</span>
 						</div>
 						<div className='inline-block border border-gray-400 rounded-lg py-1 px-2 text-center mt-2'>{city.date}</div>
-						<span className='text-xs text-white'> - {eventEnded ? "ENDED" : "UPCOMING"}</span>
+						<span className='text-xs text-white'> - {eventEnded ? "ENDED" : ""}</span>
 					</div>
 				</div>
 			</div>

From 8f1d6a409b7fe92557e797ed1e5b2c499485156d Mon Sep 17 00:00:00 2001
From: Monu <ms88006218@gmail.com>
Date: Wed, 28 Aug 2024 23:41:11 +0530
Subject: [PATCH 4/4] fix event text visibility issue

---
 components/Venue/venue.js | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/components/Venue/venue.js b/components/Venue/venue.js
index f686e812..ff21997a 100644
--- a/components/Venue/venue.js
+++ b/components/Venue/venue.js
@@ -15,11 +15,11 @@ export function isEventEnded(date){
 function Venue({ className, city }) {
 
 	const eventEnded = isEventEnded(city.date);
-	const textColor = eventEnded ? "text-gray-300": "text-white";
+	const textColor = eventEnded ? "text-white": "text-white";
 
 	return (
 		<Link href={`/venue/${city.name}`}>
-			<div style={{'--image-url': `url(${city.img})`}}
+			<div style={{background: `linear-gradient(to bottom, rgba(0,0,0,.3), rgba(0,0,0, .3)), url(${city.img})`, backgroundSize: "cover"}}
 				className='relative w-[300px] h-[400px] sm:w-[250px] sm:h-[350px] card-bg rounded-md bg-[image:var(--image-url)] flex items-center justify-center p-4 cursor-pointer'>
 				<div className='flex justify-between flex-col w-full h-full'>
 					<div className='flex justify-between items-center'>
@@ -33,8 +33,10 @@ function Venue({ className, city }) {
 						<div>
 							<span className='text-lg font-bold'>{city.country}, {city.name}</span>
 						</div>
-						<div className='inline-block border border-gray-400 rounded-lg py-1 px-2 text-center mt-2'>{city.date}</div>
-						<span className='text-xs text-white'> - {eventEnded ? "ENDED" : ""}</span>
+						<div className='flex align-end flex-row justify-between pt-2'>
+							<div className='inline-block border border-gray-400 rounded-lg py-1 px-2 text-center'>{city.date}</div>
+							<span className=' text-white flex align-middle pt-2' style={{ fontSize: ".9em" }}>{eventEnded ? "ENDED" : ""}</span>
+						</div>
 					</div>
 				</div>
 			</div>