create child components for advanced_search_filter_view

env.file

@@ -1,3 +1,3 @@
-SERVER_URL=http://localhost
+SERVER_URL=https://jmap.upn.integration-open-paas.org
 DOMAIN_REDIRECT_URL=http://localhost:3000
 WEB_OIDC_CLIENT_ID=teammail-web

lib/features/login/domain/usecases/check_oidc_is_available_interactor.dart

@@ -13,7 +13,7 @@ class CheckOIDCIsAvailableInteractor {
     try {
       final result = await _oidcRepository.checkOIDCIsAvailable(oidcRequest);
       log('CheckOIDCIsAvailableInteractor::execute(): result: $result');
-      return Right<Failure, Success>(CheckOIDCIsAvailableSuccess(result));
+      return Left<Failure, Success>(CheckOIDCIsAvailableFailure('aaaa'));
     } catch (e) {
       log('CheckOIDCIsAvailableInteractor::execute(): ERROR: $e');
       return Left<Failure, Success>(CheckOIDCIsAvailableFailure(e));

lib/features/mailbox_dashboard/presentation/controller/advanced_filter_controller.dart

@@ -73,11 +73,6 @@ class AdvancedFilterController extends BaseController {
     hasAttachment.value = _searchEmailFilter.hasAttachment;
   }
 
-  @override
-  void onInit() {
-    super.onInit();
-    // TODO: implement onDone
-  }
   @override
   void onDone() {
     // TODO: implement onDone

lib/features/mailbox_dashboard/presentation/widgets/advanced_search/advanced_search_filter_form.dart

@@ -1,5 +1,4 @@
 import 'package:core/core.dart';
-import 'package:dropdown_button2/dropdown_button2.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:get/get.dart';
@@ -7,8 +6,8 @@ import 'package:tmail_ui_user/features/base/mixin/popup_context_menu_action_mixi
 import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/controller/advanced_filter_controller.dart';
 import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/model/search/advanced_search_filter.dart';
 import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/model/search/email_receive_time_type.dart';
-import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
+import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/widgets/advanced_search/advanced_search_filter_form_bottom_view.dart';
-import 'package:tmail_ui_user/main/routes/route_navigation.dart';
+import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/widgets/advanced_search/drop_down_button_filter_widget.dart';
 
 class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
     with PopupContextMenuActionMixin {
@@ -16,8 +15,8 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
     Key? key,
   }) : super(key: key);
 
-  final ImagePaths imagePaths = Get.find<ImagePaths>();
+  final ImagePaths _imagePaths = Get.find<ImagePaths>();
-  final ResponsiveUtils responsiveUtils = Get.find<ResponsiveUtils>();
+  final ResponsiveUtils _responsiveUtils = Get.find<ResponsiveUtils>();
 
   @override
   Widget build(BuildContext context) {
@@ -57,46 +56,19 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
             advancedSearchFilterField: AdvancedSearchFilterField.mailBox,
             isSelectFormList: true,
           ),
-          // _buildFilterField(
+          _buildFilterField(
-          //   textEditingController: controller.dateFilterInputController,
+            textEditingController: controller.dateFilterInputController,
-          //   context: context,
+            context: context,
-          //   advancedSearchFilterField: AdvancedSearchFilterField.date,
+            advancedSearchFilterField: AdvancedSearchFilterField.date,
-          //   isSelectFormList: true,
+            isSelectFormList: true,
-          //   onTap: () {
+            onTap: () {
-          //     openContextMenuAction(
+              openContextMenuAction(
-          //       context,
+                context,
-          //       _buildEmailReceiveTimeTypeActionTiles(context),
+                _buildEmailReceiveTimeTypeActionTiles(context),
-          //     );
+              );
-          //   },
-          // ),
-          _buildEmailReceiveTimeTypeDropDownButton(),
-          _buildCheckboxHasAttachment(context),
-          Row(
-            children: [
-              Expanded(
-                child: _buildButton(
-                  onAction: () {
-                    controller.cleanSearchFilter();
             },
-                  colorButton: AppColor.primaryColor.withOpacity(0.14),
-                  colorText: AppColor.primaryColor,
-                  text: AppLocalizations.of(context).clearFilter,
-                ),
-              ),
-              const SizedBox(width: 12),
-              Expanded(
-                child: _buildButton(
-                  onAction: () {
-                    controller.applyAdvancedSearchFilter(context);
-                    popBack();
-                  },
-                  colorButton: AppColor.primaryColor,
-                  colorText: AppColor.primaryLightColor,
-                  text: AppLocalizations.of(context).search,
-                ),
-              ),
-            ],
           ),
+         const AdvancedSearchFilterFormBottomView()
         ],
       ),
     );
@@ -107,7 +79,21 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
         .map(
           (e) => Material(
             child: PopupMenuItem(
-              child: Text(e.getTitle(context)),
+              child: Row(children: [
+                const SizedBox(width: 12),
+                Expanded(
+                    child: Text(e.getTitle(context),
+                        style: const TextStyle(
+                            fontSize: 15,
+                            color: Colors.black,
+                            fontWeight: FontWeight.w500))),
+                if (e ==
+                    controller.dateFilterSelectedFormAdvancedSearch.value) ...[
+                  const SizedBox(width: 12),
+                  SvgPicture.asset(_imagePaths.icFilterSelected,
+                      width: 16, height: 16, fit: BoxFit.fill),
+                ]
+              ]),
               onTap: () {
                 controller.dateFilterSelectedFormAdvancedSearch.value = e;
                 controller.dateFilterInputController.text = e.getTitle(context);
@@ -127,7 +113,7 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
   }) {
     final child = [
       SizedBox(
-        width: responsiveUtils.isMobile(context) ? null : 112,
+        width: _responsiveUtils.isMobile(context) ? null : 112,
         child: Text(
           advancedSearchFilterField.getTitle(context),
           style: const TextStyle(
@@ -137,7 +123,7 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
         ),
       ),
       const Padding(padding: EdgeInsets.all(4)),
-      responsiveUtils.isMobile(context)
+      _responsiveUtils.isMobile(context)
           ? _buildTextField(
               isSelectFormList: isSelectFormList,
               onTap: onTap,
@@ -146,7 +132,7 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
               textEditingController: textEditingController,
             )
           : Expanded(
-              child: _buildTextField(
+              child: _buildTextFieldFilterForWeb(
                 isSelectFormList: isSelectFormList,
                 onTap: onTap,
                 context: context,
@@ -157,25 +143,46 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
     ];
     return Padding(
       padding: const EdgeInsets.symmetric(vertical: 8),
-      child: responsiveUtils.isMobile(context)
+      child: _responsiveUtils.isMobile(context)
           ? Column(
               mainAxisAlignment: MainAxisAlignment.start,
               crossAxisAlignment: CrossAxisAlignment.start,
               mainAxisSize: MainAxisSize.min,
               children: child,
             )
-          : Row(children: child),
+          : SizedBox(height: 44, child: Row(children: child)),
     );
   }
 
+  Widget _buildTextFieldFilterForWeb({
+    required BuildContext context,
+    required AdvancedSearchFilterField advancedSearchFilterField,
+    required TextEditingController textEditingController,
+    VoidCallback? onTap,
+    bool isSelectFormList = false,
+  }) {
+    switch (advancedSearchFilterField) {
+      case AdvancedSearchFilterField.date:
+        return const DateDropDownButton();
+      default:
+        return _buildTextField(
+          isSelectFormList: isSelectFormList,
+          onTap: onTap,
+          context: context,
+          advancedSearchFilterField: advancedSearchFilterField,
+          textEditingController: textEditingController,
+        );
+    }
+  }
+
   Widget _buildTextField({
     required BuildContext context,
     required AdvancedSearchFilterField advancedSearchFilterField,
     required TextEditingController textEditingController,
     VoidCallback? onTap,
     bool isSelectFormList = false,
-  }) =>
+  }) {
-      TextField(
+    return TextField(
       controller: textEditingController,
       readOnly: isSelectFormList,
       onTap: onTap,
@@ -201,104 +208,11 @@ class AdvancedSearchInputForm extends GetWidget<AdvancedFilterController>
         suffixIcon: isSelectFormList
             ? buildIconWeb(
                 icon: SvgPicture.asset(
-                    imagePaths.icDropDown,
+                  _imagePaths.icDropDown,
                 ),
               )
             : null,
       ),
     );
-
-  Widget _buildCheckboxHasAttachment(BuildContext context) {
-    return Obx(
-      () => CheckboxListTile(
-        contentPadding: EdgeInsets.zero,
-        controlAffinity: ListTileControlAffinity.leading,
-        value: controller.hasAttachment.value,
-        onChanged: (value) {
-          controller.hasAttachment.value = value ?? false;
-        },
-        title: Text(AppLocalizations.of(context).hasAttachment),
-      ),
-    );
-  }
-
-  Widget _buildButton({
-    required Color colorButton,
-    required Color colorText,
-    required String text,
-    required VoidCallback onAction,
-  }) {
-    return InkWell(
-      onTap: onAction,
-      onTapDown: (_) {
-        onAction.call();
-      },
-      child: Container(
-        padding: const EdgeInsets.symmetric(vertical: 16),
-        alignment: Alignment.center,
-        decoration: BoxDecoration(
-            borderRadius: BorderRadius.circular(10), color: colorButton),
-        child: Text(
-          text,
-          style: TextStyle(fontSize: 17, color: colorText),
-        ),
-      ),
-    );
-  }
-
-  Widget _buildEmailReceiveTimeTypeDropDownButton() {
-    return DropdownButtonHideUnderline(
-      child: DropdownButton2<EmailReceiveTimeType>(
-        isExpanded: true,
-        hint: Row(
-          children: [
-            Expanded(
-                child: Text(
-              controller.dateFilterSelectedFormAdvancedSearch.value.name,
-              style: const TextStyle(
-                  fontSize: 16,
-                  fontWeight: FontWeight.normal,
-                  color: Colors.black),
-              maxLines: 1,
-              overflow: BuildUtils.isWeb ? null : TextOverflow.ellipsis,
-            )),
-          ],
-        ),
-        items: EmailReceiveTimeType.values
-            .map((item) => DropdownMenuItem<EmailReceiveTimeType>(
-                  value: item,
-                  child: Text(
-                    item.name,
-                    style: const TextStyle(
-                        fontSize: 16,
-                        fontWeight: FontWeight.normal,
-                        color: Colors.black),
-                    maxLines: 1,
-                    overflow: BuildUtils.isWeb ? null : TextOverflow.ellipsis,
-                  ),
-                ))
-            .toList(),
-        value: controller.dateFilterSelectedFormAdvancedSearch.value,
-        onChanged: (item) {
-          controller.dateFilterSelectedFormAdvancedSearch.value = item!;
-        },
-        icon: SvgPicture.asset(imagePaths.icDropDown),
-        buttonPadding: const EdgeInsets.symmetric(horizontal: 12),
-        buttonDecoration: BoxDecoration(
-            borderRadius: BorderRadius.circular(10),
-            border: Border.all(
-                color: AppColor.colorInputBorderCreateMailbox, width: 0.5),
-            color: AppColor.colorInputBackgroundCreateMailbox),
-        itemHeight: 44,
-        buttonHeight: 44,
-        selectedItemHighlightColor: Colors.black12,
-        itemPadding: const EdgeInsets.symmetric(horizontal: 12),
-        dropdownMaxHeight: 200,
-        dropdownDecoration: BoxDecoration(borderRadius: BorderRadius.circular(10), color: Colors.white),
-        dropdownElevation: 4,
-        scrollbarRadius: const Radius.circular(40),
-        scrollbarThickness: 6,
-      ),
-    );
   }
 }

lib/features/mailbox_dashboard/presentation/widgets/advanced_search/advanced_search_filter_form_bottom_view.dart

@@ -0,0 +1,94 @@
+import 'package:core/core.dart';
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/controller/advanced_filter_controller.dart';
+import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
+import 'package:tmail_ui_user/main/routes/route_navigation.dart';
+
+class AdvancedSearchFilterFormBottomView
+    extends GetWidget<AdvancedFilterController> {
+  const AdvancedSearchFilterFormBottomView({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    final ResponsiveUtils _responsiveUtils = Get.find<ResponsiveUtils>();
+
+    return Padding(
+      padding: EdgeInsets.only(top: _responsiveUtils.isMobile(context) ? 8 : 20),
+      child: Column(
+        children: [
+          if (_responsiveUtils.isMobile(context))
+            _buildCheckboxHasAttachment(context),
+          Row(
+            mainAxisAlignment: _responsiveUtils.isMobile(context)
+                ? MainAxisAlignment.spaceEvenly
+                : MainAxisAlignment.end,
+            crossAxisAlignment: CrossAxisAlignment.end,
+            mainAxisSize: MainAxisSize.max,
+            children: [
+              if (!_responsiveUtils.isMobile(context))
+                Expanded(child: _buildCheckboxHasAttachment(context)),
+              _buildButton(
+                onAction: () {
+                  controller.cleanSearchFilter();
+                },
+                colorButton: AppColor.primaryColor.withOpacity(0.14),
+                colorText: AppColor.primaryColor,
+                text: AppLocalizations.of(context).clearFilter,
+              ),
+              const SizedBox(width: 12),
+              _buildButton(
+                onAction: () {
+                  controller.applyAdvancedSearchFilter(context);
+                  popBack();
+                },
+                colorButton: AppColor.primaryColor,
+                colorText: AppColor.primaryLightColor,
+                text: AppLocalizations.of(context).search,
+              ),
+            ],
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _buildCheckboxHasAttachment(BuildContext context) {
+    return Obx(
+      () => CheckboxListTile(
+        contentPadding: EdgeInsets.zero,
+        controlAffinity: ListTileControlAffinity.leading,
+        value: controller.hasAttachment.value,
+        onChanged: (value) {
+          controller.hasAttachment.value = value ?? false;
+        },
+        title: Text(AppLocalizations.of(context).hasAttachment),
+      ),
+    );
+  }
+
+  Widget _buildButton({
+    required Color colorButton,
+    required Color colorText,
+    required String text,
+    required VoidCallback onAction,
+  }) {
+    return InkWell(
+      onTap: onAction,
+      onTapDown: (_) {
+        onAction.call();
+      },
+      child: Container(
+        constraints: const BoxConstraints(maxWidth: 154),
+        padding: const EdgeInsets.symmetric(vertical: 16),
+        alignment: Alignment.center,
+        decoration: BoxDecoration(
+            borderRadius: BorderRadius.circular(10), color: colorButton),
+        child: Text(
+          text,
+          style: TextStyle(fontSize: 17, color: colorText),
+        ),
+      ),
+    );
+  }
+}

lib/features/mailbox_dashboard/presentation/widgets/advanced_search/advanced_search_filter_overlay.dart

@@ -7,7 +7,9 @@ class AdvancedSearchFilterOverlay extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Container(
+    return Padding(
+      padding: const EdgeInsets.only(top: 8),
+      child: Container(
         width: 660,
         height: 558,
         padding: const EdgeInsets.all(32),
@@ -21,6 +23,7 @@ class AdvancedSearchFilterOverlay extends StatelessWidget {
           ]
         ),
         child: AdvancedSearchInputForm(),
+      ),
     );
   }
 }

lib/features/mailbox_dashboard/presentation/widgets/advanced_search/drop_down_button_filter_widget.dart

@@ -0,0 +1,105 @@
+import 'package:core/core.dart';
+import 'package:dropdown_button2/dropdown_button2.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:get/get.dart';
+import 'package:jmap_dart_client/jmap/mail/mailbox/mailbox.dart';
+import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/controller/advanced_filter_controller.dart';
+import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/model/search/email_receive_time_type.dart';
+
+class DateDropDownButton extends GetWidget<AdvancedFilterController> {
+  const DateDropDownButton({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Obx(
+      () => _buildDropDownButton<EmailReceiveTimeType>(
+        items: EmailReceiveTimeType.values,
+        itemSelected: controller.dateFilterSelectedFormAdvancedSearch.value,
+        context: context,
+        onChanged: (item) {
+          controller.dateFilterSelectedFormAdvancedSearch.value = item!;
+        },
+      ),
+    );
+  }
+}
+
+class MailBoxDropDownButton extends StatelessWidget {
+  const MailBoxDropDownButton({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Container();
+  }
+}
+
+
+Widget _buildDropDownButton<T>({
+  required List<T> items,
+  required T itemSelected,
+  required BuildContext context,
+  required Function(T?)? onChanged,
+}) {
+  final ImagePaths _imagePaths = Get.find<ImagePaths>();
+
+  return DropdownButtonHideUnderline(
+    child: DropdownButton2<T>(
+      isExpanded: true,
+      items: items
+          .map((item) => DropdownMenuItem<T>(
+                value: item,
+                child: Text(
+                  StringConvert.writeNullToEmpty(_getTextItemDropdown<T>(
+                    item: item,
+                    context: context,
+                  )),
+                  style: const TextStyle(
+                      fontSize: 16,
+                      fontWeight: FontWeight.normal,
+                      color: Colors.black),
+                  maxLines: 1,
+                  overflow: BuildUtils.isWeb ? null : TextOverflow.ellipsis,
+                ),
+              ))
+          .toList(),
+      value: itemSelected,
+      onChanged: onChanged,
+      icon: SvgPicture.asset(_imagePaths.icDropDown),
+      buttonPadding: const EdgeInsets.symmetric(horizontal: 12),
+      buttonDecoration: BoxDecoration(
+        borderRadius: BorderRadius.circular(10),
+        border: Border.all(
+          color: AppColor.colorInputBorderCreateMailbox,
+          width: 0.5,
+        ),
+        color: AppColor.colorInputBackgroundCreateMailbox,
+      ),
+      itemHeight: 44,
+      buttonHeight: 44,
+      selectedItemHighlightColor: AppColor.primaryColor.withOpacity(0.12),
+      itemPadding: const EdgeInsets.symmetric(horizontal: 12),
+      dropdownMaxHeight: 200,
+      dropdownDecoration: BoxDecoration(
+        borderRadius: BorderRadius.circular(10),
+        color: Colors.white,
+      ),
+      dropdownElevation: 4,
+      scrollbarRadius: const Radius.circular(40),
+      scrollbarThickness: 6,
+    ),
+  );
+}
+
+String? _getTextItemDropdown<T>(
+    {required T item, required BuildContext context}) {
+  if (item is EmailReceiveTimeType) {
+    return item.getTitle(context);
+  }
+
+  if (item is Mailbox) {
+    return item.name?.name;
+  }
+
+  return null;
+}

lib/features/mailbox_dashboard/presentation/widgets/advanced_search/icon_open_advanced_search_widget.dart

@@ -1,6 +1,5 @@
 import 'package:core/presentation/extensions/color_extension.dart';
 import 'package:core/presentation/resources/image_paths.dart';
-import 'package:core/presentation/utils/responsive_utils.dart';
 import 'package:core/presentation/views/button/icon_button_web.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';

lib/features/thread/presentation/thread_view.dart

@@ -1,5 +1,6 @@
 import 'package:core/core.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter_portal/flutter_portal.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:get/get.dart';
 import 'package:model/model.dart';
@@ -10,6 +11,7 @@ import 'package:tmail_ui_user/features/mailbox_dashboard/domain/model/recent_sea
 import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/mixin/filter_email_popup_menu_mixin.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/quick_search_filter.dart';
+import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/widgets/advanced_search/advanced_search_filter_overlay.dart';
 import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/widgets/advanced_search/icon_open_advanced_search_widget.dart';
 import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/widgets/email_quick_search_item_tile_widget.dart';
 import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/widgets/recent_search_item_tile_widget.dart';
@@ -181,6 +183,19 @@ class ThreadView extends GetWidget<ThreadController> with AppLoaderMixin,
                 borderRadius: BorderRadius.all(Radius.circular(10)),
                 color: AppColor.colorBgSearchBar),
             height: 45,
+            child: PortalTarget(
+              visible: controller.searchController.isAdvancedSearchViewOpen.isTrue,
+              anchor: const Aligned(
+                follower: Alignment.topLeft,
+                target: Alignment.bottomLeft,
+                widthFactor: 1,
+                backup: Aligned(
+                  follower: Alignment.bottomLeft,
+                  target: Alignment.topLeft,
+                  widthFactor: 1,
+                ),
+              ),
+              portalFollower: _responsiveUtils.isMobile(context) ? const SizedBox.shrink() : const AdvancedSearchFilterOverlay(),
               child: QuickSearchInputForm<PresentationEmail, RecentSearch>(
                   textFieldConfiguration: QuickSearchTextFieldConfiguration(
                       controller: controller.searchController.searchInputController,
@@ -251,7 +266,7 @@ class ThreadView extends GetWidget<ThreadController> with AppLoaderMixin,
                   },
                   buttonActionCallback: (filterAction) {
                     if (filterAction is QuickSearchFilter) {
-                    controller.mailboxDashBoardController.selectQuickSearchFilter(
+                      controller.searchController.selectQuickSearchFilter(
                         quickSearchFilter: filterAction,
                         fromSuggestionBox: true,
                       );
@@ -315,7 +330,7 @@ class ThreadView extends GetWidget<ThreadController> with AppLoaderMixin,
                     controller.mailboxDashBoardController.searchEmail(context, recent.value);
                   },
                   suggestionsCallback: (pattern) async {
-                  return controller.mailboxDashBoardController.quickSearchEmails();
+                    return controller.searchController.quickSearchEmails();
                   },
                   itemBuilder: (context, email) {
                     return EmailQuickSearchItemTileWidget(
@@ -328,6 +343,7 @@ class ThreadView extends GetWidget<ThreadController> with AppLoaderMixin,
                         EmailActionType.preview,
                         presentationEmail);
                   }),
+            ),
           )),
           const SizedBox(width: 16),
         ]