TF-1477 Improve UX for advanced and quick search

lib/features/base/mixin/date_range_picker_mixin.dart

@@ -0,0 +1,93 @@
+
+import 'package:core/presentation/resources/image_paths.dart';
+import 'package:core/presentation/utils/app_toast.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_date_range_picker/multiple_view_date_range_picker.dart';
+import 'package:get/get.dart';
+import 'package:pointer_interceptor/pointer_interceptor.dart';
+import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
+import 'package:tmail_ui_user/main/routes/route_navigation.dart';
+
+mixin DateRangePickerMixin {
+
+  void showMultipleViewDateRangePicker(
+    BuildContext context,
+    DateTime? initStartDate,
+    DateTime? initEndDate,
+    {Function(DateTime? startDate, DateTime? endDate)? onCallbackAction}
+  ) {
+    showGeneralDialog(
+      context: context,
+      barrierDismissible: true,
+      barrierLabel: '',
+      barrierColor: Colors.black54,
+      pageBuilder: (context, _, __) {
+        return Dialog(
+          elevation: 0,
+          backgroundColor: Colors.white,
+          shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(18.0)),
+          child: PointerInterceptor(child: MultipleViewDateRangePicker(
+              confirmText: AppLocalizations.of(context).setDate,
+              cancelText: AppLocalizations.of(context).cancel,
+              last7daysTitle: AppLocalizations.of(context).last7Days,
+              last30daysTitle: AppLocalizations.of(context).last30Days,
+              last6monthsTitle: AppLocalizations.of(context).last6Months,
+              lastYearTitle: AppLocalizations.of(context).lastYears,
+              startDate: initStartDate,
+              endDate: initEndDate,
+              setDateActionCallback: ({startDate, endDate}) =>
+                _handleSelectDateRangeResult(
+                  context,
+                  startDate,
+                  endDate,
+                  onCallbackAction: onCallbackAction
+                )
+          ))
+        );
+      }
+    );
+  }
+
+  void _handleSelectDateRangeResult(
+    BuildContext context,
+    DateTime? startDate,
+    DateTime? endDate,
+    {Function(DateTime? startDate, DateTime? endDate)? onCallbackAction}
+  ) {
+    final _appToast = Get.find<AppToast>();
+    final _imagePaths = Get.find<ImagePaths>();
+
+    if (startDate == null) {
+      _appToast.showToastWithIcon(
+        context,
+        textColor: Colors.black,
+        message: AppLocalizations.of(context).toastMessageErrorWhenSelectStartDateIsEmpty,
+        icon: _imagePaths.icNotConnection
+      );
+      return;
+    }
+
+    if (endDate == null) {
+      _appToast.showToastWithIcon(
+        context,
+        textColor: Colors.black,
+        message: AppLocalizations.of(context).toastMessageErrorWhenSelectEndDateIsEmpty,
+        icon: _imagePaths.icNotConnection
+      );
+      return;
+    }
+
+    if (endDate.isBefore(startDate)) {
+      _appToast.showToastWithIcon(
+        context,
+        textColor: Colors.black,
+        message: AppLocalizations.of(context).toastMessageErrorWhenSelectDateIsInValid,
+        icon: _imagePaths.icNotConnection
+      );
+      return;
+    }
+
+    popBack();
+    onCallbackAction?.call(startDate, endDate);
+  }
+}

lib/features/base/widget/drop_down_button_widget.dart

@@ -28,7 +28,7 @@ class DropDownButtonWidget<T> extends StatelessWidget {
   final double radiusButton;
   final double opacity;
   final Widget? iconArrowDown;
-  final Color? colorButton;
+  final Color colorButton;
   final String tooltip;
   final double? dropdownWidth;
   final double? dropdownMaxHeight;
@@ -36,7 +36,7 @@ class DropDownButtonWidget<T> extends StatelessWidget {
   const DropDownButtonWidget({
     Key? key,
     required this.items,
-    required this.itemSelected,
+    this.itemSelected,
     this.onChanged,
     this.onMenuStateChange,
     this.supportHint = false,
@@ -112,7 +112,7 @@ class DropDownButtonWidget<T> extends StatelessWidget {
                       color: AppColor.colorInputBorderCreateMailbox,
                       width: 1,
                     ),
-                    color: colorButton ?? AppColor.colorInputBackgroundCreateMailbox,
+                    color: colorButton,
                   ),
                   padding: const EdgeInsets.only(left: 12, right: 10),
                   child: Row(children: [
@@ -139,7 +139,7 @@ class DropDownButtonWidget<T> extends StatelessWidget {
               color: AppColor.colorInputBorderCreateMailbox,
               width: 1,
             ),
-            color: colorButton ?? AppColor.colorInputBackgroundCreateMailbox,
+            color: colorButton,
           ),
           itemHeight: heightItem,
           buttonHeight: heightItem,

lib/features/base/widget/popup_item_no_icon_widget.dart

@@ -0,0 +1,63 @@
+
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:pointer_interceptor/pointer_interceptor.dart';
+
+class PopupItemNoIconWidget extends StatelessWidget {
+
+  final String _nameAction;
+  final String? svgIconSelected;
+  final bool isSelected;
+  final double? maxWidth;
+  final TextStyle? styleName;
+  final EdgeInsets? padding;
+  final VoidCallback? onCallbackAction;
+
+  const PopupItemNoIconWidget(
+    this._nameAction,
+    {
+      Key? key,
+      this.isSelected = false,
+      this.svgIconSelected,
+      this.maxWidth,
+      this.styleName,
+      this.padding,
+      this.onCallbackAction
+    }
+  ) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return PointerInterceptor(
+      child: InkWell(
+        onTap: onCallbackAction,
+        child: Padding(
+          padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
+          child: SizedBox(
+            width: maxWidth,
+            child: Row(children: [
+              Expanded(child: Text(
+                _nameAction,
+                style: const TextStyle(
+                  fontSize: 17,
+                  color: Colors.black,
+                  fontWeight: FontWeight.normal
+                )
+              )),
+              if (isSelected && svgIconSelected != null)
+                ...[
+                  const SizedBox(width: 12),
+                  SvgPicture.asset(
+                    svgIconSelected!,
+                    width: 24,
+                    height: 24,
+                    fit: BoxFit.fill
+                  ),
+                ]
+            ]),
+          ),
+        )
+      )
+    );
+  }
+}