fix failing test

PalisadoesFoundation · Jan 15, 2025 · 6e1f485 · 6e1f485
1 parent 5ca7439
commit 6e1f485
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 35 deletions.
diff --git a/src/components/EventCalendar/EventCalendar.tsx b/src/components/EventCalendar/EventCalendar.tsx
@@ -198,11 +198,11 @@ const Calendar: React.FC<InterfaceCalendarProps> = ({
     }
   };
 
-  // const handleTodayButton = (): void => {
-  //   setCurrentYear(today.getFullYear());
-  //   setCurrentMonth(today.getMonth());
-  //   setCurrentDate(today.getDate());
-  // };
+  const handleTodayButton = (): void => {
+    setCurrentYear(today.getFullYear());
+    setCurrentMonth(today.getMonth());
+    setCurrentDate(today.getDate());
+  };
 
   const timezoneString = `UTC${
     new Date().getTimezoneOffset() > 0 ? '-' : '+'
@@ -513,44 +513,45 @@ const Calendar: React.FC<InterfaceCalendarProps> = ({
     <div className={styles.calendar}>
       {viewType != ViewType.YEAR && (
         <div className={styles.calendar__header}>
-          <Button
-            variant="outlined"
-            className={styles.buttonEventCalendar}
-            onClick={
-              viewType == ViewType.DAY ? handlePrevDate : handlePrevMonth
-            }
-            data-testid="prevmonthordate"
-          >
-            <ChevronLeft />
-          </Button>
+          <div className={styles.calender_month}>
+            <Button
+              variant="outlined"
+              className={styles.buttonEventCalendar}
+              onClick={
+                viewType == ViewType.DAY ? handlePrevDate : handlePrevMonth
+              }
+              data-testid="prevmonthordate"
+            >
+              <ChevronLeft />
+            </Button>
 
-          <div
-            className={styles.calendar__header_month}
-            data-testid="current-date"
-          >
-            {viewType == ViewType.DAY ? `${currentDate}` : ``} {currentYear}{' '}
-            <div>{months[currentMonth]}</div>
+            <div
+              className={styles.calendar__header_month}
+              data-testid="current-date"
+            >
+              {viewType == ViewType.DAY ? `${currentDate}` : ``} {currentYear}{' '}
+              <div>{months[currentMonth]}</div>
+            </div>
+            <Button
+              variant="outlined"
+              className={styles.buttonEventCalendar}
+              onClick={
+                viewType == ViewType.DAY ? handleNextDate : handleNextMonth
+              }
+              data-testid="nextmonthordate"
+            >
+              <ChevronRight />
+            </Button>
           </div>
-          <Button
-            variant="outlined"
-            className={styles.buttonEventCalendar}
-            onClick={
-              viewType == ViewType.DAY ? handleNextDate : handleNextMonth
-            }
-            data-testid="nextmonthordate"
-          >
-            <ChevronRight />
-          </Button>
-          {/* <div>
+          <div>
             <Button
               className={styles.editButton}
               onClick={handleTodayButton}
               data-testid="today"
-
             >
               Today
             </Button>
-          </div> */}
+          </div>
         </div>
       )}
       <div className={`${styles.calendar__scroll} customScroll`}>

diff --git a/src/screens/UserPortal/Events/Events.spec.tsx b/src/screens/UserPortal/Events/Events.spec.tsx
@@ -650,7 +650,7 @@ describe('Testing Events Screen [User Portal]', () => {
     const calenderView = 'Calendar View';
 
     expect(screen.queryAllByText(calenderView)).not.toBeNull();
-    expect(screen.getByText('Sun')).toBeInTheDocument();
+    expect(screen.getByText('Sunday')).toBeInTheDocument();
   });
 
   it('Testing DatePicker and TimePicker', async () => {

diff --git a/src/style/app.module.css b/src/style/app.module.css
@@ -5426,9 +5426,16 @@ button[data-testid='createPostBtn'] {
 .calendar__header {
   display: flex;
   align-items: center;
+  justify-content: space-between;
+  margin-right: 50px;
   /* margin: 2rem 10px 0px 10px; */
 }
 
+.calender_month {
+  display: flex;
+  align-items: center;
+}
+
 .calendar__header_month {
   margin: 0.5rem;
   color: var(--grey-dark);