TF-78 Create action bar and context menu when multiple selected email

lib/features/thread/presentation/widgets/app_bar_thread_select_mode_active_builder.dart

@@ -0,0 +1,111 @@
+
+import 'package:core/core.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/widgets.dart';
+import 'package:model/email/presentation_email.dart';
+import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
+
+typedef OnCloseActionClick = void Function();
+typedef OnUnreadEmailActionClick = void Function(List<PresentationEmail> listEmail);
+typedef OnRemoveEmailActionClick = void Function(List<PresentationEmail> listEmail);
+typedef OnOpenContextMenuActionClick = void Function(List<PresentationEmail> listEmail);
+
+class AppBarThreadSelectModeActiveBuilder {
+  OnCloseActionClick? _onCloseActionClick;
+  OnUnreadEmailActionClick? _onUnreadEmailActionClick;
+  OnRemoveEmailActionClick? _onRemoveEmailActionClick;
+  OnOpenContextMenuActionClick? _onOpenContextMenuActionClick;
+
+  final BuildContext _context;
+  final ImagePaths _imagePaths;
+  final List<PresentationEmail> _listEmail;
+
+  AppBarThreadSelectModeActiveBuilder(this._context, this._imagePaths, this._listEmail);
+
+  void addCloseActionClick(OnCloseActionClick onCloseActionClick) {
+    _onCloseActionClick = onCloseActionClick;
+  }
+
+  void addUnreadEmailActionClick(OnUnreadEmailActionClick onUnreadEmailActionClick) {
+    _onUnreadEmailActionClick = onUnreadEmailActionClick;
+  }
+
+  void addRemoveEmailActionClick(OnRemoveEmailActionClick onRemoveEmailActionClick) {
+    _onRemoveEmailActionClick = onRemoveEmailActionClick;
+  }
+
+  void addOpenContextMenuActionClick(OnOpenContextMenuActionClick onOpenContextMenuActionClick) {
+    _onOpenContextMenuActionClick = onOpenContextMenuActionClick;
+  }
+
+  Widget build() {
+    return Container(
+        key: Key('app_bar_thread_select_mode_active'),
+        alignment: Alignment.center,
+        padding: EdgeInsets.symmetric(vertical: 8),
+        color: Colors.white,
+        child: MediaQuery(
+            data: MediaQueryData(padding: EdgeInsets.zero),
+            child: Row(
+                crossAxisAlignment: CrossAxisAlignment.center,
+                mainAxisAlignment: MainAxisAlignment.end,
+                children: [
+                  _buildBackButton(),
+                  Expanded(child: _buildCountItemSelected()),
+                  _buildListOptionButton(),
+                ]
+            )
+        )
+    );
+  }
+
+  Widget _buildCountItemSelected() {
+    return Padding(
+      padding: EdgeInsets.only(left: 12),
+      child: Text(
+        AppLocalizations.of(_context).count_email_selected(_listEmail.length),
+        maxLines: 1,
+        overflow: TextOverflow.ellipsis,
+        style: TextStyle(fontSize: 18, color: AppColor.nameUserColor, fontWeight: FontWeight.w500)));
+  }
+
+  Widget _buildBackButton() {
+    return ButtonBuilder(_imagePaths.icComposerClose)
+      .padding(5)
+      .size(30)
+      .onPressActionClick(() {
+        if (_onCloseActionClick != null) {
+          _onCloseActionClick!();
+        }})
+      .build();
+  }
+
+  Widget _buildListOptionButton() {
+    return Row(
+        mainAxisAlignment: MainAxisAlignment.start,
+        crossAxisAlignment: CrossAxisAlignment.center,
+        children: [
+          ButtonBuilder(_imagePaths.icTrash).key(Key('button_remove_email_selected'))
+            .onPressActionClick(() {
+              if (_onRemoveEmailActionClick != null) {
+                _onRemoveEmailActionClick!(_listEmail);
+              }})
+            .build(),
+          SizedBox(width: 10),
+          ButtonBuilder(_imagePaths.icEyeDisable).key(Key('button_unread_email_selected'))
+            .onPressActionClick(() {
+              if (_onUnreadEmailActionClick != null) {
+                _onUnreadEmailActionClick!(_listEmail);
+              }})
+            .build(),
+          SizedBox(width: 10),
+          ButtonBuilder(_imagePaths.icComposerMenu).key(Key('button_menu_select_email'))
+            .onPressActionClick(() {
+              if (_onOpenContextMenuActionClick != null) {
+                _onOpenContextMenuActionClick!(_listEmail);
+              }})
+            .build(),
+        ]
+    );
+  }
+}

