From 481b59da2382df0ee53c56c4ec3a910f1b29a639 Mon Sep 17 00:00:00 2001
From: Camille Moussu <66134347+Eriikah@users.noreply.github.com>
Date: Wed, 8 Oct 2025 11:29:20 +0200
Subject: [PATCH] [#181] removed numbers in week banner (#195)

Co-authored-by: Camille Moussu <cmoussu@linagora.com>
---
 __test__/components/Calendar.test.tsx | 35 +++++++++++++++++++++++++++
 src/components/Calendar/Calendar.tsx  | 16 ++++++------
 2 files changed, 44 insertions(+), 7 deletions(-)

diff --git a/__test__/components/Calendar.test.tsx b/__test__/components/Calendar.test.tsx
index 7560a5a..838c7f6 100644
--- a/__test__/components/Calendar.test.tsx
+++ b/__test__/components/Calendar.test.tsx
@@ -6,6 +6,7 @@ import { searchUsers } from "../../src/features/User/userAPI";
 import { useRef } from "react";
 
 import userEvent from "@testing-library/user-event";
+import CalendarLayout from "../../src/components/Calendar/CalendarLayout";
 jest.mock("../../src/features/User/userAPI");
 const mockedSearchUsers = searchUsers as jest.MockedFunction<
   typeof searchUsers
@@ -267,4 +268,38 @@ describe("calendar Availability search", () => {
 
     expect(checkbox).not.toBeChecked();
   });
+
+  it("BUGFIX: monthview doesn't show days numbers in banner", async () => {
+    renderWithProviders(<CalendarLayout />, {
+      user: preloadedState.user,
+      calendars: {
+        list: { "user1/cal1": preloadedState.calendars.list["user1/cal1"] },
+        pending: false,
+      },
+    });
+
+    const calendarRef = (window as any).__calendarRef;
+
+    await waitFor(() => {
+      expect(calendarRef.current).not.toBeNull();
+    });
+
+    const calendarApi = calendarRef.current;
+
+    calendarApi.changeView("dayGridMonth");
+    await waitFor(() => {
+      expect(screen.queryAllByRole("columnheader").length).toBe(7);
+    });
+
+    const dayNumbers = screen.getAllByRole("columnheader");
+    expect(dayNumbers.length).toBeGreaterThan(0);
+
+    const dayNumbersWithContent = dayNumbers.filter((cell) => {
+      const dayNum = cell.querySelector(
+        ".fc-daygrid-day-number, .fc-daygrid-day-top"
+      );
+      return dayNum && dayNum.textContent && /\d/.test(dayNum.textContent);
+    });
+    expect(dayNumbersWithContent.length).toBe(0);
+  });
 });
diff --git a/src/components/Calendar/Calendar.tsx b/src/components/Calendar/Calendar.tsx
index 5eecc70..1e7edb0 100644
--- a/src/components/Calendar/Calendar.tsx
+++ b/src/components/Calendar/Calendar.tsx
@@ -404,13 +404,15 @@ export default function CalendarApp({
             return (
               <div className="fc-daygrid-day-top">
                 <small>{weekDay}</small>
-                <span
-                  className={`fc-daygrid-day-number ${
-                    arg.isToday ? "current-date" : ""
-                  }`}
-                >
-                  {date}
-                </span>
+                {arg.view.type !== "dayGridMonth" && (
+                  <span
+                    className={`fc-daygrid-day-number ${
+                      arg.isToday ? "current-date" : ""
+                    }`}
+                  >
+                    {date}
+                  </span>
+                )}
               </div>
             );
           }}