TF-1153 Improve recipient input in composer

lib/features/composer/presentation/widgets/email_address_input_builder.dart

@@ -10,6 +10,7 @@ import 'package:get/get.dart';
 import 'package:jmap_dart_client/jmap/mail/email/email_address.dart';
 import 'package:model/model.dart';
 import 'package:super_tag_editor/tag_editor.dart';
+import 'package:super_tag_editor/widgets/rich_text_widget.dart';
 import 'package:tmail_ui_user/features/composer/presentation/extensions/prefix_email_address_extension.dart';
 import 'package:tmail_ui_user/features/composer/presentation/widgets/suggestion_email_address.dart';
 import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
@@ -231,13 +232,22 @@ class EmailAddressInputBuilder {
             },
             findSuggestions: _findSuggestions,
             useDefaultHighlight: false,
-            suggestionBuilder: (context, tagEditorState, suggestionEmailAddress, index, length, highlight) {
+            suggestionBuilder: (
+              context,
+              tagEditorState,
+              suggestionEmailAddress,
+              index,
+              length,
+              highlight,
+              suggestionValid
+            ) {
               switch (suggestionEmailAddress.state) {
                 case SuggestionEmailState.duplicated:
                   return _buildExistedSuggestionItem(
                     setState,
                     context,
                     suggestionEmailAddress,
+                    suggestionValid
                   );
                 default:
                   return _buildSuggestionItem(
@@ -247,7 +257,8 @@ class EmailAddressInputBuilder {
                     suggestionEmailAddress,
                     index,
                     length,
-                    highlight
+                    highlight,
+                    suggestionValid
                   );
               }
             },
@@ -279,11 +290,11 @@ class EmailAddressInputBuilder {
     return listEmailAddress.length > 1 && expandMode == ExpandMode.COLLAPSE;
   }
 
-
   Widget _buildExistedSuggestionItem(
     StateSetter setState,
     BuildContext context,
     SuggestionEmailAddress suggestionEmailAddress,
+    String? suggestionValid
   ) {
     return Container(
       padding: const EdgeInsets.all(8.0),
@@ -306,17 +317,23 @@ class EmailAddressInputBuilder {
             child: Text(
               suggestionEmailAddress.emailAddress.asString().isNotEmpty ? suggestionEmailAddress.emailAddress.asString()[0].toUpperCase() : '',
               style: const TextStyle(color: Colors.black, fontSize: 16, fontWeight: FontWeight.w600))),
-          title: Text(
-            suggestionEmailAddress.emailAddress.asString(),
-            maxLines: 1,
-            overflow: kIsWeb ? null : TextOverflow.ellipsis,
-            style: const TextStyle(color: Colors.black, fontSize: 16, fontWeight: FontWeight.normal)),
+          title: RichTextWidget(
+            textOrigin: suggestionEmailAddress.emailAddress.asString(),
+            wordSearched: suggestionValid ?? '',
+          ),
           subtitle: suggestionEmailAddress.emailAddress.displayName.isNotEmpty && suggestionEmailAddress.emailAddress.emailAddress.isNotEmpty
-            ? Text(
-                suggestionEmailAddress.emailAddress.emailAddress,
-                maxLines: 1,
-                overflow: kIsWeb ? null : TextOverflow.ellipsis,
-                style: const TextStyle(color: AppColor.colorHintSearchBar, fontSize: 13, fontWeight: FontWeight.normal))
+            ? RichTextWidget(
+                textOrigin: suggestionEmailAddress.emailAddress.emailAddress,
+                wordSearched: suggestionValid ?? '',
+                styleTextOrigin: const TextStyle(
+                  color: AppColor.colorHintSearchBar,
+                  fontSize: 13,
+                  fontWeight: FontWeight.normal),
+                styleWordSearched: const TextStyle(
+                  color: Colors.black,
+                  fontSize: 13,
+                  fontWeight: FontWeight.bold),
+              )
             : null,
           trailing: SvgPicture.asset(_imagePaths.icFilterSelected,
             width: 24,
@@ -334,7 +351,8 @@ class EmailAddressInputBuilder {
     SuggestionEmailAddress suggestionEmailAddress,
     int index,
     int length,
-    bool highlight
+    bool highlight,
+    String? suggestionValid
   ) {
     return Container(
       decoration: BoxDecoration(
@@ -353,18 +371,24 @@ class EmailAddressInputBuilder {
           child: Text(
               suggestionEmailAddress.emailAddress.asString().isNotEmpty ? suggestionEmailAddress.emailAddress.asString()[0].toUpperCase() : '',
               style: const TextStyle(color: Colors.black, fontSize: 16, fontWeight: FontWeight.w600))),
-        title: Text(
-            suggestionEmailAddress.emailAddress.asString(),
-            maxLines: 1,
-            overflow: kIsWeb ? null : TextOverflow.ellipsis,
-            style: const TextStyle(color: Colors.black, fontSize: 16, fontWeight: FontWeight.normal)),
+        title: RichTextWidget(
+          textOrigin: suggestionEmailAddress.emailAddress.asString(),
+          wordSearched: suggestionValid ?? '',
+        ),
         subtitle: suggestionEmailAddress.emailAddress.displayName.isNotEmpty && suggestionEmailAddress.emailAddress.emailAddress.isNotEmpty
-            ? Text(
-                suggestionEmailAddress.emailAddress.emailAddress,
-                maxLines: 1,
-                overflow: kIsWeb ? null : TextOverflow.ellipsis,
-                style: const TextStyle(color: AppColor.colorHintSearchBar, fontSize: 13, fontWeight: FontWeight.normal))
-            : null,
+          ? RichTextWidget(
+              textOrigin: suggestionEmailAddress.emailAddress.emailAddress,
+              wordSearched: suggestionValid ?? '',
+              styleTextOrigin: const TextStyle(
+                color: AppColor.colorHintSearchBar,
+                fontSize: 13,
+                fontWeight: FontWeight.normal),
+              styleWordSearched: const TextStyle(
+                color: Colors.black,
+                fontSize: 13,
+                fontWeight: FontWeight.bold),
+            )
+          : null,
         onTap: () {
           log('EmailAddressInputBuilder::_buildSuggestionItem(): onTap: $suggestionEmailAddress');
           setState(() => listEmailAddress.add(suggestionEmailAddress.emailAddress));
@@ -378,16 +402,20 @@ class EmailAddressInputBuilder {
 
   BorderRadius _getBorderRadiusSuggestionItem(int index, int length) {
     var borderRadius = const BorderRadius.all(Radius.circular(0));
-    if (index == 0) {
-      borderRadius = const BorderRadius.only(
-        topLeft: Radius.circular(20),
-        topRight: Radius.circular(20),
-      );
-    } else if (index == length - 1) {
-      borderRadius = const BorderRadius.only(
-        bottomRight: Radius.circular(20),
-        bottomLeft: Radius.circular(20),
-      );
+    if (length <= 1) {
+      borderRadius = const BorderRadius.all(Radius.circular(20));
+    } else {
+      if (index == 0) {
+        borderRadius = const BorderRadius.only(
+          topLeft: Radius.circular(20),
+          topRight: Radius.circular(20),
+        );
+      } else if (index == length - 1) {
+        borderRadius = const BorderRadius.only(
+          bottomRight: Radius.circular(20),
+          bottomLeft: Radius.circular(20),
+        );
+      }
     }
     return borderRadius;
   }

lib/features/contact/presentation/widgets/autocomplete_contact_text_field_with_tags.dart

@@ -143,7 +143,7 @@ class _AutocompleteContactTextFieldWithTagsState extends State<AutocompleteConta
         );
       },
       findSuggestions: _findSuggestions,
-      suggestionBuilder: (context, tagEditorState, suggestionEmailAddress, index, length, highlight) {
+      suggestionBuilder: (context, tagEditorState, suggestionEmailAddress, index, length, highlight, suggestionValid) {
         return Container(
           padding: const EdgeInsets.symmetric(horizontal: 12),
           child: ContactSuggestionBoxItem(

pubspec.lock

@@ -112,7 +112,7 @@ packages:
       name: built_value
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "8.4.2"
+    version: "8.4.3"
   byte_converter:
     dependency: "direct main"
     description:
@@ -1379,7 +1379,7 @@ packages:
     description:
       path: "."
       ref: master
-      resolved-ref: "34ffe7c8c5e8a967ae1cfde2a525c4f5738a0835"
+      resolved-ref: e70771662668617eef860b7ffe52bd7e83b369f4
       url: "https://github.com/dab246/super_tag_editor.git"
     source: git
     version: "0.0.3+4"
@@ -1564,7 +1564,7 @@ packages:
       name: web_socket_channel
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.2.0"
+    version: "2.3.0"
   webview_flutter:
     dependency: transitive
     description: