From c979408855789202e5b868b5ce4fdc746be7473b Mon Sep 17 00:00:00 2001 From: Warre Provoost <133233646+warreprovoost@users.noreply.github.com> Date: Thu, 23 May 2024 16:46:18 +0200 Subject: [PATCH] show red dots on home page (#412) --- frontend/src/pages/home/HomePage.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/frontend/src/pages/home/HomePage.tsx b/frontend/src/pages/home/HomePage.tsx index 35775325..94956541 100644 --- a/frontend/src/pages/home/HomePage.tsx +++ b/frontend/src/pages/home/HomePage.tsx @@ -11,14 +11,13 @@ import { import { DateCalendar } from "@mui/x-date-pickers/DateCalendar"; import { DayCalendarSkeleton, LocalizationProvider } from "@mui/x-date-pickers"; import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs"; -import React, { useState } from "react"; +import React, { useState, useEffect } from "react"; import dayjs, { Dayjs } from "dayjs"; import { PickersDay, PickersDayProps } from "@mui/x-date-pickers/PickersDay"; import { ProjectDeadlineCard } from "../project/projectDeadline/ProjectDeadlineCard.tsx"; import { ProjectDeadline } from "../project/projectDeadline/ProjectDeadline.tsx"; import { useLoaderData } from "react-router-dom"; import { Me } from "../../types/me.ts"; - interface DeadlineInfoProps { selectedDay: Dayjs; deadlines: ProjectDeadline[]; @@ -144,6 +143,11 @@ export default function HomePage() { .sort((a, b) => dayjs(b.deadline).diff(dayjs(a.deadline))) .slice(0, 3); // only show the first 3 const noDeadlineProject = projects.filter((p) => p.deadline === undefined); + + useEffect(() => { + handleMonthChange(selectedDay, projects, setHighlightedDays); + }, [projects, selectedDay]); + return (