lib/features/thread/presentation/widgets/email_context_menu_action_builder.dart

@@ -0,0 +1,33 @@
+
+import 'package:core/core.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/widgets.dart';
+import 'package:flutter_svg/svg.dart';
+import 'package:model/model.dart';
+
+class EmailContextMenuActionBuilder extends ContextMenuActionBuilder<List<PresentationEmail>> {
+  final List<PresentationEmail> _listEmail;
+
+  EmailContextMenuActionBuilder(
+      Key key,
+      SvgPicture actionIcon,
+      String actionName,
+      this._listEmail
+  ) : super(key, actionIcon, actionName);
+
+  @override
+  ListTile build() {
+    return ListTile(
+      key: key,
+      leading: Padding(
+        padding: EdgeInsets.only(left: 12),
+        child: actionIcon),
+      title: Text(actionName, style: actionTextStyle()),
+      onTap: () {
+        if (onContextMenuActionClick != null) {
+          onContextMenuActionClick!(_listEmail);
+        }
+      }
+    );
+  }
+}

lib/features/thread/presentation/widgets/email_tile_builder.dart

@@ -1,3 +1,4 @@
+import 'dart:math';
 import 'dart:ui';
 
 import 'package:core/core.dart';
@@ -5,7 +6,8 @@ import 'package:flutter/material.dart';
 import 'package:flutter/widgets.dart';
 import 'package:model/model.dart';
 
