From 7efe6975ddfdf474e79ebfa85eccf04a474203eb Mon Sep 17 00:00:00 2001 From: hieubt Date: Mon, 30 Oct 2023 11:06:33 +0700 Subject: [PATCH] TF-1155 Add suggestion item for web (cherry picked from commit 77c5423ec9d9311cc1d1ffade64e8bb825836c0c) --- ...utocomplete_suggestion_item_web_style.dart | 27 ++++++ ...tocomplete_suggestion_item_widget_web.dart | 90 +++++++++++++++++++ 2 files changed, 117 insertions(+) create mode 100644 lib/features/mailbox_dashboard/presentation/styles/autocomplete_suggestion_item_web_style.dart create mode 100644 lib/features/mailbox_dashboard/presentation/widgets/advanced_search/autocomplete_suggestion_item_widget_web.dart diff --git a/lib/features/mailbox_dashboard/presentation/styles/autocomplete_suggestion_item_web_style.dart b/lib/features/mailbox_dashboard/presentation/styles/autocomplete_suggestion_item_web_style.dart new file mode 100644 index 000000000..788706660 --- /dev/null +++ b/lib/features/mailbox_dashboard/presentation/styles/autocomplete_suggestion_item_web_style.dart @@ -0,0 +1,27 @@ +import 'package:core/presentation/extensions/color_extension.dart'; +import 'package:flutter/material.dart'; + +class AutoCompleteSuggestionItemWebStyle { + static const double iconSize = 24.0; + + static const EdgeInsetsGeometry margin = EdgeInsets.all(8.0); + + static const EdgeInsetsGeometry contentPaddingDuplicated = EdgeInsets.symmetric(horizontal: 8.0); + static const EdgeInsetsGeometry contentPaddingValid = EdgeInsets.symmetric(horizontal: 16.0); + + static const Decoration decoration = BoxDecoration( + color: AppColor.colorBgMenuItemDropDownSelected, + borderRadius: BorderRadius.all(Radius.circular(20)) + ); + + static const TextStyle subTitleTextOriginStyle = TextStyle( + color: AppColor.colorHintSearchBar, + fontSize: 13, + fontWeight: FontWeight.normal + ); + static const TextStyle subTitleWordSearchStyle = TextStyle( + color: Colors.black, + fontSize: 13, + fontWeight: FontWeight.bold + ); +} \ No newline at end of file diff --git a/lib/features/mailbox_dashboard/presentation/widgets/advanced_search/autocomplete_suggestion_item_widget_web.dart b/lib/features/mailbox_dashboard/presentation/widgets/advanced_search/autocomplete_suggestion_item_widget_web.dart new file mode 100644 index 000000000..da04e3391 --- /dev/null +++ b/lib/features/mailbox_dashboard/presentation/widgets/advanced_search/autocomplete_suggestion_item_widget_web.dart @@ -0,0 +1,90 @@ +import 'package:core/core.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/email/email_address.dart'; +import 'package:model/extensions/email_address_extension.dart'; +import 'package:super_tag_editor/widgets/rich_text_widget.dart'; +import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/model/search/suggesstion_email_address.dart'; +import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/styles/autocomplete_suggestion_item_web_style.dart'; +import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/widgets/advanced_search/avatar_suggestion_item_widget.dart'; + +typedef OnSelectedRecipientSuggestionAction = Function(EmailAddress emailAddress); + +class AutoCompleteSuggestionItemWidgetWeb extends StatelessWidget { + + final SuggestionEmailState suggestionState; + final EmailAddress emailAddress; + final String? suggestionValid; + final bool highlight; + final OnSelectedRecipientSuggestionAction? onSelectedAction; + + final _imagePaths = Get.find(); + + AutoCompleteSuggestionItemWidgetWeb({ + Key? key, + required this.suggestionState, + required this.emailAddress, + this.highlight = false, + this.suggestionValid, + this.onSelectedAction, + }) : super(key: key); + + @override + Widget build(BuildContext context) { + if (suggestionState == SuggestionEmailState.duplicated) { + return Container( + margin: AutoCompleteSuggestionItemWebStyle.margin, + decoration: AutoCompleteSuggestionItemWebStyle.decoration, + child: Material( + type: MaterialType.transparency, + child: ListTile( + contentPadding: AutoCompleteSuggestionItemWebStyle.contentPaddingDuplicated, + leading: AvatarSuggestionItemWidget(emailAddress: emailAddress), + title: RichTextWidget( + textOrigin: emailAddress.asString(), + wordSearched: suggestionValid ?? '' + ), + subtitle: emailAddress.emailAddress.isNotEmpty + ? RichTextWidget( + textOrigin: emailAddress.emailAddress, + wordSearched: suggestionValid ?? '', + styleTextOrigin: AutoCompleteSuggestionItemWebStyle.subTitleTextOriginStyle, + styleWordSearched: AutoCompleteSuggestionItemWebStyle.subTitleWordSearchStyle, + ) + : null, + trailing: SvgPicture.asset( + _imagePaths.icFilterSelected, + width: AutoCompleteSuggestionItemWebStyle.iconSize, + height: AutoCompleteSuggestionItemWebStyle.iconSize, + fit: BoxFit.fill, + ), + ), + ), + ); + } else { + return Container( + color: highlight ? AppColor.colorItemSelected : Colors.white, + child: Material( + type: MaterialType.transparency, + child: ListTile( + contentPadding: AutoCompleteSuggestionItemWebStyle.contentPaddingValid, + leading: AvatarSuggestionItemWidget(emailAddress: emailAddress), + title: RichTextWidget( + textOrigin: emailAddress.asString(), + wordSearched: suggestionValid ?? '' + ), + subtitle: emailAddress.emailAddress.isNotEmpty + ? RichTextWidget( + textOrigin: emailAddress.emailAddress, + wordSearched: suggestionValid ?? '', + styleTextOrigin: AutoCompleteSuggestionItemWebStyle.subTitleTextOriginStyle, + styleWordSearched: AutoCompleteSuggestionItemWebStyle.subTitleWordSearchStyle, + ) + : null, + ), + ), + ); + } + } +}