TF-3308 Implement super_drag_and_drop

Author: tddang-linagora

core/lib/presentation/views/text/text_field_builder.dart

@@ -1,5 +1,6 @@
 import 'package:core/presentation/extensions/color_extension.dart';
 import 'package:core/presentation/views/semantics/text_field_semantics.dart';
+import 'package:core/presentation/views/text/text_drop_zone_web.dart';
 import 'package:core/utils/direction_utils.dart';
 import 'package:flutter/material.dart';
 
@@ -27,6 +28,7 @@ class TextFieldBuilder extends StatefulWidget {
   final bool readOnly;
   final MouseCursor? mouseCursor;
   final String? semanticLabel;
+  final bool dropTextEnabled;
 
   const TextFieldBuilder({
     super.key,
@@ -52,6 +54,7 @@ class TextFieldBuilder extends StatefulWidget {
     this.onTapOutside,
     this.onTextChange,
     this.onTextSubmitted,
+    this.dropTextEnabled = false,
   });
 
   @override
@@ -79,7 +82,7 @@ class _TextFieldBuilderState extends State<TextFieldBuilder> {
 
   @override
   Widget build(BuildContext context) {
-    final textField = TextField(
+    Widget textField = TextField(
       key: widget.key,
       controller: _controller,
       cursorColor: widget.cursorColor,
@@ -103,6 +106,17 @@ class _TextFieldBuilderState extends State<TextFieldBuilder> {
       onTapOutside: widget.onTapOutside,
     );
 
+    if (widget.dropTextEnabled) {
+      textField = TextDropZoneWeb(
+        child: textField,
+        onDrop: (value) {
+          _controller?.text += value;
+          widget.focusNode?.requestFocus();
+          _onTextChanged(value);
+        },
+      );
+    }
+
     if (widget.semanticLabel != null) {
       return TextFieldSemantics(
         label: widget.semanticLabel!,

lib/features/composer/presentation/composer_controller.dart

@@ -5,7 +5,6 @@ import 'dart:math';
 import 'package:core/core.dart';
 import 'package:custom_pop_up_menu/custom_pop_up_menu.dart';
 import 'package:dartz/dartz.dart';
-import 'package:desktop_drop/desktop_drop.dart';
 import 'package:dio/dio.dart';
 import 'package:dropdown_button2/dropdown_button2.dart';
 import 'package:file_picker/file_picker.dart';
@@ -1969,15 +1968,13 @@ class ComposerController extends BaseController
     }
   }
 
-  void onLocalFileDropZoneListener({
+  Future<void> onSuperDropListener({
     required BuildContext context,
-    required DropDoneDetails details,
+    required List<FileInfo> listFileInfo,
     required double maxWidth
   }) async {
     _setUpMaxWidthInlineImage(context: context, maxWidth: maxWidth);
 
-    final listFileInfo = await onDragDone(context: context, details: details);
-
     if (listFileInfo.isEmpty && context.mounted) {
       appToast.showToastErrorMessage(
         context,

lib/features/composer/presentation/composer_view_web.dart

@@ -205,6 +205,7 @@ class ComposerView extends GetWidget<ComposerController> {
                   onTextChange: controller.setSubjectEmail,
                   padding: ComposerStyle.mobileSubjectPadding,
                   margin: ComposerStyle.mobileSubjectMargin,
+                  dropTextEnabled: true,
                 ),
                 Expanded(
                   child: LayoutBuilder(
@@ -305,10 +306,10 @@ class ComposerView extends GetWidget<ComposerController> {
                                     imagePaths: controller.imagePaths,
                                     width: constraintsEditor.maxWidth,
                                     height: constraintsEditor.maxHeight,
-                                    onLocalFileDropZoneListener: (details) =>
-                                      controller.onLocalFileDropZoneListener(
+                                    onSuperDrop: (listFileInfo) => 
+                                      controller.onSuperDropListener(
                                         context: context,
-                                        details: details,
+                                        listFileInfo: listFileInfo,
                                         maxWidth: constraintsEditor.maxWidth,
                                       ),
                                   )
@@ -474,6 +475,7 @@ class ComposerView extends GetWidget<ComposerController> {
                 onTextChange: controller.setSubjectEmail,
                 padding: ComposerStyle.desktopSubjectPadding,
                 margin: ComposerStyle.desktopSubjectMargin,
+                dropTextEnabled: true,
               ),
               Expanded(
                 child: LayoutBuilder(
@@ -613,10 +615,10 @@ class ComposerView extends GetWidget<ComposerController> {
                                   imagePaths: controller.imagePaths,
                                   width: constraintsEditor.maxWidth,
                                   height: constraintsEditor.maxHeight,
-                                  onLocalFileDropZoneListener: (details) =>
-                                    controller.onLocalFileDropZoneListener(
+                                  onSuperDrop: (listFileInfo) => 
+                                    controller.onSuperDropListener(
                                       context: context,
-                                      details: details,
+                                      listFileInfo: listFileInfo,
                                       maxWidth: constraintsEditor.maxWidth,
                                     ),
                                 )
@@ -786,6 +788,7 @@ class ComposerView extends GetWidget<ComposerController> {
                 onTextChange: controller.setSubjectEmail,
                 padding: ComposerStyle.tabletSubjectPadding,
                 margin: ComposerStyle.tabletSubjectMargin,
+                dropTextEnabled: true,
               ),
               Expanded(
                 child: LayoutBuilder(
@@ -923,10 +926,10 @@ class ComposerView extends GetWidget<ComposerController> {
                                   imagePaths: controller.imagePaths,
                                   width: constraintsBody.maxWidth,
                                   height: constraintsBody.maxHeight,
-                                  onLocalFileDropZoneListener: (details) =>
-                                    controller.onLocalFileDropZoneListener(
+                                  onSuperDrop: (listFileInfo) => 
+                                    controller.onSuperDropListener(
                                       context: context,
-                                      details: details,
+                                      listFileInfo: listFileInfo,
                                       maxWidth: constraintsBody.maxWidth,
                                     ),
                                 )

lib/features/composer/presentation/mixin/drag_drog_file_mixin.dart

@@ -1,10 +1,7 @@
 import 'dart:async' as async;
 import 'package:async/async.dart';
-import 'package:core/data/constants/constant.dart';
-import 'package:desktop_drop/desktop_drop.dart';
 import 'package:flutter/material.dart';
 import 'package:future_loading_dialog/future_loading_dialog.dart';
-import 'package:model/upload/file_info.dart';
 import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
 
 mixin DragDropFileMixin {
@@ -19,34 +16,4 @@ mixin DragDropFileMixin {
       future: future,
     );
   }
-
-  async.Future<List<FileInfo>> onDragDone({
-    required BuildContext context,
-    required DropDoneDetails details
-  }) async {
-    final bytesList = await showFutureLoadingDialogFullScreen(
-      context: context,
-      future: () => async.Future.wait(
-        details.files.map(
-          (xFile) => xFile.readAsBytes(),
-        ),
-      ),
-    );
-
-    if (bytesList.error != null) return [];
-
-    final listFileInfo = <FileInfo>[];
-    for (var i = 0; i < bytesList.result!.length; i++) {
-      listFileInfo.add(
-        FileInfo(
-          bytes: bytesList.result![i],
-          fileName: details.files[i].name,
-          type: details.files[i].mimeType,
-          fileSize: bytesList.result![i].length,
-          isInline: details.files[i].mimeType?.startsWith(Constant.imageType) == true
-        ),
-      );
-    }
-    return listFileInfo;
-  }
 }

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

@@ -17,6 +17,7 @@ import 'package:model/email/prefix_email_address.dart';
 import 'package:model/extensions/email_address_extension.dart';
 import 'package:model/mailbox/expand_mode.dart';
 import 'package:super_tag_editor/tag_editor.dart';
+import 'package:core/presentation/views/text/text_drop_zone_web.dart';
 import 'package:tmail_ui_user/features/composer/presentation/extensions/prefix_email_address_extension.dart';
 import 'package:tmail_ui_user/features/composer/presentation/extensions/mail_address_extension.dart';
 import 'package:tmail_ui_user/features/composer/presentation/model/draggable_email_address.dart';
@@ -162,7 +163,7 @@ class _RecipientComposerWidgetState extends State<RecipientComposerWidget> {
                   if (PlatformInfo.isWeb || widget.isTestingForWeb) {
                     return DragTarget<DraggableEmailAddress>(
                       builder: (context, candidateData, rejectedData) {
-                        return TagEditor<SuggestionEmailAddress>(
+                        final child = TagEditor<SuggestionEmailAddress>(
                           key: widget.keyTagEditor,
                           length: _collapsedListEmailAddress.length,
                           controller: widget.controller,
@@ -244,6 +245,27 @@ class _RecipientComposerWidgetState extends State<RecipientComposerWidget> {
                             );
                           },
                         );
+
+                        return TextDropZoneWeb(
+                          onHover: () {
+                            if (!_isDragging) {
+                              stateSetter(() => _isDragging = true);
+                            }
+                          },
+                          onLeave: () {
+                            if (_isDragging) {
+                              stateSetter(() => _isDragging = false);
+                            }
+                          },
+                          onDrop: (value) {
+                            if (_isDragging) {
+                              stateSetter(() => _isDragging = false);
+                            }
+                            widget.controller?.text += value;
+                            widget.focusNode?.requestFocus();
+                          },
+                          child: child,
+                        );
                       },
                       onAcceptWithDetails: (draggableEmailAddress) => _handleAcceptDraggableEmailAddressAction(draggableEmailAddress.data, stateSetter),
                       onLeave: (draggableEmailAddress) {

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

@@ -11,6 +11,7 @@ class SubjectComposerWidget extends StatelessWidget {
   final ValueChanged<String>? onTextChange;
   final EdgeInsetsGeometry? margin;
   final EdgeInsetsGeometry? padding;
+  final bool dropTextEnabled;
 
   const SubjectComposerWidget({
     super.key,
@@ -19,6 +20,7 @@ class SubjectComposerWidget extends StatelessWidget {
     required this.onTextChange,
     this.margin,
     this.padding,
+    this.dropTextEnabled = false,
   });
 
   @override
@@ -51,6 +53,7 @@ class SubjectComposerWidget extends StatelessWidget {
               textDirection: DirectionUtils.getDirectionByLanguage(context),
               textStyle: SubjectComposerWidgetStyle.inputTextStyle,
               controller: textController,
+              dropTextEnabled: dropTextEnabled,
             )
           )
         ]

lib/features/identity_creator/presentation/identity_creator_controller.dart

@@ -12,7 +12,6 @@ import 'package:core/presentation/utils/keyboard_utils.dart';
 import 'package:core/utils/app_logger.dart';
 import 'package:core/utils/file_utils.dart';
 import 'package:core/utils/platform_info.dart';
-import 'package:desktop_drop/desktop_drop.dart';
 import 'package:file_picker/file_picker.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/scheduler.dart';
@@ -896,14 +895,13 @@ class IdentityCreatorController extends BaseController with DragDropFileMixin im
       AppLocalizations.of(context).thisImageCannotBePastedIntoTheEditor);
   }
 
-  void onLocalFileDropZoneListener({
+  Future<void> onSuperDropListener({
     required BuildContext context,
-    required DropDoneDetails details,
+    required List<FileInfo> listFileInfo,
     required double maxWidth
   }) async {
     clearFocusEditor(context);
 
-    final listFileInfo = await onDragDone(context: context, details: details);
     if (!context.mounted) return;
     await _uploadMultipleFilesToPublicAsset(
       context,

lib/features/identity_creator/presentation/identity_creator_view.dart

@@ -137,10 +137,10 @@ class IdentityCreatorView extends GetWidget<IdentityCreatorController>
                           width: constraintsEditor.maxWidth,
                           height: constraintsEditor.maxHeight,
                           margin: EdgeInsets.zero,
-                          onLocalFileDropZoneListener: (details) =>
-                            controller.onLocalFileDropZoneListener(
+                          onSuperDrop: (listFileInfo) => 
+                            controller.onSuperDropListener(
                               context: context,
-                              details: details,
+                              listFileInfo: listFileInfo,
                               maxWidth: constraintsEditor.maxWidth,
                             ),
                         )