TF-2717 Replace from cc bcc buttons in to by arrow down button on mobile

lib/features/composer/presentation/composer_controller.dart

@@ -2127,4 +2127,10 @@ class ComposerController extends BaseController with DragDropFileMixin {
       )
     );
   }
+
+  void handleEnableRecipientsInputAction(bool isEnabled) {
+    fromRecipientState.value = isEnabled ? PrefixRecipientState.disabled : PrefixRecipientState.enabled;
+    ccRecipientState.value = isEnabled ? PrefixRecipientState.disabled : PrefixRecipientState.enabled;
+    bccRecipientState.value = isEnabled ? PrefixRecipientState.disabled : PrefixRecipientState.enabled;
+  }
 }

lib/features/composer/presentation/composer_view.dart

@@ -127,6 +127,7 @@ class ComposerView extends GetWidget<ComposerController> {
                             onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                             onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                             onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                            onEnableAllRecipientsInputAction: controller.handleEnableRecipientsInputAction,
                           )),
                           Obx(() {
                             if (controller.ccRecipientState.value == PrefixRecipientState.enabled) {
@@ -280,6 +281,7 @@ class ComposerView extends GetWidget<ComposerController> {
                             onUpdateListEmailAddressAction: controller.updateListEmailAddress,
                             onSuggestionEmailAddress: controller.getAutoCompleteSuggestion,
                             onFocusNextAddressAction: controller.handleFocusNextAddressAction,
+                            onEnableAllRecipientsInputAction: controller.handleEnableRecipientsInputAction,
                           ),
                           if (controller.ccRecipientState.value == PrefixRecipientState.enabled)
                             RecipientComposerWidget(

lib/features/composer/presentation/styles/recipient_composer_widget_style.dart

@@ -25,6 +25,7 @@ class RecipientComposerWidgetStyle {
   static const EdgeInsetsGeometry prefixButtonPadding = EdgeInsetsDirectional.symmetric(vertical: 3, horizontal: 5);
   static const EdgeInsetsGeometry labelMargin = EdgeInsetsDirectional.only(top: 16);
   static const EdgeInsetsGeometry recipientMargin = EdgeInsetsDirectional.only(top: 12);
+  static const EdgeInsetsGeometry enableRecipientButtonMargin = EdgeInsetsDirectional.only(top: 10);
 
   static const TextStyle prefixButtonTextStyle = TextStyle(
     fontSize: 15,

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

@@ -3,6 +3,7 @@ import 'dart:async';
 import 'dart:math';
 
 import 'package:collection/collection.dart';
+import 'package:core/presentation/extensions/color_extension.dart';
 import 'package:core/presentation/resources/image_paths.dart';
 import 'package:core/presentation/utils/responsive_utils.dart';
 import 'package:core/presentation/views/button/tmail_button_widget.dart';
@@ -34,6 +35,7 @@ typedef OnShowFullListEmailAddressAction = void Function(PrefixEmailAddress pref
 typedef OnFocusEmailAddressChangeAction = void Function(PrefixEmailAddress prefix, bool isFocus);
 typedef OnRemoveDraggableEmailAddressAction = void Function(DraggableEmailAddress draggableEmailAddress);
 typedef OnDeleteTagAction = void Function(EmailAddress emailAddress);
+typedef OnEnableAllRecipientsInputAction = void Function(bool isEnabled);
 
 class RecipientComposerWidget extends StatefulWidget {
 
@@ -58,6 +60,7 @@ class RecipientComposerWidget extends StatefulWidget {
   final VoidCallback? onFocusNextAddressAction;
   final EdgeInsetsGeometry? padding;
   final EdgeInsetsGeometry? margin;
+  final OnEnableAllRecipientsInputAction? onEnableAllRecipientsInputAction;
 
   const RecipientComposerWidget({
     super.key,
@@ -82,6 +85,7 @@ class RecipientComposerWidget extends StatefulWidget {
     this.onFocusEmailAddressChangeAction,
     this.onFocusNextAddressAction,
     this.onRemoveDraggableEmailAddressAction,
+    this.onEnableAllRecipientsInputAction,
   });
 
   @override
@@ -240,7 +244,6 @@ class _RecipientComposerWidgetState extends State<RecipientComposerWidget> {
                           textInputAction: TextInputAction.done,
                           debounceDuration: RecipientComposerWidgetStyle.suggestionDebounceDuration,
                           tagSpacing: RecipientComposerWidgetStyle.tagSpacing,
-                          autofocus: widget.prefix != PrefixEmailAddress.to && _currentListEmailAddress.isEmpty,
                           minTextFieldWidth: RecipientComposerWidgetStyle.minTextFieldWidth,
                           resetTextOnSubmitted: true,
                           autoScrollToInput: false,
@@ -299,34 +302,52 @@ class _RecipientComposerWidgetState extends State<RecipientComposerWidget> {
               )
             ),
             const SizedBox(width: RecipientComposerWidgetStyle.space),
-            if (widget.prefix == PrefixEmailAddress.to && widget.fromState == PrefixRecipientState.disabled)
+            if (widget.prefix == PrefixEmailAddress.to)
-              TMailButtonWidget.fromText(
+              if (PlatformInfo.isWeb)
-                text: AppLocalizations.of(context).from_email_address_prefix,
+                ...[
-                textStyle: RecipientComposerWidgetStyle.prefixButtonTextStyle,
+                  if (widget.fromState == PrefixRecipientState.disabled)
-                backgroundColor: Colors.transparent,
+                    TMailButtonWidget.fromText(
-                padding: RecipientComposerWidgetStyle.prefixButtonPadding,
+                      text: AppLocalizations.of(context).from_email_address_prefix,
-                margin: RecipientComposerWidgetStyle.recipientMargin,
+                      textStyle: RecipientComposerWidgetStyle.prefixButtonTextStyle,
-                onTapActionCallback: () => widget.onAddEmailAddressTypeAction?.call(PrefixEmailAddress.from),
+                      backgroundColor: Colors.transparent,
-              ),
+                      padding: RecipientComposerWidgetStyle.prefixButtonPadding,
-            if (widget.prefix == PrefixEmailAddress.to && widget.ccState == PrefixRecipientState.disabled)
+                      margin: RecipientComposerWidgetStyle.recipientMargin,
-              TMailButtonWidget.fromText(
+                      onTapActionCallback: () => widget.onAddEmailAddressTypeAction?.call(PrefixEmailAddress.from),
-                text: AppLocalizations.of(context).cc_email_address_prefix,
+                    ),
-                textStyle: RecipientComposerWidgetStyle.prefixButtonTextStyle,
+                  if (widget.ccState == PrefixRecipientState.disabled)
-                backgroundColor: Colors.transparent,
+                    TMailButtonWidget.fromText(
-                padding: RecipientComposerWidgetStyle.prefixButtonPadding,
+                      text: AppLocalizations.of(context).cc_email_address_prefix,
-                margin: RecipientComposerWidgetStyle.recipientMargin,
+                      textStyle: RecipientComposerWidgetStyle.prefixButtonTextStyle,
-                onTapActionCallback: () => widget.onAddEmailAddressTypeAction?.call(PrefixEmailAddress.cc),
+                      backgroundColor: Colors.transparent,
-              ),
+                      padding: RecipientComposerWidgetStyle.prefixButtonPadding,
-            if (widget.prefix == PrefixEmailAddress.to && widget.bccState == PrefixRecipientState.disabled)
+                      margin: RecipientComposerWidgetStyle.recipientMargin,
-              TMailButtonWidget.fromText(
+                      onTapActionCallback: () => widget.onAddEmailAddressTypeAction?.call(PrefixEmailAddress.cc),
-                text: AppLocalizations.of(context).bcc_email_address_prefix,
+                    ),
-                textStyle: RecipientComposerWidgetStyle.prefixButtonTextStyle,
+                  if (widget.bccState == PrefixRecipientState.disabled)
-                backgroundColor: Colors.transparent,
+                    TMailButtonWidget.fromText(
-                padding: RecipientComposerWidgetStyle.prefixButtonPadding,
+                      text: AppLocalizations.of(context).bcc_email_address_prefix,
-                margin: RecipientComposerWidgetStyle.recipientMargin,
+                      textStyle: RecipientComposerWidgetStyle.prefixButtonTextStyle,
-                onTapActionCallback: () => widget.onAddEmailAddressTypeAction?.call(PrefixEmailAddress.bcc),
+                      backgroundColor: Colors.transparent,
-              ),
+                      padding: RecipientComposerWidgetStyle.prefixButtonPadding,
-            if (widget.prefix != PrefixEmailAddress.to)
+                      margin: RecipientComposerWidgetStyle.recipientMargin,
+                      onTapActionCallback: () => widget.onAddEmailAddressTypeAction?.call(PrefixEmailAddress.bcc),
+                    ),
+                ]
+              else if (PlatformInfo.isMobile)
+                ...[
+                  TMailButtonWidget.fromIcon(
+                    icon: _isAllRecipientInputEnabled
+                      ? _imagePaths.icChevronUp
+                      : _imagePaths.icChevronDown,
+                    backgroundColor: Colors.transparent,
+                    iconSize: 20,
+                    padding: const EdgeInsets.all(5),
+                    iconColor: AppColor.colorLabelComposer,
+                    margin: RecipientComposerWidgetStyle.enableRecipientButtonMargin,
+                    onTapActionCallback: () => widget.onEnableAllRecipientsInputAction?.call(_isAllRecipientInputEnabled),
+                  )
+                ]
+            else if (PlatformInfo.isWeb)
               TMailButtonWidget.fromIcon(
                 icon: _imagePaths.icClose,
                 backgroundColor: Colors.transparent,
@@ -344,6 +365,10 @@ class _RecipientComposerWidgetState extends State<RecipientComposerWidget> {
 
   bool get _isCollapse => _currentListEmailAddress.length > 1 && widget.expandMode == ExpandMode.COLLAPSE;
 
+  bool get _isAllRecipientInputEnabled => widget.fromState == PrefixRecipientState.enabled &&
+    widget.ccState == PrefixRecipientState.enabled &&
+    widget.bccState == PrefixRecipientState.enabled;
+
   List<EmailAddress> get _collapsedListEmailAddress => _isCollapse
     ? _currentListEmailAddress.sublist(0, 1)
     : _currentListEmailAddress;