TF-2042 Add event time information widget

(cherry picked from commit 5bfa21a8c426a794dfc5f1036c00c31f3069f77f)

core/lib/presentation/extensions/color_extension.dart

@@ -194,6 +194,7 @@ extension AppColor on Color {
   static const colorCalendarEventInformationBackground = Color(0x0A000000);
   static const colorCalendarEventInformationStroke = Color(0x1F000000);
   static const colorShadowCalendarDateIcon = Color(0x26000000);
+  static const colorOrganizerMailto = Color(0xFFB3B3B3);
 
   static const mapGradientColor = [
     [Color(0xFF21D4FD), Color(0xFFB721FF)],

lib/features/email/presentation/extensions/calendar_event_extension.dart

@@ -180,6 +180,8 @@ extension CalendarEventExtension on CalendarEvent {
 
   DateTime? get localStartDate => startUtcDate?.value.toLocal();
 
+  DateTime? get localEndDate => endUtcDate?.value.toLocal();
+
   String get monthStartDateAsString {
     if (localStartDate != null) {
       return date_format.formatDate(
@@ -215,4 +217,56 @@ extension CalendarEventExtension on CalendarEvent {
       return '';
     }
   }
+
+  String formatDateTime(DateTime dateTime) {
+    return date_format.formatDate(
+      dateTime,
+      [
+        date_format.DD,
+        ', ',
+        date_format.MM,
+        ' ',
+        date_format.dd,
+        ', ',
+        date_format.yyyy,
+        ' ',
+        date_format.hh,
+        ':',
+        date_format.ss,
+        ' ',
+        date_format.am
+      ],
+      locale: AppUtils.getCurrentDateLocale()
+    );
+  }
+
+  String formatTime(DateTime dateTime) {
+    return date_format.formatDate(
+      dateTime,
+      [
+        date_format.hh,
+        ':',
+        date_format.ss,
+        ' ',
+        date_format.am
+      ],
+      locale: AppUtils.getCurrentDateLocale()
+    );
+  }
+
+  String get dateTimeEventAsString {
+    if (localStartDate != null && localEndDate != null) {
+      final timeStart = formatDateTime(localStartDate!);
+      final timeEnd = DateUtils.isSameDay(localStartDate, localEndDate)
+        ? formatTime(localEndDate!)
+        : formatDateTime(localEndDate!);
+      return '$timeStart - $timeEnd';
+    } else if (localStartDate != null) {
+      return formatDateTime(localStartDate!);
+    } else if (localEndDate != null) {
+      return formatDateTime(localEndDate!);
+    } else {
+      return '';
+    }
+  }
 }

lib/features/email/presentation/styles/event_time_information_widget_styles.dart

@@ -0,0 +1,5 @@
+
+class EventTimeInformationWidgetStyles {
+  static const double maxWidth = 100;
+  static const double textSize = 16;
+}

lib/features/email/presentation/widgets/calendar_event/event_time_information_widget.dart

@@ -0,0 +1,46 @@
+
+import 'package:core/presentation/extensions/color_extension.dart';
+import 'package:core/presentation/utils/style_utils.dart';
+import 'package:flutter/material.dart';
+import 'package:tmail_ui_user/features/email/presentation/styles/event_time_information_widget_styles.dart';
+import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
+
+class EventTimeInformationWidget extends StatelessWidget {
+
+  final String timeEvent;
+
+  const EventTimeInformationWidget({
+    super.key,
+    required this.timeEvent
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Row(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        SizedBox(
+          width: EventTimeInformationWidgetStyles.maxWidth,
+          child: Text(
+            AppLocalizations.of(context).when,
+            style: const TextStyle(
+              fontSize: EventTimeInformationWidgetStyles.textSize,
+              fontWeight: FontWeight.w500,
+              color: AppColor.colorSubTitleEventActionText
+            ),
+          ),
+        ),
+        Expanded(child: Text(
+          timeEvent,
+          overflow: CommonTextStyle.defaultTextOverFlow,
+          softWrap: CommonTextStyle.defaultSoftWrap,
+          style: const TextStyle(
+            fontSize: EventTimeInformationWidgetStyles.textSize,
+            fontWeight: FontWeight.w500,
+            color: Colors.black
+          ),
+        ))
+      ],
+    );
+  }
+}

lib/l10n/intl_messages.arb

@@ -1,5 +1,5 @@
 {
-  "@@last_modified": "2023-07-24T18:44:17.206723",
+  "@@last_modified": "2023-07-26T18:42:34.026265",
   "initializing_data": "Initializing data...",
   "@initializing_data": {
     "type": "text",
@@ -3047,5 +3047,35 @@
     "type": "text",
     "placeholders_order": [],
     "placeholders": {}
+  },
+  "invitationMessageCalendarInformation": " has invited you in to a meeting:",
+  "@invitationMessageCalendarInformation": {
+    "type": "text",
+    "placeholders_order": [],
+    "placeholders": {}
+  },
+  "when": "When",
+  "@when": {
+    "type": "text",
+    "placeholders_order": [],
+    "placeholders": {}
+  },
+  "where": "Where",
+  "@where": {
+    "type": "text",
+    "placeholders_order": [],
+    "placeholders": {}
+  },
+  "who": "Who",
+  "@who": {
+    "type": "text",
+    "placeholders_order": [],
+    "placeholders": {}
+  },
+  "organizer": "Organizer",
+  "@organizer": {
+    "type": "text",
+    "placeholders_order": [],
+    "placeholders": {}
   }
 }

lib/main/localizations/app_localizations.dart

@@ -3143,4 +3143,34 @@ class AppLocalizations {
       'Your counter proposal was declined',
       name: 'messageEventActionBannerAttendeeCounterDeclined');
   }
+
+  String get invitationMessageCalendarInformation {
+    return Intl.message(
+      ' has invited you in to a meeting:',
+      name: 'invitationMessageCalendarInformation');
+  }
+
+  String get when {
+    return Intl.message(
+      'When',
+      name: 'when');
+  }
+
+  String get where {
+    return Intl.message(
+      'Where',
+      name: 'where');
+  }
+
+  String get who {
+    return Intl.message(
+      'Who',
+      name: 'who');
+  }
+
+  String get organizer {
+    return Intl.message(
+      'Organizer',
+      name: 'organizer');
+  }
 }