eduvia/workavia-calendar-front
11
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[#572] removed dot for events (#590)

Browse Source
This commit is contained in:
Camille Moussu
2026-03-02 11:15:46 +01:00
committed by GitHub
parent 7b31064a56
commit 3bd43c9935
4 changed files with 3 additions and 127 deletions
Download Patch File Download Diff File Expand all files Collapse all files
__test__/components/Calendar.test.tsx
-88
View File
@@ -185,94 +185,6 @@ describe("CalendarSelection", () => {
});
expect(sharedAccordionSummary).toHaveAttribute("aria-expanded", "true");
});
it("BUGFIX: remove dots in mini calendar when unselecting personal calendar", async () => {
await act(async () =>
renderWithProviders(<CalendarLayout />, preloadedState)
);
const checkbox = screen.getByLabelText("Calendar personal");
// checkbox checked : events shown
expect(
screen.getByTestId(
`date-${start.getFullYear()}-${start.getMonth()}-${start.getDate()}`
)
).toHaveClass("event-dot");
// checkbox unchecked : events hidden
await act(async () => {
fireEvent.click(checkbox);
});
expect(
screen.getByTestId(
`date-${start.getFullYear()}-${start.getMonth()}-${start.getDate()}`
)
).not.toHaveClass("event-dot");
// checkbox rechecked : events shown
await act(async () => {
fireEvent.click(checkbox);
});
expect(
screen.getByTestId(
`date-${start.getFullYear()}-${start.getMonth()}-${start.getDate()}`
)
).toHaveClass("event-dot");
});
it("BUGFIX: remove dots in mini calendar when unselecting delegated calendar", async () => {
await act(async () =>
renderWithProviders(<CalendarLayout />, preloadedState)
);
// hide personal event first
await act(async () => {
fireEvent.click(screen.getByLabelText("Calendar personal"));
});
const checkbox = screen.getByLabelText("Calendar delegated");
expect(
screen.getByTestId(
`date-${start.getFullYear()}-${start.getMonth()}-${start.getDate()}`
)
).not.toHaveClass("event-dot");
// checkbox checked : events shown
await act(async () => {
fireEvent.click(checkbox);
});
expect(
screen.getByTestId(
`date-${start.getFullYear()}-${start.getMonth()}-${start.getDate()}`
)
).toHaveClass("event-dot");
});
it("BUGFIX: remove dots in mini calendar when unselecting shared calendar", async () => {
await act(async () =>
renderWithProviders(<CalendarLayout />, preloadedState)
);
// hide personal event first
await act(async () => {
fireEvent.click(screen.getByLabelText("Calendar personal"));
});
const checkbox = screen.getByLabelText("Calendar shared");
// checkbox unchecked : events hidden
expect(
screen.getByTestId(
`date-${start.getFullYear()}-${start.getMonth()}-${start.getDate()}`
)
).not.toHaveClass("event-dot");
// checkbox checked : events shown
await act(async () => {
fireEvent.click(checkbox);
});
expect(
screen.getByTestId(
`date-${start.getFullYear()}-${start.getMonth()}-${start.getDate()}`
)
).toHaveClass("event-dot");
});
it("renders calendars with local storage", async () => {
const mockCalendarRef = { current: null };
localStorage.setItem(
src/components/Calendar/Calendar.styl
-9
View File
@@ -127,15 +127,6 @@
transition background-color 0.2s ease
cursor pointer
.event-dot
margin-top 2px
width 6px
height 6px
background-color #1D192B1F
border-radius 50%
margin-left auto
margin-right auto
.weekSelector
display flex
flex-direction column
src/components/Calendar/Calendar.tsx
-7
View File
@@ -109,12 +109,6 @@ export default function CalendarApp({
[calendarIdsString]
);
const dottedEvents: CalendarEvent[] = selectedCalendars.flatMap((calId) => {
const calendar = calendars[calId];
if (!calendar?.events) return [];
return Object.values(calendar.events);
});
const [currentView, setCurrentView] = useState("timeGridWeek");
const timezone =
useAppSelector((state) => state.settings.timeZone) ??
@@ -644,7 +638,6 @@ export default function CalendarApp({
calendarRef={calendarRef}
selectedDate={selectedMiniDate}
setSelectedMiniDate={setSelectedMiniDate}
dottedEvents={dottedEvents}
/>
<Box sx={{ mb: 3, mt: 2 }}>
<TempCalendarsInput
src/components/Calendar/MiniCalendar.tsx
+3 -23
View File
@@ -6,27 +6,23 @@ import {
formatDateToYYYYMMDDTHHMMSS,
getCalendarRange,
} from "@/utils/dateUtils";
import type { CalendarApi } from "@fullcalendar/core";
import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
import { DateCalendar } from "@mui/x-date-pickers";
import { AdapterMoment } from "@mui/x-date-pickers/AdapterMoment";
import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
import moment from "moment";
import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
import { useEffect, useState } from "react";
import { useI18n } from "twake-i18n";
import { CalendarEvent } from "@/features/Events/EventsTypes";
import type { CalendarApi } from "@fullcalendar/core";
export function MiniCalendar({
calendarRef,
selectedDate,
setSelectedMiniDate,
dottedEvents,
}: {
calendarRef: React.MutableRefObject<CalendarApi | null>;
selectedDate: Date;
setSelectedMiniDate: (d: Date) => void;
dottedEvents: CalendarEvent[];
}) {
const dispatch = useAppDispatch();
const calendars = useAppSelector((state) => state.calendars);
@@ -102,21 +98,10 @@ export function MiniCalendar({
})()
: false;
const hasEvents = dottedEvents.some((event) => {
const eventDate = new Date(event.start);
return (
eventDate.getFullYear() === date.getFullYear() &&
eventDate.getMonth() === date.getMonth() &&
eventDate.getDate() === date.getDate() &&
event.status !== "CANCELLED"
);
});
const classNames = [
isToday ? "today" : "",
isSelectedDay ? "selectedDay" : "",
isInSelectedWeek ? "selectedWeek" : "",
hasEvents ? "event-dot" : "",
].join(" ");
return {
@@ -144,12 +129,7 @@ export function MiniCalendar({
},
},
"data-testid": `date-${date.getFullYear()}-${date.getMonth()}-${date.getDate()}`,
children: (
<>
{ownerState.day.date()}
{hasEvents && <div className="event-dot" />}
</>
),
children: <>{ownerState.day.date()}</>,
};
},
}}