Skip to content

Commit 6c5d904

Browse files
kuzdogankuzdogan
committed
Move dynamic content to client side components
1 parent 4157573 commit 6c5d904

File tree

5 files changed

+91
-79
lines changed

5 files changed

+91
-79
lines changed

‎app/events/EventsList.tsx

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
'use client'
2+
3+
import { events } from '@/data/dodEvents'
4+
5+
export default function EventsList() {
6+
const now = new Date()
7+
const upcomingEvents = events
8+
.filter((event) => new Date(event.date) > now)
9+
.sort((a, b) => new Date(a.date).getTime() - new Date(b.date).getTime())
10+
11+
const pastEvents = events
12+
.filter((event) => new Date(event.date) <= now)
13+
.sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime())
14+
15+
const renderEvent = (event) => (
16+
<li key={`${event.title}-${event.date}`}>
17+
<strong>
18+
{event.title} (
19+
{event.yearOnly
20+
? new Date(event.date).getFullYear()
21+
: new Date(event.date).toLocaleDateString('en-US', { month: '2-digit', year: 'numeric' })}
22+
){':'}
23+
</strong>{' '}
24+
{event.description}
25+
{event.link && (
26+
<>
27+
:{' '}
28+
<a href={event.link.url} target="_blank" rel="noreferrer">
29+
{event.link.label}
30+
</a>
31+
</>
32+
)}
33+
</li>
34+
)
35+
36+
return (
37+
<div className="prose max-w-none pb-8 pt-8 dark:prose-invert">
38+
<h3>Upcoming events:</h3>
39+
<div>
40+
<ul>{upcomingEvents.map(renderEvent)}</ul>
41+
</div>
42+
<h3>Past events:</h3>
43+
<div>
44+
<ul>{pastEvents.map(renderEvent)}</ul>
45+
</div>
46+
</div>
47+
)
48+
}

‎app/events/page.tsx

Lines changed: 2 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,53 +1,14 @@
11
import PageTitle from '@/components/PageTitle'
22
import { genPageMetadata } from 'app/seo'
3-
import { events } from '@/data/dodEvents'
3+
import EventsList from './EventsList'
44

55
export const metadata = genPageMetadata({ title: 'Events' })
66

77
export default function Events() {
8-
const now = new Date()
9-
const upcomingEvents = events
10-
.filter((event) => new Date(event.date) > now)
11-
.sort((a, b) => new Date(a.date).getTime() - new Date(b.date).getTime())
12-
13-
const pastEvents = events
14-
.filter((event) => new Date(event.date) <= now)
15-
.sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime())
16-
17-
const renderEvent = (event) => (
18-
<li key={`${event.title}-${event.date}`}>
19-
<strong>
20-
{event.title} (
21-
{event.yearOnly
22-
? new Date(event.date).getFullYear()
23-
: new Date(event.date).toLocaleDateString('en-US', { month: '2-digit', year: 'numeric' })}
24-
){':'}
25-
</strong>{' '}
26-
{event.description}
27-
{event.link && (
28-
<>
29-
:{' '}
30-
<a href={event.link.url} target="_blank" rel="noreferrer">
31-
{event.link.label}
32-
</a>
33-
</>
34-
)}
35-
</li>
36-
)
37-
388
return (
399
<>
4010
<PageTitle>Events</PageTitle>
41-
<div className="prose max-w-none pb-8 pt-8 dark:prose-invert">
42-
<h3>Upcoming events:</h3>
43-
<div>
44-
<ul>{upcomingEvents.map(renderEvent)}</ul>
45-
</div>
46-
<h3>Past events:</h3>
47-
<div>
48-
<ul>{pastEvents.map(renderEvent)}</ul>
49-
</div>
50-
</div>
11+
<EventsList />
5112
</>
5213
)
5314
}

‎app/impressum/NextStammtisch.tsx

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
'use client'
2+
3+
export default function NextStammtisch() {
4+
const today = new Date()
5+
const currentMonth = today.getMonth()
6+
const currentYear = today.getFullYear()
7+
8+
// Create date object for 1st of current month
9+
let date = new Date(currentYear, currentMonth, 1)
10+
11+
// Find first Wednesday
12+
while (date.getDay() !== 3) {
13+
date.setDate(date.getDate() + 1)
14+
}
15+
16+
// Add 2 weeks to get to 3rd Wednesday
17+
date.setDate(date.getDate() + 14)
18+
19+
// If 3rd Wednesday already passed this month, move to next month
20+
if (date < today) {
21+
date = new Date(currentYear, currentMonth + 1, 1)
22+
while (date.getDay() !== 3) {
23+
date.setDate(date.getDate() + 1)
24+
}
25+
date.setDate(date.getDate() + 14)
26+
}
27+
28+
return (
29+
<span className="font-medium">
30+
{date.toLocaleDateString('en-US', {
31+
weekday: 'long',
32+
year: 'numeric',
33+
month: 'long',
34+
day: 'numeric',
35+
})}
36+
</span>
37+
)
38+
}

‎app/impressum/page.tsx

Lines changed: 2 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import PageTitle from '@/components/PageTitle'
22
import { genPageMetadata } from 'app/seo'
3+
import NextStammtisch from './NextStammtisch'
34

45
export const metadata = genPageMetadata({ title: 'Impressum' })
56

@@ -18,43 +19,7 @@ export default function Impressum() {
1819
</p>
1920
<div>
2021
<p>
21-
Next Stammtisch:
22-
{(() => {
23-
const today = new Date()
24-
const currentMonth = today.getMonth()
25-
const currentYear = today.getFullYear()
26-
27-
// Create date object for 1st of current month
28-
let date = new Date(currentYear, currentMonth, 1)
29-
30-
// Find first Wednesday
31-
while (date.getDay() !== 3) {
32-
date.setDate(date.getDate() + 1)
33-
}
34-
35-
// Add 2 weeks to get to 3rd Wednesday
36-
date.setDate(date.getDate() + 14)
37-
38-
// If 3rd Wednesday already passed this month, move to next month
39-
if (date < today) {
40-
date = new Date(currentYear, currentMonth + 1, 1)
41-
while (date.getDay() !== 3) {
42-
date.setDate(date.getDate() + 1)
43-
}
44-
date.setDate(date.getDate() + 14)
45-
}
46-
47-
return (
48-
<span className="font-medium">
49-
{date.toLocaleDateString('en-US', {
50-
weekday: 'long',
51-
year: 'numeric',
52-
month: 'long',
53-
day: 'numeric',
54-
})}
55-
</span>
56-
)
57-
})()}
22+
Next Stammtisch: <NextStammtisch />
5823
</p>
5924
</div>
6025
<p>

‎app/tag-data.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
{"3":3,"25":1,"ethberlin":27,"hackathon":28,"dod":10,"conference":5,"goerli":5,"winners":3,"transparency":3,"art":5,"culture":5,"talkshow":1,"04":4,"experiences":2,"protocol-berg":1,"v2":1,"zwei":7,"meetup":1}
1+
{"3":3,"25":1,"dod":10,"hackathon":28,"conference":5,"zwei":7,"ethberlin":27,"goerli":5,"art":5,"transparency":3,"meetup":1,"culture":5,"winners":3,"talkshow":1,"04":4,"experiences":2,"protocol-berg":1,"v2":1}

0 commit comments

Comments
 (0)