From c997bd0127c97fef438dc2f0192ce209cccab606 Mon Sep 17 00:00:00 2001
From: Juan Estrella <juan.estrella@finos.org>
Date: Mon, 8 Apr 2024 19:53:58 +0200
Subject: [PATCH 1/3] Add timezone to event details popup

---
 src/App.css | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/App.css b/src/App.css
index 6fbfee792ae..9f5dcf8b516 100644
--- a/src/App.css
+++ b/src/App.css
@@ -70,6 +70,13 @@ button.fc-button.finos-calendar-event-details-close img{
   gap: 5px;
 }
 
+.event-timeZone{
+  font-size: 14px;
+  margin-bottom: 6px;
+  display: flex;
+  gap: 5px;
+}
+
 .event-location{
   display:flex;
   gap: 5px;
@@ -155,4 +162,4 @@ button.fc-button.finos-calendar-event-details-close img{
   .finos-calendar-event-details a{
     color: #343;
   }
-}
\ No newline at end of file
+}

From 144c79facf95f531788cb8e3adaff2f0403e95ee Mon Sep 17 00:00:00 2001
From: Juan Estrella <juan.estrella@finos.org>
Date: Mon, 8 Apr 2024 19:56:35 +0200
Subject: [PATCH 2/3] add timezone to event details popup

---
 src/App.jsx | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/App.jsx b/src/App.jsx
index 87275288614..4693cb49ea2 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -5,7 +5,7 @@ import FullCalendar from '@fullcalendar/react';
 import rrulePlugin from '@fullcalendar/rrule';
 import timeGridPlugin from '@fullcalendar/timegrid';
 
-import { mdiCalendarRange, mdiClose, mdiMapMarkerOutline } from '@mdi/js';
+import { mdiCalendarRange, mdiClose, mdiMapMarkerOutline, mdiClock } from '@mdi/js';
 import Icon from '@mdi/react';
 import parse from 'html-react-parser';
 import { createRef, useCallback, useEffect, useMemo, useState } from 'react';
@@ -136,6 +136,7 @@ function App() {
     const toDate = printDate(eventDetails.end);
     const fromTime = printTime(eventDetails.start);
     const toTime = printTime(eventDetails.end);
+    const timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
     let eventTime = '';
     if (fromDate == toDate) {
       eventTime = fromDate + ' ' + fromTime + ' - ' + toTime;
@@ -213,6 +214,12 @@ function App() {
           </div>
           <div>{eventTime}</div>
         </div>
+        <div className="event-timeZone">
+          <div className="icon">
+            <Icon path={mdiClock} size={0.75} />
+          </div>
+          <div>Time Zone: {timeZone}</div>
+        </div>
         {eventLocation && (
           <div className="event-location">
             <div className="icon">

From b4efd15f0ee84e35a2cd10e945013d2c273aed7c Mon Sep 17 00:00:00 2001
From: Juan Estrella <juan.estrella@finos.org>
Date: Tue, 9 Apr 2024 10:39:00 +0200
Subject: [PATCH 3/3] Update App.jsx

---
 src/App.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/App.jsx b/src/App.jsx
index 4693cb49ea2..c5bdd8fe837 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -5,7 +5,7 @@ import FullCalendar from '@fullcalendar/react';
 import rrulePlugin from '@fullcalendar/rrule';
 import timeGridPlugin from '@fullcalendar/timegrid';
 
-import { mdiCalendarRange, mdiClose, mdiMapMarkerOutline, mdiClock } from '@mdi/js';
+import { mdiCalendarRange, mdiClock, mdiClose, mdiMapMarkerOutline } from '@mdi/js';
 import Icon from '@mdi/react';
 import parse from 'html-react-parser';
 import { createRef, useCallback, useEffect, useMemo, useState } from 'react';