Internal: Implements timezone handling based on user and platform configuration - refs BT#22706

Author: christianbeeznest

assets/vue/composables/formatDate.js

@@ -1,13 +1,29 @@
 import { DateTime } from "luxon"
 import { useLocale } from "./locale"
+import { usePlatformConfig } from "../store/platformConfig"
+import { useSecurityStore } from "../store/securityStore"
 
 export function useFormatDate() {
   const { appParentLocale } = useLocale()
+  const platformConfigStore = usePlatformConfig()
+  const securityStore = useSecurityStore()
+
+  function getCurrentTimezone() {
+    const allowUserTimezone = platformConfigStore.getSetting("profile.use_users_timezone") === "true"
+    const userTimezone = securityStore.user?.timezone
+    const platformTimezone = platformConfigStore.getSetting("platform.timezone")
+
+    if (allowUserTimezone && userTimezone) {
+      return userTimezone
+    }
+
+    if (platformTimezone && platformTimezone !== "false") {
+      return platformTimezone
+    }
+
+    return Intl.DateTimeFormat().resolvedOptions().timeZone
+  }
 
-  /**
-   * @param {Date|string} datetime
-   * @returns {DateTime|null}
-   */
   function getDateTimeObject(datetime) {
     if (!datetime) {
       return null
@@ -16,16 +32,18 @@ export function useFormatDate() {
     let dt
 
     if (typeof datetime === "string") {
-      dt = DateTime.fromISO(datetime)
-    } else if (typeof datetime === "object") {
-      dt = DateTime.fromJSDate(datetime)
+      dt = DateTime.fromISO(datetime, { zone: "utc" })
+    } else if (datetime instanceof Date) {
+      dt = DateTime.fromJSDate(datetime, { zone: "utc" })
+    } else {
+      return null
     }
 
     if (!dt.isValid) {
       return null
     }
 
-    return dt.setLocale(appParentLocale.value)
+    return dt.setZone(getCurrentTimezone()).setLocale(appParentLocale.value)
   }
 
   const abbreviatedDatetime = (datetime) =>
@@ -34,10 +52,12 @@ export function useFormatDate() {
       month: "long",
     })
 
-  const relativeDatetime = (datetime) => getDateTimeObject(datetime)?.toRelative()
+  const relativeDatetime = (datetime) =>
+    getDateTimeObject(datetime)?.toRelative()
 
   return {
     abbreviatedDatetime,
     relativeDatetime,
+    getCurrentTimezone,
   }
 }

assets/vue/utils/dates.js

@@ -1,15 +1,30 @@
-const { DateTime } = require("luxon")
+import { DateTime } from "luxon"
+import { useFormatDate } from "../composables/formatDate"
 
-const formatDateTime = function (date) {
-  if (!date) return null
+const { getCurrentTimezone } = useFormatDate()
 
-  return DateTime(date).format("DD/MM/YYYY")
+/**
+ * Format a JS Date object to string using the current or provided timezone.
+ * @param {Date} date - JavaScript Date object
+ * @param {string} [timezone] - Optional timezone (e.g. "America/Lima")
+ * @returns {string}
+ */
+const formatDateTime = function (date, timezone) {
+  if (!date) return ""
+  const tz = timezone || getCurrentTimezone()
+  return DateTime.fromJSDate(date, { zone: "utc" }).setZone(tz).toFormat("dd/LL/yyyy HH:mm")
 }
 
-const formatDateTimeFromISO = function (dateStr) {
+/**
+ * Format an ISO string to readable string using the current or provided timezone.
+ * @param {string} dateStr - ISO date string (e.g. "2025-06-17T14:00:00Z")
+ * @param {string} [timezone] - Optional timezone
+ * @returns {string}
+ */
+const formatDateTimeFromISO = function (dateStr, timezone) {
   if (!dateStr) return ""
-
-  return DateTime.fromISO(dateStr).toFormat("dd/LL/yyyy HH:mm")
+  const tz = timezone || getCurrentTimezone()
+  return DateTime.fromISO(dateStr, { zone: "utc" }).setZone(tz).toFormat("dd/LL/yyyy HH:mm")
 }
 
 export { formatDateTime, formatDateTimeFromISO }

assets/vue/views/ccalendarevent/CCalendarEventList.vue

@@ -150,16 +150,15 @@ import { useCalendarEvent } from "../../composables/calendar/calendarEvent"
 import resourceLinkService from "../../services/resourceLinkService"
 import { useSecurityStore } from "../../store/securityStore"
 import { useCourseSettings } from "../../store/courseSettingStore"
+import { DateTime } from "luxon"
 
 const store = useStore()
 const securityStore = useSecurityStore()
 const confirm = useConfirm()
 const cidReqStore = useCidReqStore()
 
 const { course, session, group } = storeToRefs(cidReqStore)
-
-const { abbreviatedDatetime } = useFormatDate()
-
+const { abbreviatedDatetime, getCurrentTimezone } = useFormatDate()
 const { showAddButton } = useCalendarActionButtons()
 
 const { isEditableByUser, allowSubscribeToEvent, allowUnsubscribeToEvent } = useCalendarEvent()
@@ -235,13 +234,15 @@ async function getCalendarEvents({ start, end }) {
   const calendarEvents = await cCalendarEventService.findAll({ params }).then((response) => response.json())
 
   return calendarEvents["hydra:member"].map((event) => {
-    let color = event.color || "#007BFF"
+    const timezone = getCurrentTimezone()
+    const start = DateTime.fromISO(event.startDate, { zone: "utc" }).setZone(timezone)
+    const end = DateTime.fromISO(event.endDate, { zone: "utc" }).setZone(timezone)
 
     return {
       ...event,
-      start: event.startDate,
-      end: event.endDate,
-      color,
+      start: start.toString(),
+      end: end.toString(),
+      color: event.color || "#007BFF",
     }
   })
 }
@@ -257,16 +258,9 @@ const showAddEventDialog = () => {
 
   dialog.value = true
 }
-
-const goToMyStudentsSchedule = () => {
-  window.location.href = "/main/calendar/planification.php"
-}
-
-const goToSessionPanning = () => {
-  window.location.href = "/main/my_space/calendar_plan.php"
-}
-
+const timezone = getCurrentTimezone()
 const calendarOptions = ref({
+  timeZone: timezone,
   plugins: [dayGridPlugin, timeGridPlugin, interactionPlugin],
   locales: allLocales,
   locale: calendarLocale?.code ?? "en-GB",

public/main/inc/lib/extra_field.lib.php

@@ -20,6 +20,7 @@ class ExtraField extends Model
     public const FIELD_TYPE_DOUBLE_SELECT = 8;
     public const FIELD_TYPE_DIVIDER = 9;
     public const FIELD_TYPE_TAG = 10;
+    public const FIELD_TYPE_TIMEZONE = 11;
     public const FIELD_TYPE_SOCIAL_PROFILE = 12;
     public const FIELD_TYPE_CHECKBOX = 13;
     public const FIELD_TYPE_MOBILE_PHONE_NUMBER = 14;
@@ -1572,6 +1573,16 @@ public function set_extra_fields_in_form(
                             }
                         }
 
+                        break;
+                    case self::FIELD_TYPE_TIMEZONE:
+                        $form->addSelect(
+                            'extra_'.$variable,
+                            $field_details['display_text'],
+                            api_get_timezones(),
+                        );
+                        if ($freezeElement) {
+                            $form->freeze('extra_'.$variable);
+                        }
                         break;
                     case self::FIELD_TYPE_SOCIAL_PROFILE:
                         // get the social network's favicon
@@ -1984,6 +1995,7 @@ public static function get_extra_fields_by_handler($handler)
         $types[self::FIELD_TYPE_DOUBLE_SELECT] = get_lang('Double select');
         $types[self::FIELD_TYPE_DIVIDER] = get_lang('Visual divider');
         $types[self::FIELD_TYPE_TAG] = get_lang('User tag');
+        $types[self::FIELD_TYPE_TIMEZONE] = get_lang('Timezone');
         $types[self::FIELD_TYPE_SOCIAL_PROFILE] = get_lang('Social network link');
         $types[self::FIELD_TYPE_MOBILE_PHONE_NUMBER] = get_lang('Mobile phone number');
         $types[self::FIELD_TYPE_CHECKBOX] = get_lang('Checkbox');

src/CoreBundle/Controller/PlatformConfigurationController.php

@@ -112,6 +112,7 @@ public function list(SettingsManager $settingsManager): Response
                 'course.show_courses_descriptions_in_catalog',
                 'session.session_automatic_creation_user_id',
                 'session.session_list_view_remaining_days',
+                'profile.use_users_timezone',
             ];
 
             $user = $this->userHelper->getCurrent();

src/CoreBundle/Controller/SocialController.php

@@ -552,13 +552,12 @@ private function getExtraFieldBlock(
                         ExtraField::USER_FIELD_TYPE
                     );
                     if (!empty($extraFieldOptions)) {
-                        $fieldValue = implode(
-                            ', ',
-                            array_map(
-                                fn (ExtraFieldOptions $opt) => $opt->getDisplayText(),
-                                $extraFieldOptions
-                            )
+                        $optionTexts = array_map(
+                            fn (ExtraFieldOptions $option) => $option['display_text'],
+                            $extraFieldOptions
                         );
+                        $fieldValue = implode(', ', $optionTexts);
+                        $fieldValue = $extraFieldOptions->getDisplayText();
                     }
 
                     break;

src/CoreBundle/Form/ExtraFieldType.php

@@ -93,6 +93,7 @@ public function buildForm(FormBuilderInterface $builder, array $options): void
             switch ($extraField->getValueType()) {
                 case \ExtraField::FIELD_TYPE_DOUBLE_SELECT:
                 case \ExtraField::FIELD_TYPE_DIVIDER:
+                case \ExtraField::FIELD_TYPE_TIMEZONE:
                 case \ExtraField::FIELD_TYPE_FILE_IMAGE:
                 case \ExtraField::FIELD_TYPE_FILE:
                 case \ExtraField::FIELD_TYPE_LETTERS_SPACE: