Skip to content

Commit 2ad1fb6

Browse files
noobGnoobG
committed
event table related
1 parent e3ad9c5 commit 2ad1fb6

4 files changed

Lines changed: 240 additions & 81 deletions

File tree

‎devconnect/src/pages/argentina.tsx‎

Lines changed: 153 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import React from 'react'
2+
import Link from 'common/components/link'
23
import { useAccountContext } from 'context/account-context'
34
import { useCalendarStore } from 'store/calendar'
45
import { Client } from '@notionhq/client'
@@ -18,6 +19,74 @@ const Argentina = (props: any) => {
1819

1920
console.log(props.events)
2021

22+
const coreEvents = [
23+
{
24+
id: 'event-000',
25+
priority: 1,
26+
spanRows: 2,
27+
name: `Ethereum World's Fair & Coworking Space`,
28+
description: 'Open coworking space for developers, builders, and researchers to collaborate throughout the week.',
29+
organizer: 'DevConnect',
30+
difficulty: 'All Welcome',
31+
amountPeople: '100',
32+
isCoreEvent: true,
33+
timeblocks: [
34+
{
35+
start: '2025-11-17T09:00:00Z',
36+
end: '2025-11-22T18:00:00Z',
37+
},
38+
{
39+
start: '2025-11-20T09:00:00Z',
40+
end: '2025-11-20T18:00:00Z',
41+
},
42+
{
43+
start: '2025-11-22T09:00:00Z',
44+
end: '2025-11-22T18:00:00Z',
45+
},
46+
],
47+
location: {
48+
url: 'https://example.com/coworking',
49+
text: 'Innovation Hub',
50+
},
51+
},
52+
{
53+
id: 'event-001',
54+
priority: 2,
55+
spanRows: 3,
56+
name: 'ETH Day',
57+
description: 'A beginner-friendly workshop covering blockchain fundamentals and use cases.',
58+
organizer: 'Ethereum Foundation',
59+
difficulty: 'All Welcome',
60+
isFairEvent: true,
61+
amountPeople: '50',
62+
timeblocks: [
63+
{
64+
start: '2025-11-17T10:00:00Z',
65+
end: '2025-11-17T12:00:00Z',
66+
},
67+
],
68+
location: {
69+
url: 'https://example.com/venue1',
70+
text: 'Main Conference Hall',
71+
},
72+
// timeblocks: [
73+
// {
74+
// start: '2025-11-17T10:00:00Z',
75+
// end: '2025-11-17T12:00:00Z',
76+
// },
77+
// ],
78+
// priority: 1,
79+
// categories: ['Education', 'Blockchain', 'Workshop'],
80+
},
81+
]
82+
83+
const events = [...props.events, ...coreEvents].map(event => {
84+
return {
85+
...event,
86+
onClick: () => {},
87+
}
88+
})
89+
2190
return (
2291
<>
2392
<Header active />
@@ -43,12 +112,38 @@ const Argentina = (props: any) => {
43112
<div className="flex flex-col gap-4 text-black">
44113
<div className="section my-1 mb-8">
45114
<NewSchedule
46-
events={props.events}
115+
events={events}
47116
selectedEvent={selectedEvent}
48117
selectedDay={selectedDay}
49118
setSelectedEvent={setSelectedEvent}
50119
setSelectedDay={setSelectedDay}
51120
/>
121+
122+
<div className="text-sm flex flex-col gap-4">
123+
<p>
124+
<strong>Disclaimer:</strong> This calendar is a work in progress and may change a lot before Devconnect
125+
week. Please check back regularly for updates.
126+
</p>
127+
<div>
128+
<p>
129+
<strong>Want to be featured on our calendar?</strong> We encourage event hosts to submit their events to
130+
atprotocol adhering to the [devcon.org event record type].{' '}
131+
<strong>This is not a guarantee of inclusion as we still curate events,</strong> but is a{' '}
132+
<strong>requirement</strong> for community events to be considered on our calendar.
133+
</p>
134+
<p>
135+
<strong>How do I submit my event to atprotocol?</strong> ...
136+
</p>
137+
</div>
138+
<p>
139+
<strong>Want to build a community calendar? </strong> For your convenience, we collect all events
140+
submitted to atprotocol and expose them via{' '}
141+
<Link indicateExternal className="bold" href="https://at-slurper.onrender.com/all-events">
142+
https://at-slurper.onrender.com/all-events
143+
</Link>
144+
. You can also use atprotocol directly, as all data is public.
145+
</p>
146+
</div>
52147
</div>
53148
</div>
54149
<Footer />
@@ -70,32 +165,32 @@ export async function getStaticProps({ locale }: { locale: string }) {
70165

71166
const query = {
72167
database_id: '1f5638cdc41580be9117f4963f021d8b',
73-
// sorts: [
74-
// {
75-
// property: '[HOST] Event Date',
76-
// direction: 'ascending',
77-
// },
78-
// {
79-
// property: '[WEB] Priority (sort)',
80-
// direction: 'descending',
81-
// },
82-
// ],
83-
// filter: {
84-
// and: [
85-
// {
86-
// property: '[HOST] Event Date',
87-
// date: {
88-
// is_not_empty: true,
89-
// },
90-
// },
91-
// {
92-
// property: '[WEB] Live',
93-
// checkbox: {
94-
// equals: true,
95-
// },
96-
// },
97-
// ],
98-
// },
168+
sorts: [
169+
{
170+
property: 'Event date',
171+
direction: 'ascending',
172+
},
173+
// {
174+
// property: '[WEB] Priority (sort)',
175+
// direction: 'descending',
176+
// },
177+
],
178+
filter: {
179+
and: [
180+
{
181+
property: 'Event date',
182+
date: {
183+
is_not_empty: true,
184+
},
185+
},
186+
{
187+
property: 'Live on website',
188+
checkbox: {
189+
equals: true,
190+
},
191+
},
192+
],
193+
},
99194
}
100195

101196
const notionEvents = await notion.databases.query(query as any)
@@ -132,34 +227,39 @@ export interface Event {
132227

133228
// console.log(notionEvents)
134229

135-
const events = notionEvents.results
136-
.map(event => {
137-
const formattedEvent = formatResult(event)
138-
139-
const startDate = moment('2025-11-17T09:00:00Z').add(Math.floor(Math.random() * 6), 'days')
140-
141-
return {
142-
id: event.id,
143-
name: formattedEvent['Event name'],
144-
description: formattedEvent['Description'] || '',
145-
capacity: formattedEvent['Capacity'],
146-
size: formattedEvent['Size'],
147-
location: formattedEvent['Location'] || { text: 'TBD', url: '' },
148-
timeblocks: [
149-
{
150-
start: startDate.format('YYYY-MM-DDTHH:mm:ss[Z]'),
151-
end: startDate.clone().add(4, 'hours').format('YYYY-MM-DDTHH:mm:ss[Z]'),
152-
},
153-
],
154-
difficulty: 'Beginner',
230+
const events = notionEvents.results.map(event => {
231+
const formattedEvent = formatResult(event)
232+
233+
const timeblocks = []
234+
235+
if (formattedEvent['Event date']) {
236+
let startDate = moment.utc(formattedEvent['Event date'].startDate)
237+
let endDate
238+
239+
if (formattedEvent['Event date'].endDate) {
240+
endDate = moment.utc(formattedEvent['Event date'].endDate).format('YYYY-MM-DDTHH:mm:ss[Z]')
241+
} else {
242+
endDate = startDate.format('YYYY-MM-DDTHH:mm:ss[Z]')
155243
}
156-
})
157-
.sort((a, b) => moment(a.timeblocks[0].start).valueOf() - moment(b.timeblocks[0].start).valueOf())
158244

159-
// @ts-ignore
160-
events[0].isFairEvent = true
161-
// @ts-ignore
162-
events[1].isCoreEvent = true
245+
timeblocks.push({
246+
start: startDate.format('YYYY-MM-DDTHH:mm:ss[Z]'),
247+
end: endDate,
248+
})
249+
}
250+
251+
return {
252+
id: event.id,
253+
name: formattedEvent['Event name'],
254+
description: formattedEvent['Description'] || '',
255+
capacity: formattedEvent['Capacity'],
256+
startDate: formattedEvent['Event date'],
257+
// size: formattedEvent['Size'],
258+
location: formattedEvent['Location'] || { text: 'TBD', url: '' },
259+
timeblocks: timeblocks,
260+
difficulty: 'Beginner',
261+
}
262+
})
163263

164264
return {
165265
props: {

‎lib/components/event-schedule-new/day/event.tsx‎

Lines changed: 46 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,11 @@
11
import React from "react";
2-
import { PenLine, Star, MapPin } from "lucide-react";
2+
import { PenLine, Star, MapPin, Ticket } from "lucide-react";
33
import { Event as EventType } from "../model";
44
import { format, parseISO } from "date-fns";
55
import cn from "classnames";
66
import Image from "next/image";
77
// @ts-ignore
88
import coworkingImage from "./cowork.webp";
9-
import { useCalendarStore } from "store/calendar";
109
import {
1110
Dialog,
1211
DialogContent,
@@ -66,7 +65,7 @@ const Event: React.FC<EventProps> = ({
6665

6766
// Determine CSS class based on difficulty
6867
const difficultyClass =
69-
event.difficulty === "Beginner"
68+
event.difficulty === "Beginner" || event.difficulty === "All Welcome"
7069
? "bg-green-300"
7170
: event.difficulty === "Intermediate"
7271
? "bg-yellow-300"
@@ -81,9 +80,12 @@ const Event: React.FC<EventProps> = ({
8180

8281
return (
8382
<div
83+
style={{
84+
height: `${event.spanRows ? event.spanRows * 60 : 60}px`,
85+
}}
8486
className={cn(
85-
"min-h-[60px] group bg-[#f0faff] cursor-pointer",
86-
"flex flex-col h-full gap-4 border border-solid border-neutral-400 p-2 px-2 shrink-0 relative rounded-lg overflow-hidden hover:border-black transition-all duration-300",
87+
`group bg-[#f0faff] cursor-pointer`,
88+
"flex flex-col gap-4 border border-solid border-neutral-400 p-2 px-2 h-full shrink-0 relative rounded-lg overflow-hidden hover:border-black transition-all duration-300",
8789
{
8890
"bg-[rgb(187,232,255)] border-neutral-400 border-solid":
8991
isCoworking || isETHDay,
@@ -92,7 +94,13 @@ const Event: React.FC<EventProps> = ({
9294
isCoreEvent && !isETHDay && !isCoworking && "bg-blue border-solid",
9395
selectedEvent?.id === event.id && "border-black"
9496
)}
95-
onClick={() => setSelectedEvent(event)}
97+
onClick={() => {
98+
if (event.onClick) {
99+
event.onClick();
100+
} else {
101+
setSelectedEvent(event);
102+
}
103+
}}
96104
>
97105
{isCoworking && (
98106
<div className="absolute left-[0%] top-0 right-0 bottom-0 overflow-hidden">
@@ -148,7 +156,6 @@ const Event: React.FC<EventProps> = ({
148156
<div className="text-sm">{event.difficulty}</div>
149157
<div className="text-sm">{event.amountPeople}</div>
150158
<div className="text-sm">{event.organizer}</div>
151-
<div className="text-sm">{event.lemonadeID}</div>
152159
</div>
153160
</DialogDescription>
154161
<DialogFooter>
@@ -180,15 +187,41 @@ const Event: React.FC<EventProps> = ({
180187
</div>
181188
{/* <div className="text-xs text-gray-600 mt-1">{event.location.text}</div> */}
182189

183-
<div className="flex gap-2 w-full mt-2 shrink-0 items-end justify-end text-[9px]">
184-
<div
185-
className={`rounded text-[10px] ${difficultyClass} px-2 py-0.5 flex gap-1.5 items-center`}
190+
<div className="flex justify-between">
191+
{isCoworking && (
192+
<Button
193+
size="sm"
194+
color="blue-1"
195+
fill
196+
className="shrink-0 px-4 py-2 flex text-xs gap-2 items-center"
197+
>
198+
<Ticket className="shrink-0" size={16} />
199+
Tickets Available Now
200+
<Ticket className="shrink-0" size={16} />
201+
</Button>
202+
)}
203+
204+
<div className="flex gap-2 grow shrink-0 items-end justify-end text-[9px]">
205+
<div
206+
className={`rounded text-[10px] ${difficultyClass} px-2 py-0.5 flex gap-1.5 items-center`}
207+
>
208+
{event.difficulty}
209+
</div>
210+
<div
211+
className={`rounded text-[10px] bg-[#bef0ff] px-2 py-0.5 flex gap-1.5 items-center`}
212+
>
213+
<Star className="text-black shrink-0" size={11} />
214+
{event.organizer}
215+
</div>
216+
{/* <div
217+
className={`rounded text-[10px] px-2 bg-[#bef0ff] py-0.5 flex gap-1.5 items-center`}
186218
>
187-
{event.difficulty}
188-
</div>
189-
<div className="rounded text-[10px] bg-[#bef0ff] px-2 py-0.5 flex gap-1 items-center justify-end">
219+
{event.amountPeople}
220+
</div> */}
221+
{/* <div className="rounded text-[10px] bg-[#bef0ff] px-2 py-0.5 flex gap-1 items-center justify-end">
190222
<Star className="text-black shrink-0" size={11} />
191223
RSVP
224+
</div> */}
192225
</div>
193226
</div>
194227
</div>

0 commit comments

Comments
 (0)