diff --git a/app/calendar/components/CalendarPage.tsx b/app/calendar/components/CalendarPage.tsx index 4d35f9e70..360ca3f90 100644 --- a/app/calendar/components/CalendarPage.tsx +++ b/app/calendar/components/CalendarPage.tsx @@ -15,10 +15,7 @@ export default function CalendarPage() { const [modalIsOpen, setModalIsOpen] = useState(false); const [filter, setFilter] = useState(""); - console.log("events", events.data); - - let lastPrintedWeek: number | null = null; - const thisWeekNumber = getWeekNumber(new Date()); + let lastPrintedDate: [number, number, Date] | null = null; return ( <> @@ -40,20 +37,30 @@ export default function CalendarPage() { m="3rem 0 2rem" /> {(events.data ?? []).map((event) => { - const weekNumber = getWeekNumber(event.date); - const printWeekHeader = weekNumber !== lastPrintedWeek; + const printDateHeader = + !lastPrintedDate || + (lastPrintedDate[0] !== event.date.getDate() && + lastPrintedDate[1] !== event.date.getMonth()); - if (printWeekHeader) { - lastPrintedWeek = weekNumber; + if (printDateHeader) { + lastPrintedDate = [ + event.date.getDate(), + event.date.getMonth(), + event.date, + ]; } + const differenceInDays = Math.floor( + (lastPrintedDate![2].getTime() - new Date().getTime()) / + (1000 * 60 * 60 * 24) + ); + return ( - {printWeekHeader && ( + {printDateHeader && ( - Week {weekNumber}{" "} - {thisWeekNumber === weekNumber && <>({t`This week`})} + {event.date.toLocaleDateString()} {getTime(differenceInDays)} )} @@ -71,18 +78,9 @@ export default function CalendarPage() { ); } -function getWeekNumber(d: Date) { - // Copy date so don't modify original - d = new Date(Date.UTC(d.getFullYear(), d.getMonth(), d.getDate())); - // Set to nearest Thursday: current date + 4 - current day number - // Make Sunday's day number 7 - d.setUTCDate(d.getUTCDate() + 4 - (d.getUTCDay() || 7)); - // Get first day of year - const yearStart = new Date(Date.UTC(d.getUTCFullYear(), 0, 1)); - // Calculate full weeks to nearest Thursday - const weekNo = Math.ceil( - ((d.getTime() - yearStart.getTime()) / 86400000 + 1) / 7 - ); - // Return array of year and week number - return weekNo; +function getTime(days: number) { + if (days < 1) return t`(Today)`; + if (days === 1) return t`(Tomorrow)`; + + return ""; } diff --git a/app/calendar/components/EventInfo.tsx b/app/calendar/components/EventInfo.tsx index f88edfb1f..8b49cab5c 100644 --- a/app/calendar/components/EventInfo.tsx +++ b/app/calendar/components/EventInfo.tsx @@ -17,12 +17,7 @@ interface EventInfoProps { } const TournamentInfo = ({ event }: EventInfoProps) => { - const { - secondaryBgColor, - themeColorHex, - gray, - themeColorShade, - } = useMyTheme(); + const { secondaryBgColor, gray, themeColorShade } = useMyTheme(); const [expanded, setExpanded] = useState(false); const [showModal, setShowModal] = useState(false); const poster = event.poster; @@ -46,7 +41,7 @@ const TournamentInfo = ({ event }: EventInfoProps) => { {event.name} - + {event.tags.map((tag) => { const tagInfo = TAGS.find((tagObj) => tagObj.code === tag)!; return (