TF-1477 Improve UX for simple search

This commit is contained in:
dab246
2023-03-03 14:21:10 +07:00
committed by Dat Vu
parent b3ec90b507
commit 1f4d8bebf1
4 changed files with 84 additions and 50 deletions
@@ -21,6 +21,8 @@ class SimpleSearchFilter with EquatableMixin {
final EmailReceiveTimeType emailReceiveTimeType;
final bool hasAttachment;
final UTCDate? before;
final UTCDate? startDate;
final UTCDate? endDate;
SimpleSearchFilter({
Set<String>? from,
@@ -30,6 +32,8 @@ class SimpleSearchFilter with EquatableMixin {
this.text,
this.before,
this.mailbox,
this.startDate,
this.endDate
}) : from = from ?? <String>{},
to = to ?? <String>{},
hasAttachment = hasAttachment ?? false,
@@ -43,6 +47,8 @@ class SimpleSearchFilter with EquatableMixin {
Option<EmailReceiveTimeType>? emailReceiveTimeTypeOption,
Option<bool>? hasAttachmentOption,
Option<UTCDate>? beforeOption,
Option<UTCDate>? startDateOption,
Option<UTCDate>? endDateOption
}) {
return SimpleSearchFilter(
from: _getOptionParam(fromOption, from),
@@ -52,6 +58,8 @@ class SimpleSearchFilter with EquatableMixin {
emailReceiveTimeType: _getOptionParam(emailReceiveTimeTypeOption, emailReceiveTimeType),
hasAttachment: _getOptionParam(hasAttachmentOption, hasAttachment),
before: _getOptionParam(beforeOption, before),
startDate: _getOptionParam(startDateOption, startDate),
endDate: _getOptionParam(endDateOption, endDate)
);
}
@@ -69,9 +77,9 @@ class SimpleSearchFilter with EquatableMixin {
? text?.value
: null,
inMailbox: mailbox?.id,
after: emailReceiveTimeType.toUTCDate(),
after: emailReceiveTimeType.getAfterDate(startDate),
hasAttachment: hasAttachment == false ? null : hasAttachment,
before: before,
before: emailReceiveTimeType.getBeforeDate(endDate, before)
);
final listEmailCondition = {
@@ -93,7 +101,17 @@ class SimpleSearchFilter with EquatableMixin {
}
@override
List<Object?> get props => [from, to, text, mailbox, emailReceiveTimeType, hasAttachment, before];
List<Object?> get props => [
from,
to,
text,
mailbox,
emailReceiveTimeType,
hasAttachment,
before,
startDate,
endDate
];
}
extension SearchEmailFilterExtension on SimpleSearchFilter {
@@ -26,6 +26,7 @@ import 'package:model/mailbox/presentation_mailbox.dart';
import 'package:model/mailbox/select_mode.dart';
import 'package:model/user/user_profile.dart';
import 'package:tmail_ui_user/features/base/base_controller.dart';
import 'package:tmail_ui_user/features/base/mixin/date_range_picker_mixin.dart';
import 'package:tmail_ui_user/features/contact/presentation/model/contact_arguments.dart';
import 'package:tmail_ui_user/features/destination_picker/presentation/model/destination_picker_arguments.dart';
import 'package:tmail_ui_user/features/email/domain/state/delete_email_permanently_state.dart';
@@ -44,6 +45,7 @@ import 'package:tmail_ui_user/features/mailbox_dashboard/domain/usecases/save_re
import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/model/dashboard_routes.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/manage_account/presentation/extensions/datetime_extension.dart';
import 'package:tmail_ui_user/features/search/email/domain/state/refresh_changes_search_email_state.dart';
import 'package:tmail_ui_user/features/search/email/domain/usecases/refresh_changes_search_email_interactor.dart';
import 'package:tmail_ui_user/features/search/email/presentation/model/search_more_state.dart';
@@ -66,7 +68,8 @@ import 'package:tmail_ui_user/main/routes/app_routes.dart';
import 'package:tmail_ui_user/main/routes/route_navigation.dart';
class SearchEmailController extends BaseController
with EmailActionController {
with EmailActionController,
DateRangePickerMixin {
final QuickSearchEmailInteractor _quickSearchEmailInteractor;
final SaveRecentSearchInteractor _saveRecentSearchInteractor;
@@ -84,7 +87,7 @@ class SearchEmailController extends BaseController
final listSuggestionSearch = RxList<PresentationEmail>();
final simpleSearchFilter = Rx<SimpleSearchFilter>(SimpleSearchFilter());
final searchIsRunning = RxBool(false);
final emailReceiveTimeType = Rxn<EmailReceiveTimeType>();
final emailReceiveTimeType = EmailReceiveTimeType.allTime.obs;
final selectionMode = Rx<SelectMode>(SelectMode.INACTIVE);
late Debouncer<String> _deBouncerTime;
@@ -399,10 +402,7 @@ class SearchEmailController extends BaseController
case QuickSearchFilter.hasAttachment:
return simpleSearchFilter.value.hasAttachment == true;
case QuickSearchFilter.last7Days:
if (emailReceiveTimeType.value != null) {
return true;
}
return simpleSearchFilter.value.emailReceiveTimeType == EmailReceiveTimeType.last7Days;
return true;
default:
return false;
}
@@ -418,51 +418,57 @@ class SearchEmailController extends BaseController
);
break;
case QuickSearchFilter.last7Days:
if (filterSelected) {
_setEmailReceiveTimeType(null);
_updateSimpleSearchFilter(
emailReceiveTimeTypeOption: const Some(EmailReceiveTimeType.allTime),
beforeOption: const None()
);
} else {
_setEmailReceiveTimeType(EmailReceiveTimeType.last7Days);
_updateSimpleSearchFilter(
emailReceiveTimeTypeOption: const Some(EmailReceiveTimeType.last7Days),
beforeOption: const None()
);
}
_updateSimpleSearchFilter(
emailReceiveTimeTypeOption: optionOf(emailReceiveTimeType.value),
beforeOption: const None()
);
break;
default:
break;
}
}
void _setEmailReceiveTimeType(EmailReceiveTimeType? receiveTimeType) {
void _setEmailReceiveTimeType(EmailReceiveTimeType receiveTimeType) {
emailReceiveTimeType.value = receiveTimeType;
}
void selectReceiveTimeQuickSearchFilter(BuildContext context, EmailReceiveTimeType? emailReceiveTimeType) {
void selectReceiveTimeQuickSearchFilter(BuildContext context, EmailReceiveTimeType emailReceiveTimeType) {
popBack();
if (emailReceiveTimeType != null) {
if (emailReceiveTimeType == EmailReceiveTimeType.customRange) {
showMultipleViewDateRangePicker(
context,
simpleSearchFilter.value.startDate?.value.toLocal(),
simpleSearchFilter.value.endDate?.value.toLocal(),
onCallbackAction: (newStartDate, newEndDate) {
_updateSimpleSearchFilter(
emailReceiveTimeTypeOption: Some(emailReceiveTimeType),
textOption: searchQuery == null
? Some(SearchQuery.initial())
: optionOf(simpleSearchFilter.value.text),
beforeOption: const None(),
startDateOption: optionOf(newStartDate?.toUTCDate()),
endDateOption: optionOf(newEndDate?.toUTCDate()),
);
_setEmailReceiveTimeType(emailReceiveTimeType);
_searchEmailAction(context);
}
);
} else {
_updateSimpleSearchFilter(
emailReceiveTimeTypeOption: Some(emailReceiveTimeType),
textOption: searchQuery == null
? Some(SearchQuery.initial())
: optionOf(simpleSearchFilter.value.text),
beforeOption: const None()
);
} else {
_updateSimpleSearchFilter(
emailReceiveTimeTypeOption: const Some(EmailReceiveTimeType.allTime),
textOption: searchQuery == null
? Some(SearchQuery.initial())
: optionOf(simpleSearchFilter.value.text),
beforeOption: const None()
beforeOption: const None(),
startDateOption: const None(),
endDateOption: const None()
);
_setEmailReceiveTimeType(emailReceiveTimeType);
_searchEmailAction(context);
}
_setEmailReceiveTimeType(emailReceiveTimeType);
_searchEmailAction(context);
}
void selectMailboxForSearchFilter(BuildContext context, PresentationMailbox? mailbox) async {
@@ -610,6 +616,8 @@ class SearchEmailController extends BaseController
Option<EmailReceiveTimeType>? emailReceiveTimeTypeOption,
Option<bool>? hasAttachmentOption,
Option<UTCDate>? beforeOption,
Option<UTCDate>? startDateOption,
Option<UTCDate>? endDateOption
}) {
simpleSearchFilter.value = simpleSearchFilter.value.copyWith(
fromOption: fromOption,
@@ -619,6 +627,8 @@ class SearchEmailController extends BaseController
emailReceiveTimeTypeOption: emailReceiveTimeTypeOption,
hasAttachmentOption: hasAttachmentOption,
beforeOption: beforeOption,
startDateOption: startDateOption,
endDateOption: endDateOption
);
simpleSearchFilter.refresh();
}
@@ -220,21 +220,26 @@ class SearchEmailView extends GetWidget<SearchEmailController>
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: filter.getBackgroundColor(quickSearchFilterSelected: filterSelected)),
color: filter.getBackgroundColor(isFilterSelected: filterSelected)),
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
child: Row(mainAxisAlignment: MainAxisAlignment.center, children: [
SvgPicture.asset(
filter.getIcon(_imagePaths, quickSearchFilterSelected: filterSelected),
filter.getIcon(_imagePaths, isFilterSelected: filterSelected),
width: 16,
height: 16,
fit: BoxFit.fill),
const SizedBox(width: 4),
Text(
filter.getTitle(context, receiveTimeType: controller.emailReceiveTimeType.value),
filter.getTitle(
context,
receiveTimeType: controller.emailReceiveTimeType.value,
startDate: controller.simpleSearchFilter.value.startDate?.value.toLocal(),
endDate: controller.simpleSearchFilter.value.endDate?.value.toLocal()
),
maxLines: 1,
overflow: CommonTextStyle.defaultTextOverFlow,
softWrap: CommonTextStyle.defaultSoftWrap,
style: filter.getTextStyle(quickSearchFilterSelected: filterSelected),
style: filter.getTextStyle(isFilterSelected: filterSelected),
),
if (filter == QuickSearchFilter.last7Days)
... [
@@ -256,22 +261,23 @@ class SearchEmailView extends GetWidget<SearchEmailController>
List<PopupMenuEntry> _popupMenuEmailReceiveTimeType(
BuildContext context,
EmailReceiveTimeType? receiveTimeSelected,
Function(EmailReceiveTimeType?)? onCallBack
Function(EmailReceiveTimeType)? onCallBack
) {
return EmailReceiveTimeType.values
.map((timeType) => PopupMenuItem(
.map((timeType) => PopupMenuItem(
padding: EdgeInsets.zero,
child: EmailReceiveTimeActionTileWidget(
receiveTimeSelected: receiveTimeSelected,
receiveTimeType: timeType,
onCallBack: onCallBack)))
.toList();
receiveTimeSelected: receiveTimeSelected,
receiveTimeType: timeType,
onCallBack: onCallBack
)))
.toList();
}
List<Widget> _emailReceiveTimeCupertinoActionTile(
BuildContext context,
EmailReceiveTimeType? receiveTimeSelected,
Function(EmailReceiveTimeType?)? onCallBack
Function(EmailReceiveTimeType)? onCallBack
) {
return EmailReceiveTimeType.values
.map((timeType) => (EmailReceiveTimeCupertinoActionSheetActionBuilder(
@@ -289,7 +295,7 @@ class SearchEmailView extends GetWidget<SearchEmailController>
width: 20,
height: 20,
fit: BoxFit.fill))
..onActionClick((timeType) => onCallBack?.call(timeType == receiveTimeSelected ? null : timeType)))
..onActionClick((timeType) => onCallBack?.call(timeType)))
.build())
.toList();
}
@@ -9,7 +9,7 @@ class EmailReceiveTimeActionTileWidget extends StatelessWidget {
final EmailReceiveTimeType? receiveTimeSelected;
final EmailReceiveTimeType receiveTimeType;
final Function(EmailReceiveTimeType?)? onCallBack;
final Function(EmailReceiveTimeType)? onCallBack;
const EmailReceiveTimeActionTileWidget({
Key? key,
@@ -23,7 +23,7 @@ class EmailReceiveTimeActionTileWidget extends StatelessWidget {
final imagePaths = Get.find<ImagePaths>();
return InkWell(
onTap: () => onCallBack?.call(receiveTimeType == receiveTimeSelected ? null : receiveTimeType),
onTap: () => onCallBack?.call(receiveTimeType),
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 16),
child: SizedBox(