TF-1427 Apply new design for search mailbox on mobile/tablet

lib/features/mailbox/presentation/mailbox_controller.dart

@@ -596,10 +596,10 @@ class MailboxController extends BaseMailboxController with MailboxActionHandlerM
 
   bool isSearchActive() => searchState.value.searchStatus == SearchStatus.ACTIVE;
 
-  void enableSearch() {
-    _cancelSelectMailbox();
+  void openSearchViewAction(BuildContext context) {
     SearchMailboxBindings().dependencies();
     mailboxDashBoardController.searchMailboxActivated.value = true;
+    closeMailboxScreen(context);
   }
 
   void disableSearch() {

lib/features/mailbox/presentation/mailbox_view.dart

@@ -233,8 +233,8 @@ class MailboxView extends GetWidget<MailboxController> {
                           color: AppColor.colorTextButton,
                           fit: BoxFit.fill
                         ),
-                          tooltip: AppLocalizations.of(context).search_folder,
-                        onTap: controller.enableSearch
+                        tooltip: AppLocalizations.of(context).search_folder,
+                        onTap: () => controller.openSearchViewAction(context)
                       ),
                       buildIconWeb(
                           minSize: 40,

lib/features/mailbox/presentation/mailbox_view_web.dart

@@ -160,7 +160,7 @@ class MailboxView extends GetWidget<MailboxController> with AppLoaderMixin, Popu
                             color: AppColor.colorTextButton,
                             fit: BoxFit.fill
                           ),
-                          onTap: controller.enableSearch
+                          onTap: () => controller.openSearchViewAction(context)
                         ),
                         buildIconWeb(
                             minSize: 40,
@@ -463,14 +463,21 @@ class MailboxView extends GetWidget<MailboxController> with AppLoaderMixin, Popu
     return (MailboxBottomSheetActionTileBuilder(
             Key('${contextMenuItem.action.name}_action'),
             SvgPicture.asset(
-                contextMenuItem.action.getContextMenuIcon(_imagePaths),
-                color: contextMenuItem.action.getColorContextMenuIcon()),
+              contextMenuItem.action.getContextMenuIcon(_imagePaths),
+              color: contextMenuItem.action.getColorContextMenuIcon(),
+              width: 24,
+              height: 24
+            ),
             contextMenuItem.action.getTitleContextMenu(context),
             mailbox,
             absorbing: !contextMenuItem.isActivated,
             opacity: !contextMenuItem.isActivated)
-        ..onActionClick((mailbox) =>
-            controller.handleMailboxAction(context, contextMenuItem.action, mailbox)))
+        ..actionTextStyle(textStyle: const TextStyle(
+            fontSize: 16,
+            color: Colors.black,
+            fontWeight: FontWeight.w500
+        ))
+        ..onActionClick((mailbox) => controller.handleMailboxAction(context, contextMenuItem.action, mailbox)))
       .build();
   }
 
@@ -495,15 +502,17 @@ class MailboxView extends GetWidget<MailboxController> with AppLoaderMixin, Popu
           absorbing: !contextMenuItem.isActivated,
           child: Opacity(
             opacity: contextMenuItem.isActivated ? 1.0 : 0.3,
-            child: popupItem(contextMenuItem.action.getContextMenuIcon(_imagePaths),
-                contextMenuItem.action.getTitleContextMenu(context),
-                colorIcon: contextMenuItem.action.getColorContextMenuIcon(),
-                styleName: TextStyle(
-                    fontWeight: FontWeight.normal,
-                    fontSize: 17,
-                    color: contextMenuItem.action.getColorContextMenuTitle()),
-                onCallbackAction: () =>
-                    controller.handleMailboxAction(context, contextMenuItem.action, mailbox)),
+            child: popupItem(
+              contextMenuItem.action.getContextMenuIcon(_imagePaths),
+              contextMenuItem.action.getTitleContextMenu(context),
+              colorIcon: contextMenuItem.action.getColorContextMenuIcon(),
+              styleName: TextStyle(
+                fontWeight: FontWeight.w500,
+                fontSize: 16,
+                color: contextMenuItem.action.getColorContextMenuTitle()
+              ),
+              onCallbackAction: () => controller.handleMailboxAction(context, contextMenuItem.action, mailbox)
+            ),
           ),
         ));
   }

lib/features/mailbox/presentation/model/mailbox_actions.dart

