fix: derive upcoming fixture day label from computed local kickoff time
Previously used the stored venue date for Today/Tomorrow logic, which gave wrong results when the UTC kickoff crossed midnight into the next local day (e.g. 18:00 UTC-7 = 01:00 UTC next day). Now computes UTC kickoff first, converts to the viewer's local time, and derives the day label from that local Date object. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
+20
-16
@@ -57,26 +57,30 @@ function formatKickoff(date: string | null | undefined, time: string | null | un
|
|||||||
if (!date) return ''
|
if (!date) return ''
|
||||||
const today = new Date()
|
const today = new Date()
|
||||||
const tomorrow = new Date(today); tomorrow.setDate(today.getDate() + 1)
|
const tomorrow = new Date(today); tomorrow.setDate(today.getDate() + 1)
|
||||||
|
|
||||||
|
if (time) {
|
||||||
|
const m = time.match(/^(\d{2}):(\d{2})(?:\s+UTC([+-]\d+(?:\.\d+)?))?/)
|
||||||
|
if (m) {
|
||||||
|
const [y, mo, d] = date.split('-').map(Number)
|
||||||
|
const h = parseInt(m[1]), min = parseInt(m[2])
|
||||||
|
const offsetH = m[3] ? parseFloat(m[3]) : 0
|
||||||
|
// Compute UTC kickoff, then let the browser render in its local timezone
|
||||||
|
const local = new Date(Date.UTC(y, mo - 1, d, h - offsetH, min))
|
||||||
|
const isToday = local.toDateString() === today.toDateString()
|
||||||
|
const isTomorrow = local.toDateString() === tomorrow.toDateString()
|
||||||
|
const dayLabel = isToday ? 'Today' : isTomorrow ? 'Tomorrow'
|
||||||
|
: local.toLocaleDateString('en-GB', { weekday: 'short', day: 'numeric', month: 'short' })
|
||||||
|
const localTime = local.toLocaleTimeString('en-GB', { hour: '2-digit', minute: '2-digit' })
|
||||||
|
return `${dayLabel} · ${localTime}`
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// No time — fall back to venue date label only
|
||||||
const matchDate = new Date(date + 'T00:00:00')
|
const matchDate = new Date(date + 'T00:00:00')
|
||||||
const isToday = matchDate.toDateString() === today.toDateString()
|
const isToday = matchDate.toDateString() === today.toDateString()
|
||||||
const isTomorrow = matchDate.toDateString() === tomorrow.toDateString()
|
const isTomorrow = matchDate.toDateString() === tomorrow.toDateString()
|
||||||
const dayLabel = isToday ? 'Today' : isTomorrow ? 'Tomorrow'
|
return isToday ? 'Today' : isTomorrow ? 'Tomorrow'
|
||||||
: matchDate.toLocaleDateString('en-GB', { weekday: 'short', day: 'numeric', month: 'short' })
|
: matchDate.toLocaleDateString('en-GB', { weekday: 'short', day: 'numeric', month: 'short' })
|
||||||
|
|
||||||
if (!time) return dayLabel
|
|
||||||
|
|
||||||
// Parse "HH:MM UTC±N" and convert to viewer's local time
|
|
||||||
const m = time.match(/^(\d{2}):(\d{2})(?:\s+UTC([+-]\d+(?:\.\d+)?))?/)
|
|
||||||
if (!m) return dayLabel
|
|
||||||
const h = parseInt(m[1]), min = parseInt(m[2])
|
|
||||||
const offsetH = m[3] ? parseFloat(m[3]) : 0
|
|
||||||
const utcMs = Date.UTC(
|
|
||||||
matchDate.getFullYear(), matchDate.getMonth(), matchDate.getDate(),
|
|
||||||
h - offsetH, min
|
|
||||||
)
|
|
||||||
const local = new Date(utcMs)
|
|
||||||
const localTime = local.toLocaleTimeString('en-GB', { hour: '2-digit', minute: '2-digit' })
|
|
||||||
return `${dayLabel} · ${localTime}`
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function UpcomingFixture({ match }: { match: UpcomingMatch }) {
|
function UpcomingFixture({ match }: { match: UpcomingMatch }) {
|
||||||
|
|||||||
Reference in New Issue
Block a user