Skip to content

Commit a2629cd

Browse files
feat: redesign broadcast page + add to navbar
1 parent 5f1f561 commit a2629cd

4 files changed

Lines changed: 175 additions & 179 deletions

File tree

src/components/Common/Header.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -214,6 +214,12 @@ export const Header: React.FC = () => {
214214
>
215215
BOT-OR-NOT
216216
</Link>
217+
<Link
218+
href="/broadcast"
219+
className={`px-2 py-1 transition-all duration-200 hover:!text-primary ${router.pathname.startsWith('/broadcast') ? '!text-primary' : '!text-primary/80'}`}
220+
>
221+
BROADCASTS
222+
</Link>
217223
<Link
218224
href="/leaderboard"
219225
className={`px-2 py-1 transition-all duration-200 hover:!text-primary ${router.pathname.startsWith('/leaderboard') ? '!text-primary' : '!text-primary/80'}`}
@@ -353,6 +359,9 @@ export const Header: React.FC = () => {
353359
<Link href="/turing" className="uppercase">
354360
Bot-or-not
355361
</Link>
362+
<Link href="/broadcast" className="uppercase">
363+
Broadcasts
364+
</Link>
356365
<Link href="/leaderboard" className="uppercase">
357366
Leaderboard
358367
</Link>

src/hooks/useBroadcastController.ts

Lines changed: 50 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -70,81 +70,80 @@ export const useBroadcastController = (): BroadcastStreamController => {
7070
// Organize broadcasts into sections
7171
const sections: BroadcastSection[] = []
7272

73-
// 1. Official active broadcasts (Lichess official live tournaments)
73+
// 1. All live tournaments (currently ongoing) - only include if they have ongoing rounds
7474
const officialActive = officialBroadcasts.filter((b) =>
7575
b.rounds.some((r) => r.ongoing),
7676
)
77-
if (officialActive.length > 0) {
78-
sections.push({
79-
title: 'Official Live Tournaments',
80-
broadcasts: officialActive,
81-
type: 'official-active',
82-
})
83-
}
84-
85-
// 2. Official upcoming broadcasts (Lichess official upcoming tournaments) - max 4
86-
const officialUpcoming = officialBroadcasts
77+
const unofficialActive = topBroadcasts.active
78+
.map(convertTopBroadcastToBroadcast)
8779
.filter(
8880
(b) =>
89-
b.rounds.every((r) => !r.ongoing) &&
90-
b.rounds.some((r) => r.startsAt > Date.now()),
81+
!officialActive.some(
82+
(official) => official.tour.id === b.tour.id,
83+
) && b.rounds.some((r) => r.ongoing), // Only include if has ongoing rounds
9184
)
92-
.slice(0, 4) // Limit to 4
93-
if (officialUpcoming.length > 0) {
94-
sections.push({
95-
title: 'Upcoming Official Tournaments',
96-
broadcasts: officialUpcoming,
97-
type: 'official-upcoming',
98-
})
99-
}
10085

101-
// 3. Community live broadcasts (all live community broadcasts)
102-
const unofficialActive = topBroadcasts.active
103-
.map(convertTopBroadcastToBroadcast)
86+
const allLiveBroadcasts = [...officialActive, ...unofficialActive]
87+
// Double-check: only include broadcasts that actually have ongoing rounds
88+
.filter((b) => b.rounds.some((r) => r.ongoing))
89+
90+
// Get coming soon tournaments to add to live section (max 5)
91+
const officialUpcoming = officialBroadcasts.filter(
92+
(b) =>
93+
b.rounds.every((r) => !r.ongoing) &&
94+
b.rounds.some((r) => r.startsAt > Date.now()),
95+
)
96+
const unofficialUpcoming = topBroadcasts.upcoming.map(
97+
convertTopBroadcastToBroadcast,
98+
)
99+
100+
const filteredUpcoming = [...officialUpcoming, ...unofficialUpcoming]
104101
.filter(
105102
(b) =>
106-
!officialActive.some((official) => official.tour.id === b.tour.id),
103+
b.rounds.every((r) => !r.ongoing) && // No ongoing rounds
104+
b.rounds.some((r) => r.startsAt > Date.now()) && // Has future rounds
105+
!allLiveBroadcasts.some((live) => live.tour.id === b.tour.id), // Not already in live section
107106
)
108-
if (unofficialActive.length > 0) {
107+
.slice(0, 5) // Max 5 coming soon tournaments
108+
109+
// Combine live and coming soon tournaments in one section
110+
const liveAndUpcomingBroadcasts = [
111+
...allLiveBroadcasts,
112+
...filteredUpcoming,
113+
]
114+
if (liveAndUpcomingBroadcasts.length > 0) {
109115
sections.push({
110-
title: 'Community Live Broadcasts',
111-
broadcasts: unofficialActive,
112-
type: 'unofficial-active',
116+
title: 'Live Tournaments',
117+
broadcasts: liveAndUpcomingBroadcasts,
118+
type: 'official-active', // Keep this for styling purposes (shows LIVE indicator)
113119
})
114120
}
115121

116-
// 4. Community upcoming broadcasts - max 5
117-
const unofficialUpcoming = topBroadcasts.upcoming
118-
.map(convertTopBroadcastToBroadcast)
119-
.slice(0, 5) // Limit to 5
120-
if (unofficialUpcoming.length > 0) {
121-
sections.push({
122-
title: 'Upcoming Community Broadcasts',
123-
broadcasts: unofficialUpcoming,
124-
type: 'unofficial-upcoming',
125-
})
126-
}
127-
128-
// 5. Past tournaments (separate section) - max 8
122+
// 2. All past tournaments that can be watched (finished tournaments)
129123
const officialPast = officialBroadcasts.filter(
130124
(b) =>
131125
b.rounds.every((r) => !r.ongoing) &&
132-
b.rounds.every((r) => r.startsAt <= Date.now()),
126+
b.rounds.every((r) => r.startsAt <= Date.now()) &&
127+
b.rounds.length > 0,
128+
)
129+
const communityPast = topBroadcasts.past.currentPageResults.map(
130+
convertTopBroadcastToBroadcast,
133131
)
134-
const pastBroadcasts = [
135-
...officialPast,
136-
...topBroadcasts.past.currentPageResults.map(
137-
convertTopBroadcastToBroadcast,
138-
),
139-
].slice(0, 8) // Limit to 8
140-
if (pastBroadcasts.length > 0) {
132+
133+
const watchablePastBroadcasts = [...officialPast, ...communityPast].slice(
134+
0,
135+
8,
136+
)
137+
if (watchablePastBroadcasts.length > 0) {
141138
sections.push({
142139
title: 'Past Tournaments',
143-
broadcasts: pastBroadcasts,
140+
broadcasts: watchablePastBroadcasts,
144141
type: 'past',
145142
})
146143
}
147144

145+
// Note: Coming Soon tournaments are now included in the Live Tournaments section above
146+
148147
setBroadcastSections(sections)
149148
console.log(
150149
'Loaded broadcasts:',

0 commit comments

Comments
 (0)