TF-858 Apply rich text keyboard button for mobile on vacation

lib/features/manage_account/presentation/vacation/vacation_controller.dart

@@ -2,6 +2,7 @@ import 'package:core/core.dart';
 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
 import 'package:jmap_dart_client/jmap/mail/vacation/vacation_response.dart';
+import 'package:rich_text_composer/richtext_controller.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';
@@ -42,6 +43,7 @@ class VacationController extends BaseController {
 
   final messageTextController = TextEditingController();
   final subjectTextController = TextEditingController();
+  final richTextControllerForMobile = RichTextController();
 
   VacationResponse? currentVacation;
   String? _vacationMessageHtmlText;
@@ -121,7 +123,11 @@ class VacationController extends BaseController {
     messageTextController.text = newVacation.messagePlainText ?? '';
     subjectTextController.text = newVacation.subject ?? '';
     updateMessageHtmlText(newVacation.messageHtmlText ?? '');
+    if (BuildUtils.isWeb) {
       _richTextControllerForWeb.editorController.setText(newVacation.messageHtmlText ?? '');
+    } else {
+      richTextControllerForMobile.htmlEditorApi?.setText(newVacation.messageHtmlText ?? '');
+    }
   }
 
   bool get isVacationDeactivated => !vacationPresentation.value.isEnabled;
@@ -235,7 +241,7 @@ class VacationController extends BaseController {
     errorMessageBody.value = _getErrorStringByInputValue(context, value);
   }
 
-  void saveVacation(BuildContext context) {
+  void saveVacation(BuildContext context) async {
     FocusScope.of(context).unfocus();
 
     if (vacationPresentation.value.isEnabled) {
@@ -261,7 +267,7 @@ class VacationController extends BaseController {
       }
 
       final messagePlainText = messageTextController.text;
-      final messageHtmlText = _vacationMessageHtmlText ?? '';
+      final messageHtmlText = (BuildUtils.isWeb ? _vacationMessageHtmlText : await _getMessageHtmlText()) ?? '';
       if (messagePlainText.isEmpty && messageHtmlText.isEmpty) {
         _appToast.showToastWithIcon(
             context,
@@ -319,24 +325,36 @@ class VacationController extends BaseController {
 
   void updateMessageHtmlText(String? text) => _vacationMessageHtmlText = text;
 
-  Future<String?> _getMessageHtmlText() {
+  Future<String>? _getMessageHtmlText() {
+    if (BuildUtils.isWeb) {
       return _richTextControllerForWeb.editorController.getText();
+    } else {
+      return richTextControllerForMobile.htmlEditorApi?.getText();
+    }
   }
 
-  void selectVacationMessageType(BuildContext context, VacationMessageType newMessageType) async {
+  void selectVacationMessageType(BuildContext context, VacationMessageType newMessageType) {
     if (newMessageType == VacationMessageType.plainText && !BuildUtils.isWeb) {
-      final messageHtml = await _getMessageHtmlText();
+      _storeMessageHtmlTextOnMobile();
-      updateMessageHtmlText(messageHtml);
     }
     clearFocusEditor(context);
     vacationMessageType.value = newMessageType;
   }
 
+  void _storeMessageHtmlTextOnMobile() async {
+    final messageHtml = await _getMessageHtmlText();
+    updateMessageHtmlText(messageHtml);
+  }
+
   void clearFocusEditor(BuildContext context) {
+    if (!BuildUtils.isWeb) {
+      richTextControllerForMobile.htmlEditorApi?.unfocus();
+    }
     FocusScope.of(context).unfocus();
   }
 
-  void backToUniversalSettings() {
+  void backToUniversalSettings(BuildContext context) {
+    clearFocusEditor(context);
     _settingController.backToUniversalSettings();
   }
 
@@ -344,6 +362,7 @@ class VacationController extends BaseController {
   void onClose() {
     messageTextController.dispose();
     subjectTextController.dispose();
+    richTextControllerForMobile.dispose();
     vacationWorker.dispose();
     VacationControllerBindings().dispose();
     super.onClose();

lib/features/manage_account/presentation/vacation/vacation_view.dart

@@ -1,9 +1,12 @@
 
 import 'package:core/core.dart';
+import 'package:enough_html_editor/enough_html_editor.dart' as html_editor_mobile;
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:get/get.dart';
 import 'package:pointer_interceptor/pointer_interceptor.dart';
+import 'package:rich_text_composer/rich_text_composer.dart';
+import 'package:rich_text_composer/views/widgets/rich_text_keyboard_toolbar.dart';
 import 'package:tmail_ui_user/features/base/widget/border_button_field.dart';
 import 'package:tmail_ui_user/features/base/widget/text_input_decoration_builder.dart';
 import 'package:tmail_ui_user/features/base/widget/text_input_field_builder.dart';
@@ -32,6 +35,18 @@ class VacationView extends GetWidget<VacationController> with RichTextButtonMixi
           : Colors.white,
       body: GestureDetector(
         onTap: () => FocusScope.of(context).unfocus(),
+        child: KeyboardRichText(
+          richTextController: controller.richTextControllerForMobile,
+          backgroundKeyboardToolBarColor: Colors.grey,
+          keyBroadToolbar: RichTextKeyboardToolBar(
+            titleFormatBottomSheet: AppLocalizations.of(context).format,
+            richTextController: controller.richTextControllerForMobile,
+            insertImage: () {},
+            insertAttachment: () {},
+            titleQuickStyleBottomSheet: AppLocalizations.of(context).quickStyles,
+            titleBackgroundBottomSheet: AppLocalizations.of(context).background,
+            titleForegroundBottomSheet: AppLocalizations.of(context).foreground,
+          ),
           child: Container(
             width: double.infinity,
             height: double.infinity,
@@ -275,6 +290,7 @@ class VacationView extends GetWidget<VacationController> with RichTextButtonMixi
             ),
           ),
         ),
+      ),
     );
   }
 
@@ -308,7 +324,7 @@ class VacationView extends GetWidget<VacationController> with RichTextButtonMixi
                 width: 156,
                 height: 44,
                 radius: 10,
-                onTap: () => controller.backToUniversalSettings()),
+                onTap: () => controller.backToUniversalSettings(context)),
           ),
           const SizedBox(width: 12),
           Expanded(
@@ -338,7 +354,7 @@ class VacationView extends GetWidget<VacationController> with RichTextButtonMixi
               width: 156,
               height: 44,
               radius: 10,
-              onTap: () => controller.backToUniversalSettings()),
+              onTap: () => controller.backToUniversalSettings(context)),
           const SizedBox(width: 12),
           buildTextButton(
               AppLocalizations.of(context).saveChanges,
@@ -385,6 +401,7 @@ class VacationView extends GetWidget<VacationController> with RichTextButtonMixi
           padding: const EdgeInsets.only(left: 12, right: 12, top: 12),
           child: Column(children: [
             _buildMessageHtmlTextEditor(context),
+            if (BuildUtils.isWeb)
               Center(child: Obx(() {
                 return PointerInterceptor(
                   child: buildToolbarRichTextForWeb(
@@ -450,7 +467,13 @@ class VacationView extends GetWidget<VacationController> with RichTextButtonMixi
         ),
       );
     } else {
-      return const SizedBox.shrink();
+      return html_editor_mobile.HtmlEditor(
+          key: const Key('vacation_message_html_text_editor_mobile'),
+          minHeight: 150,
+          addDefaultSelectionMenuItems: false,
+          initialContent: controller.vacationMessageHtmlText ?? '',
+          onCreated: controller.richTextControllerForMobile.onCreateHTMLEditor
+      );
     }
   }
 

lib/features/manage_account/presentation/vacation/widgets/vacation_notification_message_widget.dart

@@ -106,7 +106,7 @@ class VacationNotificationMessageWidget extends StatelessWidget {
         if (leadingIcon != null) leadingIcon!,
         Expanded(
             child: Padding(
-              padding: const EdgeInsets.only(top: 8, right: 12),
+              padding: const EdgeInsets.only(right: 12),
               child: Center(
                 child: Text(
                     vacationResponse.getNotificationMessage(context),

lib/l10n/intl_messages.arb

@@ -1,5 +1,5 @@
 {
-  "@@last_modified": "2022-09-20T13:44:48.613115",
+  "@@last_modified": "2022-09-30T16:41:42.005040",
   "initializing_data": "Initializing data...",
   "@initializing_data": {
     "type": "text",
@@ -2197,5 +2197,29 @@
     "type": "text",
     "placeholders_order": [],
     "placeholders": {}
+  },
+  "quickStyles": "Quick styles",
+  "@quickStyles": {
+    "type": "text",
+    "placeholders_order": [],
+    "placeholders": {}
+  },
+  "format": "Format",
+  "@format": {
+    "type": "text",
+    "placeholders_order": [],
+    "placeholders": {}
+  },
+  "background": "Background",
+  "@background": {
+    "type": "text",
+    "placeholders_order": [],
+    "placeholders": {}
+  },
+  "foreground": "Foreground",
+  "@foreground": {
+    "type": "text",
+    "placeholders_order": [],
+    "placeholders": {}
   }
 }

lib/main/localizations/app_localizations.dart

@@ -2271,4 +2271,32 @@ class AppLocalizations {
         name: 'hintSearchInputContact'
     );
   }
+
+  String get quickStyles {
+    return Intl.message(
+        'Quick styles',
+        name: 'quickStyles'
+    );
+  }
+
+  String get format {
+    return Intl.message(
+        'Format',
+        name: 'format'
+    );
+  }
+
+  String get background {
+    return Intl.message(
+        'Background',
+        name: 'background'
+    );
+  }
+
+  String get foreground {
+    return Intl.message(
+        'Foreground',
+        name: 'foreground'
+    );
+  }
 }

pubspec.lock

@@ -1083,6 +1083,15 @@ packages:
       url: "https://github.com/KasemJaffer/receive_sharing_intent.git"
     source: git
     version: "1.4.5"
+  rich_text_composer:
+    dependency: "direct main"
+    description:
+      path: "."
+      ref: master
+      resolved-ref: "85fe10cd4d3b29bbf803ac796ebe722710fa1d36"
+      url: "https://github.com/linagora/rich-text-composer.git"
+    source: git
+    version: "0.0.1"
   rule_filter:
     dependency: "direct main"
     description:

pubspec.yaml

@@ -139,6 +139,11 @@ dependencies:
       url: https://github.com/linagora/html-editor-enhanced.git
       ref: email_supported
 
+  rich_text_composer:
+    git:
+      url: https://github.com/linagora/rich-text-composer.git
+      ref: master
+
   # fk_user_agent
   fk_user_agent: 2.1.0