@@ -69,15 +69,15 @@ extension MailboxActionsExtension on MailboxActions {
       case MailboxActions.enableSpamReport:
         return imagePaths.icSpamReportEnable;
       case MailboxActions.markAsRead:
-        return imagePaths.icRead;
+        return imagePaths.icMarkAsRead;
       case MailboxActions.move:
-        return imagePaths.icMove;
+        return imagePaths.icMoveMailbox;
       case MailboxActions.rename:
         return imagePaths.icRenameMailbox;
       case MailboxActions.delete:
-        return imagePaths.icDelete;
+        return imagePaths.icDeleteMailbox;
       case MailboxActions.disableMailbox:
-        return imagePaths.icEyeOff;
+        return imagePaths.icHideMailbox;
       default:
         return '';
     }
@@ -96,12 +96,8 @@ extension MailboxActionsExtension on MailboxActions {
     switch(this) {
       case MailboxActions.delete:
         return AppColor.colorActionDeleteConfirmDialog;
-      case MailboxActions.disableSpamReport:
-      case MailboxActions.enableSpamReport:
-      case MailboxActions.disableMailbox:
-        return AppColor.primaryColor;
       default:
-        return Colors.black;
+        return AppColor.primaryColor;
     }
   }
 

lib/features/mailbox/presentation/utils/mailbox_method_action_define.dart

@@ -8,6 +8,7 @@ typedef OnClickOpenMailboxAction = void Function(PresentationMailbox);
 typedef OnClickOpenMenuMailboxAction = void Function(RelativeRect, PresentationMailbox);
 typedef OnSelectMailboxAction = void Function(PresentationMailbox);
 typedef OnDragEmailToMailboxAccepted = void Function(List<PresentationEmail>, PresentationMailbox);
+typedef OnLongPressMailboxAction = void Function(PresentationMailbox);
 
 typedef OnClickExpandMailboxNodeAction = void Function(MailboxNode);
 typedef OnClickOpenMailboxNodeAction = void Function(MailboxNode);

lib/features/mailbox/presentation/widgets/mailbox_folder_tile_builder.dart

@@ -30,7 +30,7 @@ class MailBoxFolderTileBuilder {
   OnSelectMailboxNodeAction? _onSelectMailboxFolderClick;
   OnClickOpenMenuMailboxNodeAction? _onMenuActionClick;
   OnDragEmailToMailboxAccepted? _onDragItemAccepted;
-  OnLongPressMailboxNodeAction? _onLongPressSpamReport;
+  OnLongPressMailboxNodeAction? _onLongPressMailboxNodeAction;
   
   bool isHoverItem = false;
 
@@ -68,8 +68,8 @@ class MailBoxFolderTileBuilder {
     _onDragItemAccepted = onDragItemAccepted;
   }
 
-  void addOnLongPressMailboxNodeAction(OnLongPressMailboxNodeAction onLongPressSpamReport) {
-    _onLongPressSpamReport = onLongPressSpamReport;
+  void addOnLongPressMailboxNodeAction(OnLongPressMailboxNodeAction onLongPressMailboxNodeAction) {
+    _onLongPressMailboxNodeAction = onLongPressMailboxNodeAction;
   }
 
   Widget build() => DragTarget<List<PresentationEmail>>(

lib/features/search/mailbox/presentation/search_mailbox_controller.dart

@@ -1,4 +1,5 @@
 
+import 'package:core/core.dart';
 import 'package:core/presentation/extensions/color_extension.dart';
 import 'package:core/presentation/resources/image_paths.dart';
 import 'package:core/presentation/state/failure.dart';
@@ -150,8 +151,9 @@ class SearchMailboxController extends BaseMailboxController with MailboxActionHa
     final newMailboxState = mailboxState ?? currentMailboxState;
     dashboardController.dispatchMailboxUIAction(RefreshChangeMailboxAction(newMailboxState));
     final accountId = dashboardController.accountId.value;
-    if (accountId != null && newMailboxState != null) {
-      consumeState(_refreshAllMailboxInteractor.execute(accountId, newMailboxState));
+    final session = dashboardController.sessionCurrent;
+    if (session != null && accountId != null && newMailboxState != null) {
+      consumeState(_refreshAllMailboxInteractor.execute(session, accountId, newMailboxState));
     }
   }
 
@@ -362,6 +364,14 @@ class SearchMailboxController extends BaseMailboxController with MailboxActionHa
     }
   }
 
+  void openMailboxAction(BuildContext context, PresentationMailbox mailbox) {
+    dashboardController.openMailboxAction(context, mailbox);
+
+    if (!responsiveUtils.isWebDesktop(context)) {
+      closeSearchView(context);
+    }
+  }
+
   void clearAllTextInputSearchForm() {
     textInputSearchController.clear();
     currentSearchQuery.value = '';

lib/features/search/mailbox/presentation/search_mailbox_view.dart

@@ -1,4 +1,5 @@
 
+import 'package:core/core.dart';
 import 'package:core/presentation/extensions/color_extension.dart';
 import 'package:core/presentation/views/button/icon_button_web.dart';
 import 'package:core/presentation/views/text/text_field_builder.dart';
@@ -43,7 +44,7 @@ class SearchMailboxView extends GetWidget<SearchMailboxController>
             if (!controller.responsiveUtils.isWebDesktop(context))
               const Divider(color: AppColor.colorDividerComposer, height: 1),
             _buildLoadingView(),
-            Expanded(child: _buildMailboxListView())
+            Expanded(child: _buildMailboxListView(context))
           ]),
         ),
       ),
