TF-248 Update list email, email content for tablet

lib/features/email/presentation/widgets/app_bar_mail_widget_builder.dart

@@ -57,12 +57,13 @@ class AppBarMailWidgetBuilder {
           crossAxisAlignment: CrossAxisAlignment.center,
           mainAxisAlignment: MainAxisAlignment.end,
           children: [
-            if (!_responsiveUtils.isDesktop(_context) || Get.currentRoute != AppRoutes.MAILBOX_DASHBOARD)
+            if ((!_responsiveUtils.isDesktop(_context) && !_responsiveUtils.isTabletLarge(_context))
+                || Get.currentRoute != AppRoutes.MAILBOX_DASHBOARD)
               Expanded(child: Row(
                 crossAxisAlignment: CrossAxisAlignment.center,
                 mainAxisAlignment: MainAxisAlignment.start,
                 children:[_buildBackButton()])),
-            _buildListOptionButton(),
+            if (_presentationEmail != null) _buildListOptionButton(),
           ]
         )
       )
@@ -94,31 +95,31 @@ class AppBarMailWidgetBuilder {
         //       _onBackActionClick!();
         //     }
         //   }),
-        IconButton(
-          key: Key('button_mark_as_unread_email'),
-          color: AppColor.baseTextColor,
-          icon: SvgPicture.asset(_imagePaths.icEyeDisable, color: AppColor.baseTextColor, fit: BoxFit.fill),
-          onPressed: () {
-            if (_onUnreadEmailActionClick != null && _presentationEmail != null && _presentationEmail!.isReadEmail()) {
-              _onUnreadEmailActionClick!(_presentationEmail!);
-            }
-          }),
         IconButton(
           key: Key('button_mark_as_star_email'),
           icon: SvgPicture.asset(
-            (_presentationEmail != null && _presentationEmail!.isFlaggedEmail())
-              ? _imagePaths.icFlagged
-              : _imagePaths.icFlag,
-            fit: BoxFit.fill),
+              (_presentationEmail != null && _presentationEmail!.isFlaggedEmail())
+                  ? _imagePaths.icStar
+                  : _imagePaths.icUnStar,
+              fit: BoxFit.fill),
           onPressed: () {
             if (_markAsStarActionClick != null && _presentationEmail != null) {
               _markAsStarActionClick!(_presentationEmail!);
             }
           }),
+        IconButton(
+          key: Key('button_mark_as_unread_email'),
+          color: AppColor.baseTextColor,
+          icon: SvgPicture.asset(_imagePaths.icUnreadEmail, fit: BoxFit.fill),
+          onPressed: () {
+            if (_onUnreadEmailActionClick != null && _presentationEmail != null && _presentationEmail!.isReadEmail()) {
+              _onUnreadEmailActionClick!(_presentationEmail!);
+            }
+          }),
         IconButton(
           key: Key('button_move_to_mailbox_email'),
           color: AppColor.baseTextColor,
-          icon: SvgPicture.asset(_imagePaths.icFolder, color: AppColor.baseTextColor, fit: BoxFit.fill),
+          icon: SvgPicture.asset(_imagePaths.icMoveEmail, fit: BoxFit.fill),
           onPressed: () {
             if (_onMoveToMailboxActionClick != null && _presentationEmail != null) {
               _onMoveToMailboxActionClick!(_presentationEmail!);

lib/features/email/presentation/widgets/attachments_place_holder_loading_widget.dart

@@ -75,15 +75,13 @@ class _AttachmentsPlaceHolderLoadingState extends State<AttachmentsPlaceHolderLo
             children: [
               Row(children: [
                 _placeHolderAttachment(context),
-                SizedBox(width: 16),
-                _placeHolderAttachment(context),
-                if (!widget.responsiveUtils.isMobileDevice(context))
+                if (widget.responsiveUtils.isDesktop(context))
                   SizedBox(width: 16),
-                if (!widget.responsiveUtils.isMobileDevice(context))
+                if (widget.responsiveUtils.isDesktop(context))
                   _placeHolderAttachment(context),
-                if (!widget.responsiveUtils.isMobileDevice(context) && widget.responsiveUtils.isTablet(context))
+                if (widget.responsiveUtils.isDesktop(context))
                   SizedBox(width: 16),
-                if (!widget.responsiveUtils.isMobileDevice(context) && widget.responsiveUtils.isTablet(context))
+                if (widget.responsiveUtils.isDesktop(context))
                   _placeHolderAttachment(context),
               ]),
             ],

lib/features/email/presentation/widgets/bottom_bar_mail_widget_builder.dart

@@ -1,6 +1,5 @@
 import 'package:core/core.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter/widgets.dart';
 import 'package:model/model.dart';
 import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
 
@@ -11,6 +10,7 @@ class BottomBarMailWidgetBuilder {
   final BuildContext _context;
   final ImagePaths _imagePaths;
   final ResponsiveUtils _responsiveUtils;
+  final PresentationEmail? _presentationEmail;
 
   OnPressEmailActionClick? _onPressEmailActionClick;
 
@@ -18,6 +18,7 @@ class BottomBarMailWidgetBuilder {
     this._context,
     this._imagePaths,
     this._responsiveUtils,
+    this._presentationEmail,
   );
 
   void addOnPressEmailAction(OnPressEmailActionClick onPressEmailActionClick) {
@@ -31,7 +32,7 @@ class BottomBarMailWidgetBuilder {
       color: Colors.white,
       child: MediaQuery(
         data: MediaQueryData(padding: EdgeInsets.zero),
-        child: _buildListOptionButton()
+        child: _presentationEmail != null ? _buildListOptionButton() : SizedBox.shrink()
       )
     );
   }
@@ -41,24 +42,51 @@ class BottomBarMailWidgetBuilder {
       mainAxisAlignment: MainAxisAlignment.spaceAround,
       crossAxisAlignment: CrossAxisAlignment.center,
       children: [
-        (ButtonBuilder(_imagePaths.icReplyAll)
+        (ButtonBuilder(_imagePaths.icReplyAllV2)
             ..key(Key('button_reply_all_message'))
+            ..size(20)
+            ..paddingIcon(EdgeInsets.only(
+                top: _responsiveUtils.isMobileDevice(_context) ? 10 : 16,
+                bottom: _responsiveUtils.isMobileDevice(_context) ? 8 : 16,
+                right: 5))
+            ..textStyle(TextStyle(
+                fontWeight: FontWeight.w500,
+                fontSize: _responsiveUtils.isMobileDevice(_context) ? 13 : 16,
+                color: AppColor.colorTextButton))
             ..onPressActionClick(() {
               if (_onPressEmailActionClick != null) {
                 _onPressEmailActionClick!(EmailActionType.replyAll);
               }})
             ..text(AppLocalizations.of(_context).reply_all, isVertical: _responsiveUtils.isMobile(_context)))
           .build(),
-        (ButtonBuilder(_imagePaths.icReply)
+        (ButtonBuilder(_imagePaths.icReplyV2)
             ..key(Key('button_reply_message'))
+            ..size(20)
+            ..paddingIcon(EdgeInsets.only(
+                top: _responsiveUtils.isMobileDevice(_context) ? 10 : 16,
+                bottom: _responsiveUtils.isMobileDevice(_context) ? 8 : 16,
+                right: 5))
+            ..textStyle(TextStyle(
+                fontWeight: FontWeight.w500,
+                fontSize: _responsiveUtils.isMobileDevice(_context) ? 13 : 16,
+                color: AppColor.colorTextButton))
             ..onPressActionClick(() {
               if (_onPressEmailActionClick != null) {
                 _onPressEmailActionClick!(EmailActionType.reply);
               }})
             ..text(AppLocalizations.of(_context).reply, isVertical: _responsiveUtils.isMobile(_context)))
           .build(),
-        (ButtonBuilder(_imagePaths.icForward)
+        (ButtonBuilder(_imagePaths.icForwardV2)
             ..key(Key('button_forward_message'))
+            ..size(20)
+            ..paddingIcon(EdgeInsets.only(
+                top: _responsiveUtils.isMobileDevice(_context) ? 10 : 16,
+                bottom: _responsiveUtils.isMobileDevice(_context) ? 8 : 16,
+                right: 5))
+            ..textStyle(TextStyle(
+                fontWeight: FontWeight.w500,
+                fontSize: _responsiveUtils.isMobileDevice(_context) ? 13 : 16,
+                color: AppColor.colorTextButton))
             ..onPressActionClick(() {
               if (_onPressEmailActionClick != null) {
                 _onPressEmailActionClick!(EmailActionType.forward);

lib/features/email/presentation/widgets/sender_and_receiver_information_tile_builder.dart

@@ -43,36 +43,51 @@ class SenderAndReceiverInformationTileBuilder {
       child: MediaQuery(
         data: MediaQueryData(padding: EdgeInsets.zero),
         child: ListTile(
+          contentPadding: EdgeInsets.zero,
           leading: Transform(
-            transform: Matrix4.translationValues(-15.0, -8.0, 0.0),
+            transform: Matrix4.translationValues(0.0, 0.0, 0.0),
             child: (AvatarBuilder()
                 ..text('${_presentationEmail!.getAvatarText()}')
+                ..textColor(Colors.white)
+                ..avatarColor(_presentationEmail?.avatarColors)
                 ..size(40))
               // .iconStatus(_imagePaths.icOffline)
               .build()),
           title: Transform(
-            transform: Matrix4.translationValues(-15.0, 0.0, 0.0),
-            child: Text(
-              '${AppLocalizations.of(_context).from_email_address_prefix}: ${_presentationEmail!.getSenderName()}',
-              style: TextStyle(fontSize: 16, color: AppColor.nameUserColor, fontWeight: FontWeight.w500),
-            )),
+            transform: Matrix4.translationValues(0.0, 0.0, 0.0),
+            child: Row(children: [
+              Expanded(child: Text(
+                '${_presentationEmail!.getSenderName()}',
+                style: TextStyle(fontSize: 17, color: AppColor.colorNameEmail, fontWeight: FontWeight.w500),
+              )),
+              Padding(
+                padding: EdgeInsets.only(left: 8),
+                child: Text(
+                  '${_presentationEmail!.getReceivedAt(Localizations.localeOf(_context).toLanguageTag())}',
+                  maxLines: 1,
+                  overflow:TextOverflow.ellipsis,
+                  style: TextStyle(fontSize: 15, color: AppColor.colorContentEmail)))
+            ])),
           subtitle: Transform(
-            transform: Matrix4.translationValues(-15.0, 0.0, 0.0),
-            child: Column(
-              mainAxisAlignment: MainAxisAlignment.center,
-              crossAxisAlignment: CrossAxisAlignment.start,
-              children: [
-                if (_presentationEmail!.to.numberEmailAddress() > 0) _buildAddressToReceiverWidget(),
-                if (_presentationEmail!.cc.numberEmailAddress() > 0) _buildAddressCcReceiverWidget(),
-                if (_presentationEmail!.bcc.numberEmailAddress() > 0) _buildAddressBccReceiverWidget(),
+            transform: Matrix4.translationValues(0.0, 0.0, 0.0),
+            child: Row(children: [
+              Expanded(child: Column(
+                mainAxisAlignment: MainAxisAlignment.center,
+                crossAxisAlignment: CrossAxisAlignment.start,
+                children: [
+                  if (_presentationEmail!.to.numberEmailAddress() > 0) _buildAddressToReceiverWidget(),
+                  if (_presentationEmail!.cc.numberEmailAddress() > 0) _buildAddressCcReceiverWidget(),
+                  if (_presentationEmail!.bcc.numberEmailAddress() > 0) _buildAddressBccReceiverWidget(),
+                ],
+              )),
+              if (_presentationEmail?.hasAttachment == true)
                 Padding(
-                  padding: EdgeInsets.only(top: 6),
-                  child: Text(
-                    '${_presentationEmail!.getReceivedAt(Localizations.localeOf(_context).toLanguageTag(), pattern: 'dd/MM/yyyy h:mm a')}',
-                    style: TextStyle(fontSize: 12, color: AppColor.baseTextColor),
-                  ))
-              ],
-            ))
+                    padding: EdgeInsets.only(left: 8),
+                    child: (ButtonBuilder(_imagePaths.icAttachment)
+                        ..paddingIcon(EdgeInsets.zero)
+                        ..size(16))
+                      .build()),
+            ]))
         )
       )
     );