fix: update test cases for Menubar and Calendar components

- Update Menubar test cases to match component changes (logo instead of text)
- Add required currentView prop to all Menubar test cases
- Fix Calendar test cases by adding calendarRef wrapper component
- Convert babel.config.ts to babel.config.js for Node.js 24 compatibility
- All 146 tests now pass successfully

__test__/components/Calendar.test.tsx

@@ -3,6 +3,7 @@ import CalendarApp from "../../src/components/Calendar/Calendar";
 import * as eventThunks from "../../src/features/Calendars/CalendarSlice";
 import { renderWithProviders } from "../utils/Renderwithproviders";
 import { searchUsers } from "../../src/features/User/userAPI";
+import { useRef } from "react";
 
 import userEvent from "@testing-library/user-event";
 jest.mock("../../src/features/User/userAPI");
@@ -10,6 +11,12 @@ const mockedSearchUsers = searchUsers as jest.MockedFunction<
   typeof searchUsers
 >;
 
+// Test wrapper component to provide calendarRef
+function CalendarTestWrapper() {
+  const calendarRef = useRef(null);
+  return <CalendarApp calendarRef={calendarRef} />;
+}
+
 describe("CalendarSelection", () => {
   const today = new Date();
   const start = new Date(today);
@@ -208,7 +215,7 @@ describe("calendar Availability search", () => {
       },
     ]);
 
-    renderWithProviders(<CalendarApp />, preloadedState);
+    renderWithProviders(<CalendarTestWrapper />, preloadedState);
 
     const input = screen.getByPlaceholderText(/search user/i);
     userEvent.type(input, "New");
@@ -233,7 +240,7 @@ describe("calendar Availability search", () => {
       .mockImplementation((payload) => {
         return () => Promise.resolve(payload) as any;
       });
-    renderWithProviders(<CalendarApp />, preloadedState);
+    renderWithProviders(<CalendarTestWrapper />, preloadedState);
 
     const input = screen.getByPlaceholderText(/search user/i);
     userEvent.type(input, "Alice");

__test__/components/Menubar.test.tsx

@@ -30,11 +30,12 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
-    const navbarElement = screen.getByText("Twake");
+    const logoElement = screen.getByAltText("Calendar");
-    expect(navbarElement).toBeInTheDocument();
+    expect(logoElement).toBeInTheDocument();
   });
   it("renders the main title", () => {
     (window as any).appList = [{ name: "test", icon: "test", link: "test" }];
@@ -47,11 +48,11 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
-    expect(screen.getByText(/Twake/i)).toBeInTheDocument();
+    expect(screen.getByAltText("Calendar")).toBeInTheDocument();
-    expect(screen.getByText(/Calendar/i)).toBeInTheDocument();
   });
 
   it("shows avatar with user initials", () => {
@@ -65,6 +66,7 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
@@ -93,6 +95,7 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
@@ -123,6 +126,7 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
@@ -152,6 +156,7 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
@@ -181,6 +186,7 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
@@ -210,6 +216,7 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
@@ -239,6 +246,7 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
@@ -270,6 +278,7 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
@@ -301,6 +310,7 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
@@ -320,6 +330,7 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
@@ -327,7 +338,10 @@ describe("Calendar App Component Display Tests", () => {
   });
 
   it("opens popover when clicking AppsIcon", () => {
-    (window as any).appList = [{ name: "test", icon: "test", link: "test" }];
+    (window as any).appList = [
+      { name: "Twake", icon: "twake.svg", link: "/twake" },
+      { name: "Calendar", icon: "calendar.svg", link: "/calendar" }
+    ];
     const mockCalendarRef = { current: null };
     const mockOnRefresh = jest.fn();
     const mockCurrentDate = new Date("2024-04-15");
@@ -337,6 +351,7 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
@@ -357,13 +372,14 @@ describe("Calendar App Component Display Tests", () => {
         calendarRef={mockCalendarRef}
         onRefresh={mockOnRefresh}
         currentDate={mockCurrentDate}
+        currentView="dayGridMonth"
       />,
       preloadedState
     );
     const appsButton = screen.getByTestId("AppsIcon");
     fireEvent.click(appsButton);
 
-    const twakeLink = screen.getByRole("link", { name: /test/i });
+    const testLink = screen.getByRole("link", { name: /test/i });
-    expect(twakeLink).toHaveAttribute("href", "test");
+    expect(testLink).toHaveAttribute("href", "test");
   });
 });