-typedef OnOpenMailActionClick = void Function();
+typedef OnOpenEmailActionClick = void Function(PresentationEmail selectedEmail);
+typedef OnSelectEmailActionClick = void Function(PresentationEmail selectedEmail);
 
 class EmailTileBuilder {
 
@@ -14,8 +16,10 @@ class EmailTileBuilder {
   final PresentationEmail _presentationEmail;
   final BuildContext _context;
   final ResponsiveUtils _responsiveUtils;
+  final SelectMode _selectModeAll;
 
-  OnOpenMailActionClick? _onOpenMailActionClick;
+  OnOpenEmailActionClick? _onOpenEmailActionClick;
+  OnSelectEmailActionClick? _onSelectEmailActionClick;
 
   EmailTileBuilder(
     this._context,
@@ -23,11 +27,15 @@ class EmailTileBuilder {
     this._selectMode,
     this._presentationEmail,
     this._responsiveUtils,
+    this._selectModeAll,
   );
 
-  EmailTileBuilder onOpenMailAction(OnOpenMailActionClick onOpenMailActionClick) {
-    _onOpenMailActionClick = onOpenMailActionClick;
-    return this;
+  void onOpenEmailAction(OnOpenEmailActionClick onOpenEmailActionClick) {
+    _onOpenEmailActionClick = onOpenEmailActionClick;
+  }
+
+  void onSelectEmailAction(OnSelectEmailActionClick onSelectEmailActionClick) {
+    _onSelectEmailActionClick = onSelectEmailActionClick;
   }
 
   Widget build() {
@@ -41,28 +49,25 @@ class EmailTileBuilder {
         padding: EdgeInsets.only(top: 10, bottom: 10, left: 25, right: 6),
         alignment: Alignment.center,
         decoration: BoxDecoration(
-          borderRadius: BorderRadius.circular(16),
-          color: _selectMode== SelectMode.ACTIVE
-            ? _responsiveUtils.isDesktop(_context)
-              ? AppColor.mailboxSelectedBackgroundColor
-              : _responsiveUtils.isMobile(_context) ? AppColor.bgMailboxListMail : Colors.white
-            : _responsiveUtils.isMobile(_context) ? AppColor.bgMailboxListMail : Colors.white),
+          borderRadius: BorderRadius.circular(_selectModeAll == SelectMode.ACTIVE ? 0 : 16),
+          color: _getBackgroundColorItem()),
         child: MediaQuery(
           data: MediaQueryData(padding: EdgeInsets.zero),
           child: ListTile(
             contentPadding: EdgeInsets.zero,
             onTap: () => {
-              if (_onOpenMailActionClick != null) {
-                _onOpenMailActionClick!()
+              if (_onOpenEmailActionClick != null) {
+                _onOpenEmailActionClick!(_presentationEmail)
+              }
+            },
+            onLongPress: () => {
+              if (_onSelectEmailActionClick != null) {
+                _onSelectEmailActionClick!(_presentationEmail)
               }
             },
             leading: Transform(
               transform: Matrix4.translationValues(-10.0, -10.0, 0.0),
-              child: AvatarBuilder()
-                .text('${_presentationEmail.getAvatarText()}')
-                .size(40)
-                .iconStatus(_imagePaths.icOffline)
-                .build()),
+              child: _buildAvatarIcon()),
             title: Transform(
               transform: Matrix4.translationValues(-10.0, 0.0, 0.0),
               child: Row(
@@ -131,4 +136,70 @@ class EmailTileBuilder {
       )
     );
   }
+
+  Widget _buildAvatarIcon () {
+    if (_selectModeAll == SelectMode.ACTIVE) {
+      return AnimatedSwitcher(
+        duration: Duration(milliseconds: 600),
+        transitionBuilder: __transitionBuilder,
+        child: _presentationEmail.selectMode == SelectMode.ACTIVE
+          ? (IconBuilder(_imagePaths.icSelected)
+                ..addOnTapActionClick(() {
+                  if (_selectModeAll == SelectMode.ACTIVE && _onSelectEmailActionClick != null) {
+                    _onSelectEmailActionClick!(_presentationEmail);
+                  }}))
+              .build()
+          : AvatarBuilder()
+              .text('${_presentationEmail.getAvatarText()}')
+              .size(40)
+              .iconStatus(_imagePaths.icOffline)
+              .addOnTapActionClick(() {
+                  if (_selectModeAll == SelectMode.ACTIVE && _onSelectEmailActionClick != null) {
+                  _onSelectEmailActionClick!(_presentationEmail);
+                  }})
+              .build()
+      );
+    } else {
+      return AvatarBuilder()
+        .text('${_presentationEmail.getAvatarText()}')
+        .size(40)
+        .iconStatus(_imagePaths.icOffline)
+        .build();
+    }
+  }
+
+  Widget __transitionBuilder(Widget widget, Animation<double> animation) {
+    final rotateAnim = Tween(begin: pi, end: 0.0).animate(animation);
+    return AnimatedBuilder(
+      animation: rotateAnim,
+      child: widget,
+      builder: (context, widget) {
+        final isUnder = _presentationEmail.selectMode == SelectMode.ACTIVE;
+        final value = isUnder ? min(rotateAnim.value, pi / 2) : rotateAnim.value;
+        return Transform(
+          transform: Matrix4.rotationY(value),
+          child: widget,
+          alignment: Alignment.center,
+        );
+      },
+    );
+  }
+
+  Color _getBackgroundColorItem() {
+    if (_selectModeAll == SelectMode.ACTIVE) {
+      if (_presentationEmail.selectMode == SelectMode.ACTIVE) {
+        return AppColor.mailboxSelectedBackgroundColor;
+      } else {
+        return _responsiveUtils.isMobile(_context) ? AppColor.bgMailboxListMail : Colors.white;
+      }
+    } else {
+      if (_responsiveUtils.isMobile(_context)) {
+        return AppColor.bgMailboxListMail;
+      } else if (_responsiveUtils.isDesktop(_context)) {
+        return _selectMode == SelectMode.ACTIVE ? AppColor.mailboxSelectedBackgroundColor : Colors.white;
+      } else {
+        return Colors.white;
+      }
+    }
+  }
 }