TF-3399 Fix can not click on body of composer in Samsung A3

lib/features/composer/presentation/composer_controller.dart

@@ -199,6 +199,7 @@ class ComposerController extends BaseController
   SignatureStatus _identityContentOnOpenPolicy = SignatureStatus.editedAvailable;
   int? _savedEmailDraftHash;
   bool _restoringSignatureButton = false;
+  GlobalKey? responsiveContainerKey;
   
   @visibleForTesting
   bool get restoringSignatureButton => _restoringSignatureButton;
@@ -230,6 +231,7 @@ class ComposerController extends BaseController
     super.onInit();
     if (PlatformInfo.isWeb) {
       richTextWebController = getBinding<RichTextWebController>();
+      responsiveContainerKey = GlobalKey();
     } else {
       richTextMobileTabletController = getBinding<RichTextMobileTabletController>();
     }
@@ -269,6 +271,7 @@ class ComposerController extends BaseController
     _beforeReconnectManager.removeListener(onBeforeReconnect);
     if (PlatformInfo.isWeb) {
       richTextWebController = null;
+      responsiveContainerKey = null;
     } else {
       richTextMobileTabletController = null;
     }
@@ -392,12 +395,6 @@ class ComposerController extends BaseController
         }
       });
     });
-
-    if (richTextWebController != null) {
-      ever(richTextWebController!.formattingOptionsState, (_) {
-        richTextWebController!.editorController.setFocus();
-      });
-    }
   }
 
   void _triggerBrowserEventListener() {
@@ -525,6 +522,7 @@ class ComposerController extends BaseController
 
   KeyEventResult _subjectEmailInputOnKeyListener(FocusNode node, KeyEvent event) {
     if (event is KeyDownEvent && event.logicalKey == LogicalKeyboardKey.tab) {
+      subjectEmailInputFocusNode?.unfocus();
       richTextWebController?.editorController.setFocus();
       return KeyEventResult.handled;
     }
@@ -1486,6 +1484,9 @@ class ComposerController extends BaseController
   }
 
   void displayScreenTypeComposerAction(ScreenDisplayMode displayMode) async {
+    if (screenDisplayMode.value == ScreenDisplayMode.minimize) {
+      _isEmailBodyLoaded = false;
+    }
     if (richTextWebController != null && screenDisplayMode.value != ScreenDisplayMode.minimize) {
       final textCurrent = await richTextWebController!.editorController.getText();
       richTextWebController!.editorController.setText(textCurrent);
@@ -1955,7 +1956,6 @@ class ComposerController extends BaseController
     return false;
   }
 
-
   void handleInitHtmlEditorWeb(String initContent) async {
     if (_isEmailBodyLoaded) return;
     log('ComposerController::handleInitHtmlEditorWeb:');
@@ -1980,9 +1980,7 @@ class ComposerController extends BaseController
     richTextWebController?.closeAllMenuPopup();
   }
 
-  void handleOnMouseDownHtmlEditorWeb(BuildContext context) {
+  void handleOnMouseDownHtmlEditorWeb() {
-    Navigator.maybePop(context);
-    FocusScope.of(context).unfocus();
     _collapseAllRecipient();
     _autoCreateEmailTag();
   }

lib/features/composer/presentation/composer_view_web.dart

@@ -186,6 +186,7 @@ class ComposerView extends GetWidget<ComposerController> {
                                 child: Padding(
                                   padding: ComposerStyle.mobileEditorPadding,
                                   child: Obx(() => WebEditorView(
+                                    key: controller.responsiveContainerKey,
                                     editorController: controller.richTextWebController!.editorController,
                                     arguments: controller.composerArguments.value,
                                     contentViewState: controller.emailContentsViewState.value,
@@ -196,7 +197,6 @@ class ComposerView extends GetWidget<ComposerController> {
                                     onMouseDown: controller.handleOnMouseDownHtmlEditorWeb,
                                     onEditorSettings: controller.richTextWebController!.onEditorSettingsChange,
                                     onEditorTextSizeChanged: controller.richTextWebController!.onEditorTextSizeChanged,
-                                    width: constraints.maxWidth,
                                     height: constraints.maxHeight,
                                     onDragEnter: controller.handleOnDragEnterHtmlEditorWeb,
                                     onPasteImageSuccessAction: (listFileUpload) => controller.handleOnPasteImageSuccessAction(
@@ -448,6 +448,7 @@ class ComposerView extends GetWidget<ComposerController> {
                                         padding: ComposerStyle.desktopEditorPadding,
                                         child: Obx(() {
                                           return WebEditorView(
+                                            key: controller.responsiveContainerKey,
                                             editorController: controller.richTextWebController!.editorController,
                                             arguments: controller.composerArguments.value,
                                             contentViewState: controller.emailContentsViewState.value,
@@ -458,7 +459,6 @@ class ComposerView extends GetWidget<ComposerController> {
                                             onMouseDown: controller.handleOnMouseDownHtmlEditorWeb,
                                             onEditorSettings: controller.richTextWebController?.onEditorSettingsChange,
                                             onEditorTextSizeChanged: controller.richTextWebController?.onEditorTextSizeChanged,
-                                            width: constraints.maxWidth,
                                             height: constraints.maxHeight,
                                             onDragEnter: controller.handleOnDragEnterHtmlEditorWeb,
                                             onPasteImageSuccessAction: (listFileUpload) => controller.handleOnPasteImageSuccessAction(
@@ -728,6 +728,7 @@ class ComposerView extends GetWidget<ComposerController> {
                                       child: Padding(
                                         padding: ComposerStyle.tabletEditorPadding,
                                         child: Obx(() => WebEditorView(
+                                          key: controller.responsiveContainerKey,
                                           editorController: controller.richTextWebController!.editorController,
                                           arguments: controller.composerArguments.value,
                                           contentViewState: controller.emailContentsViewState.value,
@@ -738,7 +739,6 @@ class ComposerView extends GetWidget<ComposerController> {
                                           onMouseDown: controller.handleOnMouseDownHtmlEditorWeb,
                                           onEditorSettings: controller.richTextWebController!.onEditorSettingsChange,
                                           onEditorTextSizeChanged: controller.richTextWebController!.onEditorTextSizeChanged,
-                                          width: constraints.maxWidth,
                                           height: constraints.maxHeight,
                                           onDragEnter: controller.handleOnDragEnterHtmlEditorWeb,
                                           onPasteImageSuccessAction: (listFileUpload) => controller.handleOnPasteImageSuccessAction(

lib/features/composer/presentation/controller/rich_text_web_controller.dart

@@ -296,6 +296,11 @@ class RichTextWebController extends BaseRichTextController {
       : FormattingOptionsState.enabled;
 
     formattingOptionsState.value = newState;
+
+    if (isFormattingOptionsEnabled) {
+      FocusManager.instance.primaryFocus?.unfocus();
+      editorController.setFocus();
+    }
   }
 
   bool get isFormattingOptionsEnabled => formattingOptionsState.value == FormattingOptionsState.enabled;

lib/features/composer/presentation/view/web/web_editor_view.dart

@@ -29,7 +29,6 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
   final OnMouseDownEditorAction? onMouseDown;
   final OnEditorSettingsChange? onEditorSettings;
   final OnEditorTextSizeChanged? onEditorTextSizeChanged;
-  final double? width;
   final double? height;
   final OnDragEnterListener? onDragEnter;
   final OnPasteImageSuccessAction? onPasteImageSuccessAction;
@@ -49,7 +48,6 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
     this.onMouseDown,
     this.onEditorSettings,
     this.onEditorTextSizeChanged,
-    this.width,
     this.height,
     this.onDragEnter,
     this.onPasteImageSuccessAction,
@@ -78,7 +76,6 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
           onMouseDown: onMouseDown,
           onEditorSettings: onEditorSettings,
           onEditorTextSizeChanged: onEditorTextSizeChanged,
-          width: width,
           height: height,
           onDragEnter: onDragEnter,
           onPasteImageSuccessAction: onPasteImageSuccessAction,
@@ -106,7 +103,6 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
             onMouseDown: onMouseDown,
             onEditorSettings: onEditorSettings,
             onEditorTextSizeChanged: onEditorTextSizeChanged,
-            width: width,
             height: height,
             onDragEnter: onDragEnter,
             onPasteImageSuccessAction: onPasteImageSuccessAction,
@@ -134,7 +130,6 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
                 onMouseDown: onMouseDown,
                 onEditorSettings: onEditorSettings,
                 onEditorTextSizeChanged: onEditorTextSizeChanged,
-                width: width,
                 height: height,
                 onDragEnter: onDragEnter,
                 onPasteImageSuccessAction: onPasteImageSuccessAction,
@@ -171,7 +166,6 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
               onMouseDown: onMouseDown,
               onEditorSettings: onEditorSettings,
               onEditorTextSizeChanged: onEditorTextSizeChanged,
-              width: width,
               height: height,
               onDragEnter: onDragEnter,
               onPasteImageSuccessAction: onPasteImageSuccessAction,
@@ -203,7 +197,6 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
                 onMouseDown: onMouseDown,
                 onEditorSettings: onEditorSettings,
                 onEditorTextSizeChanged: onEditorTextSizeChanged,
-                width: width,
                 height: height,
                 onDragEnter: onDragEnter,
                 onPasteImageSuccessAction: onPasteImageSuccessAction,
@@ -225,7 +218,6 @@ class WebEditorView extends StatelessWidget with EditorViewMixin {
           onMouseDown: onMouseDown,
           onEditorSettings: onEditorSettings,
           onEditorTextSizeChanged: onEditorTextSizeChanged,
-          width: width,
           height: height,
           onDragEnter: onDragEnter,
           onPasteImageSuccessAction: onPasteImageSuccessAction,

lib/features/composer/presentation/widgets/web/web_editor_widget.dart

@@ -9,7 +9,7 @@ import 'package:universal_html/html.dart' hide VoidCallback;
 
 typedef OnChangeContentEditorAction = Function(String? text);
 typedef OnInitialContentEditorAction = Function(String text);
-typedef OnMouseDownEditorAction = Function(BuildContext context);
+typedef OnMouseDownEditorAction = Function();
 typedef OnEditorSettingsChange = Function(EditorSettings settings);
 typedef OnEditorTextSizeChanged = Function(int? size);
 typedef OnDragEnterListener = Function(List<dynamic>? types);
@@ -32,7 +32,6 @@ class WebEditorWidget extends StatefulWidget {
   final OnMouseDownEditorAction? onMouseDown;
   final OnEditorSettingsChange? onEditorSettings;
   final OnEditorTextSizeChanged? onEditorTextSizeChanged;
-  final double? width;
   final double? height;
   final OnDragEnterListener? onDragEnter;
   final OnPasteImageSuccessAction? onPasteImageSuccessAction;
@@ -51,7 +50,6 @@ class WebEditorWidget extends StatefulWidget {
     this.onMouseDown,
     this.onEditorSettings,
     this.onEditorTextSizeChanged,
-    this.width,
     this.height,
     this.onDragEnter,
     this.onPasteImageSuccessAction,
@@ -65,14 +63,9 @@ class WebEditorWidget extends StatefulWidget {
 
 class _WebEditorState extends State<WebEditorWidget> {
 
-  static const double _offsetHeight = 50;
-  static const double _offsetWidth = 90;
   static const double _defaultHtmlEditorHeight = 550;
 
   late HtmlEditorController _editorController;
-  double? dropZoneWidth;
-  double? dropZoneHeight;
-  final ValueNotifier<double> _htmlEditorHeight = ValueNotifier(_defaultHtmlEditorHeight);
   bool _dropListenerRegistered = false;
   Function(Event)? _dropListener;
 
@@ -80,16 +73,6 @@ class _WebEditorState extends State<WebEditorWidget> {
   void initState() {
     super.initState();
     _editorController = widget.editorController;
-    log('_WebEditorState::initState:height: ${widget.height} | width: ${widget.width}');
-    if (widget.height != null) {
-      dropZoneHeight = widget.height! - _offsetHeight;
-      _htmlEditorHeight.value = widget.height ?? _defaultHtmlEditorHeight;
-    }
-    if (widget.width != null) {
-      dropZoneWidth = widget.width! - _offsetWidth;
-    }
-    log('_WebEditorState::initState:dropZoneWidth: $dropZoneWidth | dropZoneHeight: $dropZoneHeight');
-
     _dropListener = (event) {
       if (event is MessageEvent) {
         if (jsonDecode(event.data)['name'] == HtmlUtils.registerDropListener.name) {
@@ -108,18 +91,11 @@ class _WebEditorState extends State<WebEditorWidget> {
     if (oldWidget.direction != widget.direction) {
       _editorController.updateBodyDirection(widget.direction.name);
     }
-
-    log('_EmailEditorState::didUpdateWidget():Old: ${oldWidget.height} | current: ${widget.height}');
-
-    if (oldWidget.height != widget.height) {
-      _htmlEditorHeight.value = widget.height ?? _defaultHtmlEditorHeight;
-    }
     super.didUpdateWidget(oldWidget);
   }
 
   @override
   void dispose() {
-    _htmlEditorHeight.dispose();
     _editorController.evaluateJavascriptWeb(
       HtmlUtils.unregisterDropListener.name);
     if (_dropListener != null) {
@@ -131,72 +107,64 @@ class _WebEditorState extends State<WebEditorWidget> {
 
   @override
   Widget build(BuildContext context) {
-    return ValueListenableBuilder(
+    return HtmlEditor(
-      valueListenable: _htmlEditorHeight,
+      controller: _editorController,
-      builder: (context, height, _) {
+      htmlEditorOptions: HtmlEditorOptions(
-        return HtmlEditor(
+        shouldEnsureVisible: true,
-          key: Key('web_editor_$height'),
+        hint: '',
-          controller: _editorController,
+        darkMode: false,
-          htmlEditorOptions: HtmlEditorOptions(
+        initialText: widget.content,
-            shouldEnsureVisible: true,
+        customBodyCssStyle: HtmlUtils.customCssStyleHtmlEditor(direction: widget.direction),
-            hint: '',
+        spellCheck: true,
-            darkMode: false,
+        disableDragAndDrop: true,
-            initialText: widget.content,
+        webInitialScripts: UnmodifiableListView([
-            customBodyCssStyle: HtmlUtils.customCssStyleHtmlEditor(direction: widget.direction),
+          WebScript(
-            spellCheck: true,
+            name: HtmlUtils.lineHeight100Percent.name,
-            disableDragAndDrop: true,
+            script: HtmlUtils.lineHeight100Percent.script,
-            webInitialScripts: UnmodifiableListView([
-              WebScript(
-                name: HtmlUtils.lineHeight100Percent.name,
-                script: HtmlUtils.lineHeight100Percent.script,
-              ),
-              WebScript(
-                name: HtmlUtils.registerDropListener.name,
-                script: HtmlUtils.registerDropListener.script,
-              ),
-              WebScript(
-                name: HtmlUtils.unregisterDropListener.name,
-                script: HtmlUtils.unregisterDropListener.script,
-              )
-            ])
           ),
-          htmlToolbarOptions: const HtmlToolbarOptions(
+          WebScript(
-            toolbarType: ToolbarType.hide,
+            name: HtmlUtils.registerDropListener.name,
-            defaultToolbarButtons: [],
+            script: HtmlUtils.registerDropListener.script,
           ),
-          otherOptions: OtherOptions(
+          WebScript(
-            height: height,
+            name: HtmlUtils.unregisterDropListener.name,
-            // dropZoneWidth: dropZoneWidth,
+            script: HtmlUtils.unregisterDropListener.script,
-            // dropZoneHeight: dropZoneHeight,
+          )
-          ),
+        ])
-          callbacks: Callbacks(
+      ),
-            onBeforeCommand: widget.onChangeContent,
+      htmlToolbarOptions: const HtmlToolbarOptions(
-            onChangeContent: widget.onChangeContent,
+        toolbarType: ToolbarType.hide,
-            onInit: () {
+        defaultToolbarButtons: [],
-              widget.onInitial?.call(widget.content);
+      ),
-              if (!_dropListenerRegistered) {
+      otherOptions: OtherOptions(
-                _editorController.evaluateJavascriptWeb(
+        height: widget.height ?? _defaultHtmlEditorHeight,
-                  HtmlUtils.registerDropListener.name);
+      ),
-                _dropListenerRegistered = true;
+      callbacks: Callbacks(
-              }
+        onBeforeCommand: widget.onChangeContent,
-            },
+        onChangeContent: widget.onChangeContent,
-            onFocus: widget.onFocus,
+        onInit: () {
-            onBlur: widget.onUnFocus,
+          widget.onInitial?.call(widget.content);
-            onMouseDown: () => widget.onMouseDown?.call(context),
+          if (!_dropListenerRegistered) {
-            onChangeSelection: widget.onEditorSettings,
+            _editorController.evaluateJavascriptWeb(
-            onChangeCodeview: widget.onChangeContent,
+              HtmlUtils.registerDropListener.name);
-            onTextFontSizeChanged: widget.onEditorTextSizeChanged,
+            _dropListenerRegistered = true;
-            onPaste: () => _editorController.evaluateJavascriptWeb(
+          }
-              HtmlUtils.lineHeight100Percent.name
+        },
-            ),
+        onFocus: widget.onFocus,
-            onDragEnter: widget.onDragEnter,
+        onUnFocus: widget.onUnFocus,
-            onDragLeave: (_) {},
+        onMouseDown:widget.onMouseDown,
-            onImageUpload: widget.onPasteImageSuccessAction,
+        onChangeSelection: widget.onEditorSettings,
-            onImageUploadError: widget.onPasteImageFailureAction,
+        onChangeCodeview: widget.onChangeContent,
-            onInitialTextLoadComplete: widget.onInitialContentLoadComplete,
+        onTextFontSizeChanged: widget.onEditorTextSizeChanged,
-          ),
+        onPaste: () => _editorController.evaluateJavascriptWeb(
-        );
+          HtmlUtils.lineHeight100Percent.name
-      }
+        ),
+        onDragEnter: widget.onDragEnter,
+        onDragLeave: (_) {},
+        onImageUpload: widget.onPasteImageSuccessAction,
+        onImageUploadError: widget.onPasteImageFailureAction,
+        onInitialTextLoadComplete: widget.onInitialContentLoadComplete,
+      ),
     );
   }
 }

pubspec.lock

@@ -1171,10 +1171,10 @@ packages:
     description:
       path: "."
       ref: main
-      resolved-ref: "3274d7fe8c711e7466890b6a3948e9708877ca4a"
+      resolved-ref: "2572e5cea909c64b00f98cb49b07423dbab36b37"
       url: "https://github.com/linagora/html-editor-enhanced.git"
     source: git
-    version: "3.1.1"
+    version: "3.1.3"
   http:
     dependency: transitive
     description: