TF-2119 Implement drag and drop between recipients

linagora · Sep 14, 2023 · d70709c · d70709c
1 parent 9f659e9
commit d70709c
Show file tree

Hide file tree

Showing 15 changed files with 288 additions and 154 deletions.
diff --git a/core/lib/presentation/views/avatar/gradient_circle_avatar_icon.dart b/core/lib/presentation/views/avatar/gradient_circle_avatar_icon.dart
@@ -8,13 +8,15 @@ class GradientCircleAvatarIcon extends StatelessWidget {
   final double iconSize;
   final double labelFontSize;
   final String label;
+  final TextStyle? textStyle;
 
   const GradientCircleAvatarIcon({
     Key? key,
     required this.colors,
     this.iconSize = 40,
     this.label = '',
     this.labelFontSize = 24.0,
+    this.textStyle,
   }) : super(key: key);
 
   @override
@@ -33,13 +35,13 @@ class GradientCircleAvatarIcon extends StatelessWidget {
         ),
         color: AppColor.avatarColor
       ),
-      child: Text(
-        label,
-        style: TextStyle(
+      child: DefaultTextStyle(
+        style: textStyle ?? TextStyle(
           color: Colors.white,
           fontSize: labelFontSize,
           fontWeight: FontWeight.w600
-        )
+        ),
+        child: Text(label),
       )
     );
   }

diff --git a/env.file b/env.file
@@ -1,7 +1,7 @@
-SERVER_URL=http://localhost/
+SERVER_URL=https://jmap.linagora.com
 DOMAIN_REDIRECT_URL=http://localhost:3000
 WEB_OIDC_CLIENT_ID=teammail-web
 OIDC_SCOPES=openid,profile,email,offline_access
 APP_GRID_AVAILABLE=supported
-FCM_AVAILABLE=supported
-IOS_FCM=supported
+FCM_AVAILABLE=unsupported
+IOS_FCM=unsupported
diff --git a/lib/features/composer/presentation/base_composer_view.dart b/lib/features/composer/presentation/base_composer_view.dart
diff --git a/lib/features/composer/presentation/composer_controller.dart b/lib/features/composer/presentation/composer_controller.dart
@@ -49,6 +49,7 @@ import 'package:tmail_ui_user/features/composer/presentation/controller/rich_tex
 import 'package:tmail_ui_user/features/composer/presentation/controller/rich_text_mobile_tablet_controller.dart';
 import 'package:tmail_ui_user/features/composer/presentation/extensions/email_action_type_extension.dart';
 import 'package:tmail_ui_user/features/composer/presentation/extensions/list_identities_extension.dart';
+import 'package:tmail_ui_user/features/composer/presentation/model/draggable_email_address.dart';
 import 'package:tmail_ui_user/features/composer/presentation/model/image_source.dart';
 import 'package:tmail_ui_user/features/composer/presentation/model/inline_image.dart';
 import 'package:tmail_ui_user/features/composer/presentation/model/prefix_recipient_state.dart';
@@ -1797,6 +1798,7 @@ class ComposerController extends BaseController {
 
   void handleOnMouseDownHtmlEditorWeb(BuildContext context) {
     Navigator.maybePop(context);
+    FocusScope.of(context).unfocus();
     onEditorFocusChange(true);
   }
 
@@ -1866,4 +1868,28 @@ class ComposerController extends BaseController {
     final newContentHtml = contentHtml.removeEditorStartTag();
     return newContentHtml;
   }
+
+  void removeDraggableEmailAddress(DraggableEmailAddress draggableEmailAddress) {
+    log('ComposerController::removeDraggableEmailAddress: $draggableEmailAddress');
+    switch(draggableEmailAddress.prefix) {
+      case PrefixEmailAddress.to:
+        listToEmailAddress.remove(draggableEmailAddress.emailAddress);
+        toAddressExpandMode.value = ExpandMode.EXPAND;
+        break;
+      case PrefixEmailAddress.cc:
+        listCcEmailAddress.remove(draggableEmailAddress.emailAddress);
+        ccAddressExpandMode.value = ExpandMode.EXPAND;
+        break;
+      case PrefixEmailAddress.bcc:
+        listBccEmailAddress.remove(draggableEmailAddress.emailAddress);
+        bccAddressExpandMode.value = ExpandMode.EXPAND;
+        break;
+      default:
+        break;
+    }
+    isInitialRecipient.value = true;
+    isInitialRecipient.refresh();
+
+    _updateStatusEmailSendButton();
+  }
 }
diff --git a/lib/features/composer/presentation/composer_view.dart b/lib/features/composer/presentation/composer_view.dart
@@ -118,6 +118,7 @@ class ComposerView extends GetWidget<ComposerController> {
                                 onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                                 onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                                 onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                                onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                               ),
                               if (controller.ccRecipientState.value == PrefixRecipientState.enabled)
                                 RecipientComposerWidget(
@@ -138,6 +139,7 @@ class ComposerView extends GetWidget<ComposerController> {
                                   onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                                   onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                                   onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                                  onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                                 ),
                               if (controller.bccRecipientState.value == PrefixRecipientState.enabled)
                                 RecipientComposerWidget(
@@ -158,6 +160,7 @@ class ComposerView extends GetWidget<ComposerController> {
                                   onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                                   onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                                   onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                                  onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                                 ),
                             ],
                           )),
@@ -259,6 +262,7 @@ class ComposerView extends GetWidget<ComposerController> {
                             onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                             onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                             onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                            onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                           ),
                           if (controller.ccRecipientState.value == PrefixRecipientState.enabled)
                             RecipientComposerWidget(
@@ -279,6 +283,7 @@ class ComposerView extends GetWidget<ComposerController> {
                               onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                               onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                               onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                              onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                             ),
                           if (controller.bccRecipientState.value == PrefixRecipientState.enabled)
                             RecipientComposerWidget(
@@ -299,6 +304,7 @@ class ComposerView extends GetWidget<ComposerController> {
                               onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                               onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                               onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                              onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                             ),
                         ],
                       )),

diff --git a/lib/features/composer/presentation/composer_view_web.dart b/lib/features/composer/presentation/composer_view_web.dart
@@ -90,6 +90,7 @@ class ComposerView extends GetWidget<ComposerController> {
                         onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                         onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                         onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                        onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                       ),
                       if (controller.ccRecipientState.value == PrefixRecipientState.enabled)
                         RecipientComposerWidget(
@@ -110,6 +111,7 @@ class ComposerView extends GetWidget<ComposerController> {
                           onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                           onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                           onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                          onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                         ),
                       if (controller.bccRecipientState.value == PrefixRecipientState.enabled)
                         RecipientComposerWidget(
@@ -130,6 +132,7 @@ class ComposerView extends GetWidget<ComposerController> {
                           onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                           onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                           onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                          onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                         ),
                     ],
                   )),
@@ -243,6 +246,7 @@ class ComposerView extends GetWidget<ComposerController> {
                       onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                       onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                       onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                      onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                     ),
                     if (controller.ccRecipientState.value == PrefixRecipientState.enabled)
                       RecipientComposerWidget(
@@ -263,6 +267,7 @@ class ComposerView extends GetWidget<ComposerController> {
                         onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                         onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                         onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                        onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                       ),
                     if (controller.bccRecipientState.value == PrefixRecipientState.enabled)
                       RecipientComposerWidget(
@@ -283,6 +288,7 @@ class ComposerView extends GetWidget<ComposerController> {
                         onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                         onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                         onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                        onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                       ),
                   ],
                 )),
@@ -433,6 +439,7 @@ class ComposerView extends GetWidget<ComposerController> {
                       onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                       onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                       onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                      onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                     ),
                     if (controller.ccRecipientState.value == PrefixRecipientState.enabled)
                       RecipientComposerWidget(
@@ -453,6 +460,7 @@ class ComposerView extends GetWidget<ComposerController> {
                         onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                         onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                         onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                        onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                       ),
                     if (controller.bccRecipientState.value == PrefixRecipientState.enabled)
                       RecipientComposerWidget(
@@ -473,6 +481,7 @@ class ComposerView extends GetWidget<ComposerController> {
                         onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                         onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                         onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                        onRemoveDraggableEmailAddressAction: controller.removeDraggableEmailAddress,
                       ),
                   ],
                 )),

diff --git a/lib/features/composer/presentation/styles/draggable_recipient_tag_widget_style.dart b/lib/features/composer/presentation/styles/draggable_recipient_tag_widget_style.dart
@@ -4,21 +4,15 @@ import 'package:flutter/material.dart';
 
 class DraggableRecipientTagWidgetStyle {
   static const double radius = 10;
-  static const double avatarIconSize = 30;
-  static const double avatarLabelFontSize = 10;
+  static const double avatarIconSize = 24;
+  static const double avatarLabelFontSize = 12;
 
-  static const Color avatarBackgroundColor = Colors.white;
   static const Color deleteIconColor = Colors.white;
   static const Color backgroundColor = AppColor.primaryColor;
 
   static const EdgeInsetsGeometry padding = EdgeInsets.symmetric(horizontal: 6, vertical: 3);
   static const EdgeInsetsGeometry labelPadding = EdgeInsets.symmetric(horizontal: 8);
 
-  static const TextStyle avatarLabelTextStyle = TextStyle(
-    color: Colors.black,
-    fontSize: 12,
-    fontWeight: FontWeight.w500
-  );
   static const TextStyle labelTextStyle = TextStyle(
     color: Colors.white,
     fontSize: 17,

diff --git a/lib/features/composer/presentation/styles/recipient_composer_widget_style.dart b/lib/features/composer/presentation/styles/recipient_composer_widget_style.dart
@@ -5,9 +5,11 @@ import 'package:flutter/material.dart';
 class RecipientComposerWidgetStyle {
   static const double deleteRecipientFieldIconSize = 20;
   static const double space = 8;
+  static const double enableBorderRadius = 10;
 
   static const Color borderColor = AppColor.colorLineComposer;
   static const Color deleteRecipientFieldIconColor = AppColor.colorCollapseMailbox;
+  static const Color enableBorderColor = AppColor.primaryColor;
 
   static const EdgeInsetsGeometry deleteRecipientFieldIconPadding = EdgeInsetsDirectional.all(3);
   static const EdgeInsetsGeometry prefixButtonPadding = EdgeInsetsDirectional.symmetric(vertical: 3, horizontal: 5);

diff --git a/lib/features/composer/presentation/styles/recipient_tag_item_widget_style.dart b/lib/features/composer/presentation/styles/recipient_tag_item_widget_style.dart
@@ -3,6 +3,8 @@ import 'package:flutter/material.dart';
 
 class RecipientTagItemWidgetStyle {
   static const double radius = 10;
+  static const double avatarIconSize = 24;
+  static const double avatarLabelFontSize = 12;
 
   static const EdgeInsetsGeometry padding = EdgeInsetsDirectional.only(start: 4);
   static const EdgeInsetsGeometry counterPadding = EdgeInsetsDirectional.symmetric(vertical: 5, horizontal: 8);

diff --git a/lib/features/composer/presentation/widgets/draggable_recipient_tag_widget.dart b/lib/features/composer/presentation/widgets/draggable_recipient_tag_widget.dart
@@ -1,5 +1,7 @@
 import 'package:core/presentation/extensions/color_extension.dart';
+import 'package:core/presentation/extensions/string_extension.dart';
 import 'package:core/presentation/resources/image_paths.dart';
+import 'package:core/presentation/views/avatar/gradient_circle_avatar_icon.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:get/get.dart';
@@ -34,16 +36,11 @@ class DraggableRecipientTagWidget extends StatelessWidget {
           mainAxisSize: MainAxisSize.min,
           children: [
             if (emailAddress.displayName.isNotEmpty)
-              SizedBox(
-                width: DraggableRecipientTagWidgetStyle.avatarIconSize,
-                height: DraggableRecipientTagWidgetStyle.avatarIconSize,
-                child: CircleAvatar(
-                  backgroundColor: DraggableRecipientTagWidgetStyle.avatarBackgroundColor,
-                  child: Text(
-                    emailAddress.displayName[0].toUpperCase(),
-                    style: DraggableRecipientTagWidgetStyle.avatarLabelTextStyle
-                  )
-                ),
+              GradientCircleAvatarIcon(
+                colors: emailAddress.avatarColors,
+                label: emailAddress.displayName.firstLetterToUpperCase,
+                labelFontSize: DraggableRecipientTagWidgetStyle.avatarLabelFontSize,
+                iconSize: DraggableRecipientTagWidgetStyle.avatarIconSize,
               ),
             Padding(
               padding: DraggableRecipientTagWidgetStyle.labelPadding,