TF-3002 [WEB] Add To/Folder search filters

lib/features/mailbox_dashboard/presentation/widgets/mark_mailbox_as_read_loading_banner.dart

@@ -0,0 +1,37 @@
+import 'package:core/presentation/state/failure.dart';
+import 'package:core/presentation/state/success.dart';
+import 'package:dartz/dartz.dart';
+import 'package:flutter/material.dart';
+import 'package:tmail_ui_user/features/base/mixin/app_loader_mixin.dart';
+import 'package:tmail_ui_user/features/mailbox/domain/state/mark_as_mailbox_read_state.dart';
+import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/styles/mark_mailbox_as_read_loading_banner_style.dart';
+
+class MarkMailboxAsReadLoadingBanner extends StatelessWidget with AppLoaderMixin {
+  final Either<Failure, Success> viewState;
+
+  const MarkMailboxAsReadLoadingBanner({
+    super.key,
+    required this.viewState,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return viewState.fold(
+      (failure) => const SizedBox.shrink(),
+      (success) {
+        if (success is MarkAsMailboxReadLoading) {
+          return Padding(
+            padding: MarkMailboxAsReadLoadingBannerStyle.bannerMargin,
+            child: horizontalLoadingWidget);
+        } else if (success is UpdatingMarkAsMailboxReadState) {
+          final percent = success.countRead / success.totalUnread;
+          return Padding(
+            padding: MarkMailboxAsReadLoadingBannerStyle.bannerMargin,
+            child: horizontalPercentLoadingWidget(percent));
+        } else {
+          return const SizedBox.shrink();
+        }
+      }
+    );
+  }
+}

lib/features/mailbox_dashboard/presentation/widgets/recover_deleted_message_loading_banner_widget.dart

@@ -1,6 +1,7 @@
 import 'package:core/presentation/extensions/color_extension.dart';
 import 'package:core/presentation/utils/responsive_utils.dart';
 import 'package:flutter/material.dart';
+import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/styles/recover_deleted_message_loading_banner_style.dart';
 import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
 
 class RecoverDeletedMessageLoadingBannerWidget extends StatelessWidget {
@@ -18,42 +19,38 @@ class RecoverDeletedMessageLoadingBannerWidget extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     if (isLoading) {
-      return Padding(
-        padding: EdgeInsetsDirectional.only(
-          top: responsiveUtils.isDesktop(context) ? 16 : 0,
-          end: 16,
-          bottom: responsiveUtils.isDesktop(context) ? 0 : 16,
+      return Container(
+        margin: RecoverDeletedMessageLoadingBannerStyle.getBannerMargin(
+          context,
+          responsiveUtils),
+        padding: const EdgeInsets.symmetric(
+          horizontal: 16,
+          vertical: 12,
         ),
-        child: Container(
-          padding: const EdgeInsets.symmetric(
-            horizontal: 16,
-            vertical: 12,
-          ),
-          decoration: const ShapeDecoration(
-            color: Colors.white,
-            shape: RoundedRectangleBorder(
-              side: BorderSide(
-                width: 1,
-                color: AppColor.colorBorderBodyThread,
+        decoration: const ShapeDecoration(
+          color: Colors.white,
+          shape: RoundedRectangleBorder(
+            side: BorderSide(
+              width: 1,
+              color: AppColor.colorBorderBodyThread,
+            ),
+            borderRadius: BorderRadius.all(Radius.circular(14)),
+          )
+        ),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Text(
+              AppLocalizations.of(context).bannerProgressingRecoveryMessage,
+              style: const TextStyle(
+                fontSize: 15,
+                fontWeight: FontWeight.w400,
+                color: AppColor.primaryColor,
               ),
-              borderRadius: BorderRadius.all(Radius.circular(14)),
-            )
-          ),
-          child: Column(
-            crossAxisAlignment: CrossAxisAlignment.start,
-            children: [
-              Text(
-                AppLocalizations.of(context).bannerProgressingRecoveryMessage,
-                style: const TextStyle(
-                  fontSize: 15,
-                  fontWeight: FontWeight.w400,
-                  color: AppColor.primaryColor,
-                ),
-              ),
-              const SizedBox(height: 12),
-              horizontalLoadingWidget
-            ],
-          ),
+            ),
+            const SizedBox(height: 12),
+            horizontalLoadingWidget
+          ],
         ),
       );
     } else {

lib/features/mailbox_dashboard/presentation/widgets/search_filters/search_filter_button.dart

@@ -5,6 +5,7 @@ import 'package:core/presentation/views/button/tmail_button_widget.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:jmap_dart_client/jmap/core/user_name.dart';
+import 'package:model/mailbox/presentation_mailbox.dart';
 import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/model/search/email_receive_time_type.dart';
 import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/model/search/email_sort_order_type.dart';
 import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/model/search/quick_search_filter.dart';
@@ -17,6 +18,8 @@ typedef OnSelectSearchFilterAction = Function(
 
 class SearchFilterButton extends StatelessWidget {
 
+  static const int _titleCharactersMaximum = 20;
+
   final QuickSearchFilter searchFilter;
   final bool isSelected;
   final ImagePaths imagePaths;
@@ -25,7 +28,9 @@ class SearchFilterButton extends StatelessWidget {
   final DateTime? startDate;
   final DateTime? endDate;
   final Set<String>? listAddressOfFrom;
+  final Set<String>? listAddressOfTo;
   final UserName? userName;
+  final PresentationMailbox? mailbox;
   final Color? backgroundColor;
   final OnSelectSearchFilterAction? onSelectSearchFilterAction;
 
@@ -39,18 +44,33 @@ class SearchFilterButton extends StatelessWidget {
     this.startDate,
     this.endDate,
     this.listAddressOfFrom,
+    this.listAddressOfTo,
     this.userName,
+    this.mailbox,
     this.backgroundColor,
     this.onSelectSearchFilterAction,
   });
 
   @override
   Widget build(BuildContext context) {
+    final filterTitle = searchFilter.getTitle(
+      context,
+      receiveTimeType: receiveTimeType,
+      startDate: startDate,
+      endDate: startDate,
+      sortOrderType: sortOrderType,
+      listAddressOfFrom: listAddressOfFrom,
+      userName: userName,
+      mailbox: mailbox,
+      listAddressOfTo: listAddressOfTo,
+    );
+
     final childItem = Container(
       decoration: BoxDecoration(
         borderRadius: SearchFilterButtonStyle.borderRadius,
         color: backgroundColor ?? searchFilter.getBackgroundColor(isFilterSelected: isSelected)),
       padding: SearchFilterButtonStyle.buttonPadding,
+      height: SearchFilterButtonStyle.buttonSize,
       child: Row(
         mainAxisSize: MainAxisSize.min,
         children: [
@@ -62,14 +82,9 @@ class SearchFilterButton extends StatelessWidget {
             fit: BoxFit.fill),
           const SizedBox(width: SearchFilterButtonStyle.spaceSize),
           Text(
-            searchFilter.getTitle(
-              context,
-              receiveTimeType: receiveTimeType,
-              startDate: startDate,
-              endDate: startDate,
-              sortOrderType: sortOrderType,
-              listAddressOfFrom: listAddressOfFrom,
-              userName: userName),
+            filterTitle.length > _titleCharactersMaximum
+              ? '${filterTitle.substring(0, _titleCharactersMaximum)}...'
+              : filterTitle,
             maxLines: 1,
             overflow: TextOverflow.ellipsis,
             style: SearchFilterButtonStyle.titleStyle,