regalijan/car-crushers-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Hopefully make accordion update

Browse Source
This commit is contained in:
Regalijan 2024-11-08 02:36:40 -05:00
parent 231ae733e7
commit cbb26f438b
Signed by: regalijan
GPG Key ID: 5D4196DA269EF520
1 changed files with 14 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
app/routes/events-calendar.tsx
View File

@ -70,15 +70,14 @@ export async function loader({ context }: { context: RequestContext }) {
export default function () { export default function () {
const data = useLoaderData<typeof loader>(); const data = useLoaderData<typeof loader>();
const [selectedDate, setDate] = useState(new Date()); const [selectedDate, setDate] = useState(new Date());
const getEventsOfDay = (date: Date) =>
const eventsOfDay = () => { data.eventList.filter(
return data.eventList.filter(
(e) => (e) =>
e.day === selectedDate.getUTCDate() && e.day === date.getUTCDate() &&
e.month === selectedDate.getUTCMonth() + 1 && e.month === date.getUTCMonth() + 1 &&
e.year === selectedDate.getUTCFullYear(), e.year === date.getUTCFullYear(),
) as { [k: string]: any }[]; ) as { [k: string]: any }[];
}; const [eventsOfDay, setEventsOfDay] = useState(getEventsOfDay(selectedDate));
dayjs.extend(utc); dayjs.extend(utc);
@ -89,15 +88,12 @@ export default function () {
events={data.calendarData} events={data.calendarData}
localizer={dayjsLocalizer(dayjs)} localizer={dayjsLocalizer(dayjs)}
onSelectSlot={(s) => { onSelectSlot={(s) => {
setDate(s.slots.at(0) as Date); const date = s.slots.at(0) as Date;
setDate(date);
setEventsOfDay(getEventsOfDay(date));
}} }}
popup popup
startAccessor={(event) => { startAccessor={(event) => new Date(event.start)}
const date = new Date(event.start);
date.setUTCDate(date.getUTCDate() + 1);
return date;
}}
style={{ height: 500 }} style={{ height: 500 }}
views={{ views={{
month: true, month: true,
@ -118,7 +114,7 @@ export default function () {
</AccordionButton> </AccordionButton>
</h2> </h2>
<AccordionPanel pb={4}> <AccordionPanel pb={4}>
{eventsOfDay().find((e) => e.type === "fotd")?.details || "None"} {eventsOfDay.find((e) => e.type === "fotd")?.details || "None"}
<br /> <br />
</AccordionPanel> </AccordionPanel>
</AccordionItem> </AccordionItem>
@ -132,8 +128,7 @@ export default function () {
</AccordionButton> </AccordionButton>
</h2> </h2>
<AccordionPanel pb={4}> <AccordionPanel pb={4}>
{eventsOfDay().find((e) => e.type === "gamenight")?.details || {eventsOfDay.find((e) => e.type === "gamenight")?.details || "None"}
"None"}
</AccordionPanel> </AccordionPanel>
</AccordionItem> </AccordionItem>
<AccordionItem> <AccordionItem>
@ -145,7 +140,7 @@ export default function () {
</AccordionButton> </AccordionButton>
</h2> </h2>
<AccordionPanel pb={4}> <AccordionPanel pb={4}>
{eventsOfDay().find((e) => e.type === "rotw")?.details || "None"} {eventsOfDay.find((e) => e.type === "rotw")?.details || "None"}
</AccordionPanel> </AccordionPanel>
</AccordionItem> </AccordionItem>
<AccordionItem> <AccordionItem>
@ -157,7 +152,7 @@ export default function () {
</AccordionButton> </AccordionButton>
</h2> </h2>
<AccordionPanel pb={4}> <AccordionPanel pb={4}>
{eventsOfDay().find((e) => e.type === "qotd")?.details || "None"} {eventsOfDay.find((e) => e.type === "qotd")?.details || "None"}
</AccordionPanel> </AccordionPanel>
</AccordionItem> </AccordionItem>
</Accordion> </Accordion>