@@ -68,9 +69,9 @@ class SearchMailboxView extends GetWidget<SearchMailboxController>
   Widget _buildSearchInputForm(BuildContext context) {
     return Row(children: [
       buildIconWeb(
-        minSize: 30,
+        minSize: SearchMailboxUtils.getIconSize(context, controller.responsiveUtils),
         iconPadding: EdgeInsets.zero,
-        splashRadius: 10,
+        splashRadius: SearchMailboxUtils.getIconSplashRadius(context, controller.responsiveUtils),
         icon: SvgPicture.asset(
           controller.imagePaths.icBack,
           color: AppColor.colorTextButton,
@@ -89,7 +90,7 @@ class SearchMailboxView extends GetWidget<SearchMailboxController>
         alignment: Alignment.center,
         child: Row(children: [
           Padding(
-            padding: const EdgeInsets.only(left: 5, right: 2),
+            padding: SearchMailboxUtils.getPaddingInputSearchIcon(context, controller.responsiveUtils),
             child: buildIconWeb(
               minSize: 40,
               iconPadding: EdgeInsets.zero,
@@ -157,10 +158,10 @@ class SearchMailboxView extends GetWidget<SearchMailboxController>
     )).build();
   }
 
-  Widget _buildMailboxListView() {
+  Widget _buildMailboxListView(BuildContext context) {
     return Obx(() {
       return ListView.builder(
-        padding: const EdgeInsets.only(left: 16, right: 16, bottom: 16),
+        padding: SearchMailboxUtils.getPaddingListViewMailboxSearched(context, controller.responsiveUtils),
         key: const Key('list_mailbox_searched'),
         itemCount: controller.listMailboxSearched.length,
         shrinkWrap: true,
@@ -171,8 +172,9 @@ class SearchMailboxView extends GetWidget<SearchMailboxController>
             controller.responsiveUtils,
             controller.listMailboxSearched[index],
             onDragEmailToMailboxAccepted: controller.dashboardController.dragSelectedMultipleEmailToMailboxAction,
-            onClickOpenMailboxAction: (mailbox) => controller.dashboardController.openMailboxAction(context, mailbox),
-            onClickOpenMenuMailboxAction: (position, mailbox) => _openMailboxMenuAction(context, position, mailbox),
+            onClickOpenMailboxAction: (mailbox) => controller.openMailboxAction(context, mailbox),
+            onClickOpenMenuMailboxAction: (position, mailbox) => _openMailboxMenuAction(context, mailbox, position: position),
+            onLongPressMailboxAction: (mailbox) => _openMailboxMenuAction(context, mailbox),
           );
         }
       );
@@ -185,7 +187,11 @@ class SearchMailboxView extends GetWidget<SearchMailboxController>
       : MailboxActions.enableSpamReport;
   }
 
-  void _openMailboxMenuAction(BuildContext context, RelativeRect position, PresentationMailbox mailbox) {
+  void _openMailboxMenuAction(
+    BuildContext context,
+    PresentationMailbox mailbox,
+    {RelativeRect? position}
+  ) {
     final mailboxActionsSupported = [
       MailboxActions.openInNewTab,
       if (mailbox.isPersonal && mailbox.isSpam)
@@ -241,6 +247,8 @@ class SearchMailboxView extends GetWidget<SearchMailboxController>
           Key('${contextMenuItem.action.name}_action'),
           SvgPicture.asset(
             contextMenuItem.action.getContextMenuIcon(controller.imagePaths),
+            width: 24,
+            height: 24,
             color: contextMenuItem.action.getColorContextMenuIcon()
           ),
           contextMenuItem.action.getTitleContextMenu(context),
@@ -279,6 +287,7 @@ class SearchMailboxView extends GetWidget<SearchMailboxController>
           child: popupItem(contextMenuItem.action.getContextMenuIcon(controller.imagePaths),
             contextMenuItem.action.getTitleContextMenu(context),
             colorIcon: contextMenuItem.action.getColorContextMenuIcon(),
+            iconSize: 24,
             styleName: TextStyle(
               fontWeight: FontWeight.w500,
               fontSize: 16,

lib/features/search/mailbox/presentation/utils/search_mailbox_utils.dart

@@ -7,9 +7,49 @@ class SearchMailboxUtils {
       return const EdgeInsets.symmetric(vertical: 8, horizontal: 16);
     } else {
       if (responsiveUtils.isScreenWithShortestSide(context)) {
-        return const EdgeInsets.symmetric(horizontal: 10);
+        return const EdgeInsets.symmetric(horizontal: 16, vertical: 8);
       } else {
-        return const EdgeInsets.symmetric(horizontal: 32);
+        return const EdgeInsets.symmetric(horizontal: 32, vertical: 8);
+      }
+    }
+  }
+
+  static EdgeInsets getPaddingInputSearchIcon(BuildContext context, ResponsiveUtils responsiveUtils) {
+    if (responsiveUtils.isWebDesktop(context)) {
+      return const EdgeInsets.only(left: 5, right: 2);
+    } else {
+      if (responsiveUtils.isScreenWithShortestSide(context)) {
+        return const EdgeInsets.only(left: 10, right: 16);
+      } else {
+        return const EdgeInsets.only(left: 10, right: 16);
+      }
+    }
+  }
+
+  static double getIconSize(BuildContext context, ResponsiveUtils responsiveUtils) {
+    if (responsiveUtils.isWebDesktop(context)) {
+      return 30;
+    } else {
+      return 40;
+    }
+  }
+
+  static double getIconSplashRadius(BuildContext context, ResponsiveUtils responsiveUtils) {
+    if (responsiveUtils.isWebDesktop(context)) {
+      return 10;
+    } else {
+      return 15;
+    }
+  }
+
+  static EdgeInsets getPaddingListViewMailboxSearched(BuildContext context, ResponsiveUtils responsiveUtils) {
+    if (responsiveUtils.isWebDesktop(context)) {
+      return const EdgeInsets.only(left: 16, right: 16, bottom: 16);
+    } else {
+      if (responsiveUtils.isScreenWithShortestSide(context)) {
+        return const EdgeInsets.all(16);
+      } else {
+        return const EdgeInsets.symmetric(horizontal: 32, vertical: 16);
       }
     }
   }

lib/features/search/mailbox/presentation/widgets/mailbox_searched_item_builder.dart

@@ -18,6 +18,7 @@ class MailboxSearchedItemBuilder extends StatefulWidget {
   final OnClickOpenMailboxAction? onClickOpenMailboxAction;
   final OnClickOpenMenuMailboxAction? onClickOpenMenuMailboxAction;
   final OnDragEmailToMailboxAccepted? onDragEmailToMailboxAccepted;
+  final OnLongPressMailboxAction? onLongPressMailboxAction;
 
   const MailboxSearchedItemBuilder(
     this._imagePaths,
@@ -27,7 +28,8 @@ class MailboxSearchedItemBuilder extends StatefulWidget {
       Key? key,
       this.onClickOpenMailboxAction,
       this.onClickOpenMenuMailboxAction,
-      this.onDragEmailToMailboxAccepted
+      this.onDragEmailToMailboxAccepted,
+      this.onLongPressMailboxAction
     }
   ) : super(key: key);
 
@@ -89,6 +91,7 @@ class _MailboxSearchedItemBuilderState extends State<MailboxSearchedItemBuilder>
       return ListTile(
         contentPadding: const EdgeInsets.symmetric(horizontal: 8),
         onTap: _onTapMailboxAction,
+        onLongPress: _onLongPressMailboxAction,
         leading: _buildMailboxIcon(),
         title: _buildTitleItem(),
         subtitle: _buildSubtitleItem()
@@ -102,6 +105,10 @@ class _MailboxSearchedItemBuilderState extends State<MailboxSearchedItemBuilder>
     }
   }
 
+  void _onLongPressMailboxAction() {
+    widget.onLongPressMailboxAction?.call(widget._presentationMailbox);
+  }
+
   Widget _buildMailboxIcon() {
     return SvgPicture.asset(
       widget._presentationMailbox.isSubscribed?.value == true