From e139e1ec94cb87cef5363aed32368d3cf9d3ea06 Mon Sep 17 00:00:00 2001 From: dab246 Date: Tue, 30 Jan 2024 02:51:54 +0700 Subject: [PATCH] TF-2475 Handle format style rich text in composer --- .../presentation/composer_controller.dart | 14 ++-- .../rich_text_mobile_tablet_controller.dart | 10 +-- .../view/mobile/tablet_container_view.dart | 76 ++++++++++--------- .../identity_creator_controller.dart | 2 +- .../presentation/identity_creator_view.dart | 11 ++- .../vacation/vacation_controller.dart | 3 +- .../presentation/vacation/vacation_view.dart | 10 +-- pubspec.lock | 2 +- 8 files changed, 68 insertions(+), 60 deletions(-) diff --git a/lib/features/composer/presentation/composer_controller.dart b/lib/features/composer/presentation/composer_controller.dart index 1ae8c7627..74e4ea7ec 100644 --- a/lib/features/composer/presentation/composer_controller.dart +++ b/lib/features/composer/presentation/composer_controller.dart @@ -454,8 +454,7 @@ class ComposerController extends BaseController with DragDropFileMixin { richTextMobileTabletController?.richTextController.onCreateHTMLEditor( editorApi, onEnterKeyDown: _onEnterKeyDown, - context: context, - onFocus: _onEditorFocusOnMobile, + onFocus: () => _onEditorFocusOnMobile(context), onChangeCursor: (coordinates) { _onChangeCursorOnMobile(coordinates, context); }, @@ -1319,7 +1318,6 @@ class ComposerController extends BaseController with DragDropFileMixin { log('ComposerController::clearFocus:'); if (PlatformInfo.isMobile) { htmlEditorApi?.unfocus(); - KeyboardUtils.hideSystemKeyboardMobile(); } FocusScope.of(context).unfocus(); } @@ -1508,7 +1506,7 @@ class ComposerController extends BaseController with DragDropFileMixin { } _closeSuggestionBox(); if (PlatformInfo.isMobile) { - htmlEditorApi?.unfocus(); + richTextMobileTabletController?.richTextController.hideRichTextView(); } } else { switch(prefixEmailAddress) { @@ -1647,7 +1645,13 @@ class ComposerController extends BaseController with DragDropFileMixin { _closeComposerAction(); } - void _onEditorFocusOnMobile() { + Future _onEditorFocusOnMobile(BuildContext context) async { + if (PlatformInfo.isAndroid) { + FocusScope.of(context).unfocus(); + await Future.delayed( + const Duration(milliseconds: 300), + richTextMobileTabletController?.richTextController.showDeviceKeyboard); + } _collapseAllRecipient(); _autoCreateEmailTag(); } diff --git a/lib/features/composer/presentation/controller/rich_text_mobile_tablet_controller.dart b/lib/features/composer/presentation/controller/rich_text_mobile_tablet_controller.dart index 953cea15b..75c626c69 100644 --- a/lib/features/composer/presentation/controller/rich_text_mobile_tablet_controller.dart +++ b/lib/features/composer/presentation/controller/rich_text_mobile_tablet_controller.dart @@ -61,12 +61,12 @@ class RichTextMobileTabletController extends BaseRichTextController { } if (context.mounted) { - richTextController?.showRichTextBottomSheet( + richTextController?.showFormatOptionBottomSheet( context: context, - titleFormatBottomSheet: AppLocalizations.of(context).titleFormat, - titleQuickStyleBottomSheet: AppLocalizations.of(context).titleQuickStyles, - titleForegroundBottomSheet: AppLocalizations.of(context).titleForeground, - titleBackgroundBottomSheet: AppLocalizations.of(context).titleBackground, + formatLabel: AppLocalizations.of(context).titleFormat, + quickStyleLabel: AppLocalizations.of(context).titleQuickStyles, + foregroundLabel: AppLocalizations.of(context).titleForeground, + backgroundLabel: AppLocalizations.of(context).titleBackground, ); } } diff --git a/lib/features/composer/presentation/view/mobile/tablet_container_view.dart b/lib/features/composer/presentation/view/mobile/tablet_container_view.dart index 511599fff..bf4af0e94 100644 --- a/lib/features/composer/presentation/view/mobile/tablet_container_view.dart +++ b/lib/features/composer/presentation/view/mobile/tablet_container_view.dart @@ -1,6 +1,7 @@ import 'package:core/presentation/utils/responsive_utils.dart'; import 'package:core/utils/app_logger.dart'; import 'package:flutter/material.dart'; +import 'package:flutter_portal/flutter_portal.dart'; import 'package:get/get.dart'; import 'package:rich_text_composer/rich_text_composer.dart'; import 'package:rich_text_composer/views/widgets/rich_text_keyboard_toolbar.dart'; @@ -40,45 +41,48 @@ class TabletContainerView extends StatelessWidget { } }, canPop: false, - child: GestureDetector( - onTap: onClearFocusAction, - child: Scaffold( - backgroundColor: TabletContainerViewStyle.outSideBackgroundColor, - body: LayoutBuilder(builder: (context, constraints) { - return KeyboardRichText( - richTextController: keyboardRichTextController, - keyBroadToolbar: RichTextKeyboardToolBar( - backgroundKeyboardToolBarColor: TabletContainerViewStyle.keyboardToolbarBackgroundColor, - isLandScapeMode: _responsiveUtils.isLandscapeMobile(context), - insertAttachment: onAttachFileAction, - insertImage: onInsertImageAction != null - ? () => onInsertImageAction!(constraints) - : null, + child: Portal( + child: GestureDetector( + onTap: onClearFocusAction, + child: Scaffold( + backgroundColor: TabletContainerViewStyle.outSideBackgroundColor, + body: SafeArea( + child: LayoutBuilder(builder: (context, constraints) { + return KeyboardRichText( richTextController: keyboardRichTextController, - titleQuickStyleBottomSheet: AppLocalizations.of(context).titleQuickStyles, - titleBackgroundBottomSheet: AppLocalizations.of(context).titleBackground, - titleForegroundBottomSheet: AppLocalizations.of(context).titleForeground, - titleFormatBottomSheet: AppLocalizations.of(context).titleFormat, - titleBack: AppLocalizations.of(context).format, - ), - paddingChild: EdgeInsets.zero, - child: Center( - child: Card( - elevation: TabletContainerViewStyle.elevation, - margin: TabletContainerViewStyle.getMargin(context, _responsiveUtils), - shape: const RoundedRectangleBorder( - borderRadius: BorderRadius.all(Radius.circular(TabletContainerViewStyle.radius)) - ), - clipBehavior: Clip.antiAlias, - child: Container( - color: TabletContainerViewStyle.backgroundColor, - width: TabletContainerViewStyle.getWidth(context, _responsiveUtils), - child: childBuilder.call(context, constraints) + keyBroadToolbar: RichTextKeyboardToolBar( + rootContext: context, + backgroundKeyboardToolBarColor: TabletContainerViewStyle.keyboardToolbarBackgroundColor, + insertAttachment: onAttachFileAction, + insertImage: onInsertImageAction != null + ? () => onInsertImageAction!(constraints) + : null, + richTextController: keyboardRichTextController, + quickStyleLabel: AppLocalizations.of(context).titleQuickStyles, + backgroundLabel: AppLocalizations.of(context).titleBackground, + foregroundLabel: AppLocalizations.of(context).titleForeground, + formatLabel: AppLocalizations.of(context).titleFormat, + titleBack: AppLocalizations.of(context).format, + ), + child: Center( + child: Card( + elevation: TabletContainerViewStyle.elevation, + margin: TabletContainerViewStyle.getMargin(context, _responsiveUtils), + shape: const RoundedRectangleBorder( + borderRadius: BorderRadius.all(Radius.circular(TabletContainerViewStyle.radius)) + ), + clipBehavior: Clip.antiAlias, + child: Container( + color: TabletContainerViewStyle.backgroundColor, + width: TabletContainerViewStyle.getWidth(context, _responsiveUtils), + child: childBuilder.call(context, constraints) + ), ), ), - ), - ); - }) + ); + }), + ) + ), ), ) ); diff --git a/lib/features/identity_creator/presentation/identity_creator_controller.dart b/lib/features/identity_creator/presentation/identity_creator_controller.dart index 4266539e2..ceb623b05 100644 --- a/lib/features/identity_creator/presentation/identity_creator_controller.dart +++ b/lib/features/identity_creator/presentation/identity_creator_controller.dart @@ -25,6 +25,7 @@ import 'package:model/extensions/identity_extension.dart'; import 'package:model/extensions/session_extension.dart'; import 'package:path_provider/path_provider.dart'; import 'package:rich_text_composer/rich_text_composer.dart'; +import 'package:rich_text_composer/views/commons/constants.dart'; import 'package:tmail_ui_user/features/base/base_controller.dart'; import 'package:tmail_ui_user/features/composer/presentation/controller/rich_text_mobile_tablet_controller.dart'; import 'package:tmail_ui_user/features/composer/presentation/controller/rich_text_web_controller.dart'; @@ -449,7 +450,6 @@ class IdentityCreatorController extends BaseController { editorApi, onEnterKeyDown: _onEnterKeyDownOnMobile, onFocus: _onFocusHTMLEditorOnMobile, - context: context ); richTextMobileTabletController?.htmlEditorApi?.onFocusOut = () { richTextMobileTabletController?.richTextController.hideRichTextView(); diff --git a/lib/features/identity_creator/presentation/identity_creator_view.dart b/lib/features/identity_creator/presentation/identity_creator_view.dart index 042d754e4..31e1761f6 100644 --- a/lib/features/identity_creator/presentation/identity_creator_view.dart +++ b/lib/features/identity_creator/presentation/identity_creator_view.dart @@ -146,16 +146,15 @@ class IdentityCreatorView extends GetWidget backgroundKeyboardToolBarColor: PlatformInfo.isIOS ? AppColor.colorBackgroundKeyboard : AppColor.colorBackgroundKeyboardAndroid, - isLandScapeMode: controller.responsiveUtils.isLandscapeMobile(context), richTextController: controller.richTextMobileTabletController!.richTextController, - titleQuickStyleBottomSheet: AppLocalizations.of(context).titleQuickStyles, - titleBackgroundBottomSheet: AppLocalizations.of(context).titleBackground, - titleForegroundBottomSheet: AppLocalizations.of(context).titleForeground, - titleFormatBottomSheet: AppLocalizations.of(context).titleFormat, + quickStyleLabel: AppLocalizations.of(context).titleQuickStyles, + backgroundLabel: AppLocalizations.of(context).titleBackground, + foregroundLabel: AppLocalizations.of(context).titleForeground, + formatLabel: AppLocalizations.of(context).titleFormat, insertImage: () => controller.pickImage(context), + rootContext: context, ), richTextController: controller.richTextMobileTabletController!.richTextController, - paddingChild: EdgeInsets.zero, child: responsiveWidget ); } diff --git a/lib/features/manage_account/presentation/vacation/vacation_controller.dart b/lib/features/manage_account/presentation/vacation/vacation_controller.dart index 3c53e1426..a81962bfa 100644 --- a/lib/features/manage_account/presentation/vacation/vacation_controller.dart +++ b/lib/features/manage_account/presentation/vacation/vacation_controller.dart @@ -4,7 +4,8 @@ import 'package:flutter/material.dart'; import 'package:get/get.dart'; import 'package:jmap_dart_client/jmap/mail/vacation/vacation_response.dart'; import 'package:pointer_interceptor/pointer_interceptor.dart'; -import 'package:rich_text_composer/richtext_controller.dart'; +import 'package:rich_text_composer/rich_text_controller.dart'; +import 'package:rich_text_composer/views/commons/constants.dart'; import 'package:tmail_ui_user/features/base/base_controller.dart'; import 'package:tmail_ui_user/features/composer/presentation/controller/rich_text_web_controller.dart'; import 'package:tmail_ui_user/features/mailbox_creator/domain/model/verification/empty_name_validator.dart'; diff --git a/lib/features/manage_account/presentation/vacation/vacation_view.dart b/lib/features/manage_account/presentation/vacation/vacation_view.dart index fe0884df6..513e84e81 100644 --- a/lib/features/manage_account/presentation/vacation/vacation_view.dart +++ b/lib/features/manage_account/presentation/vacation/vacation_view.dart @@ -39,11 +39,12 @@ class VacationView extends GetWidget with RichTextButtonMixi backgroundKeyboardToolBarColor: PlatformInfo.isIOS ? AppColor.colorBackgroundKeyboard : AppColor.colorBackgroundKeyboardAndroid, - titleFormatBottomSheet: AppLocalizations.of(context).format, richTextController: controller.richTextControllerForMobile, - titleQuickStyleBottomSheet: AppLocalizations.of(context).quickStyles, - titleBackgroundBottomSheet: AppLocalizations.of(context).background, - titleForegroundBottomSheet: AppLocalizations.of(context).foreground, + quickStyleLabel: AppLocalizations.of(context).titleQuickStyles, + backgroundLabel: AppLocalizations.of(context).titleBackground, + foregroundLabel: AppLocalizations.of(context).titleForeground, + formatLabel: AppLocalizations.of(context).titleFormat, + rootContext: context, ), child: _buildVacationFormView(context) ); @@ -448,7 +449,6 @@ class VacationView extends GetWidget with RichTextButtonMixi htmlApi, onFocus: controller.onFocusHTMLEditor, onEnterKeyDown: controller.onEnterKeyDown, - context: context, ); } ); diff --git a/pubspec.lock b/pubspec.lock index dd5cd10ec..b20cce3c9 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -437,7 +437,7 @@ packages: description: path: "." ref: cherry-pick-fix-rich-text-format-style - resolved-ref: "8eb30137b11b1008ccd4330191b4ee5e6ac2e879" + resolved-ref: "7041e5822707ab57fcf36964c38556e2d27b06e2" url: "https://github.com/linagora/enough_html_editor.git" source: git version: "0.0.5"