From 867e758d88a2a5656a2435163eb5f33c397358d6 Mon Sep 17 00:00:00 2001
From: dab246 <tdvu@linagora.com>
Date: Mon, 25 Mar 2024 14:52:23 +0700
Subject: [PATCH] TF-2717 Display attachment bar below subject field on
 landscape mobile

---
 .../attachment_item_composer_widget.dart      |  4 +-
 .../mobile_attachment_composer_widget.dart    | 83 ++++++++++++++-----
 2 files changed, 67 insertions(+), 20 deletions(-)

diff --git a/lib/features/composer/presentation/widgets/attachment_item_composer_widget.dart b/lib/features/composer/presentation/widgets/attachment_item_composer_widget.dart
index 548b93474..18f480254 100644
--- a/lib/features/composer/presentation/widgets/attachment_item_composer_widget.dart
+++ b/lib/features/composer/presentation/widgets/attachment_item_composer_widget.dart
@@ -21,6 +21,7 @@ class AttachmentItemComposerWidget extends StatelessWidget with AppLoaderMixin {
   final UploadFileState fileState;
   final double? maxWidth;
   final EdgeInsetsGeometry? itemMargin;
+  final EdgeInsetsGeometry? itemPadding;
   final OnDeleteAttachmentAction? onDeleteAttachmentAction;
   final Widget? buttonAction;
 
@@ -29,6 +30,7 @@ class AttachmentItemComposerWidget extends StatelessWidget with AppLoaderMixin {
     required this.fileState,
     this.maxWidth,
     this.itemMargin,
+    this.itemPadding,
     this.buttonAction,
     this.onDeleteAttachmentAction,
   });
@@ -42,7 +44,7 @@ class AttachmentItemComposerWidget extends StatelessWidget with AppLoaderMixin {
         color: AttachmentItemComposerWidgetStyle.backgroundColor
       ),
       width: AttachmentItemComposerWidgetStyle.width,
-      padding: AttachmentItemComposerWidgetStyle.padding,
+      padding: itemPadding ?? AttachmentItemComposerWidgetStyle.padding,
       margin: itemMargin,
       child: Row(
         children: [
diff --git a/lib/features/composer/presentation/widgets/mobile/mobile_attachment_composer_widget.dart b/lib/features/composer/presentation/widgets/mobile/mobile_attachment_composer_widget.dart
index 5c14f4bc4..ad2801112 100644
--- a/lib/features/composer/presentation/widgets/mobile/mobile_attachment_composer_widget.dart
+++ b/lib/features/composer/presentation/widgets/mobile/mobile_attachment_composer_widget.dart
@@ -60,25 +60,70 @@ class _MobileAttachmentComposerWidgetState extends State<MobileAttachmentCompose
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
           if (_responsiveUtils.isLandscapeMobile(context))
-            SizedBox(
-              width: _responsiveUtils.getSizeScreenWidth(context) * 0.7,
-              child: GridView.builder(
-                primary: false,
-                shrinkWrap: true,
-                itemCount: _listFileDisplayed.length,
-                gridDelegate: const SliverGridDelegateFixedHeight(
-                  height: MobileAttachmentComposerWidgetStyle.listItemHeight,
-                  crossAxisCount: MobileAttachmentComposerWidgetStyle.maxItemRow,
-                  crossAxisSpacing: MobileAttachmentComposerWidgetStyle.listItemSpace,
+            Row(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Flexible(
+                  flex: 7,
+                  child: GridView.builder(
+                    primary: false,
+                    shrinkWrap: true,
+                    itemCount: _listFileDisplayed.length,
+                    gridDelegate: const SliverGridDelegateFixedHeight(
+                      height: MobileAttachmentComposerWidgetStyle.listItemHeight,
+                      crossAxisCount: MobileAttachmentComposerWidgetStyle.maxItemRow,
+                      crossAxisSpacing: MobileAttachmentComposerWidgetStyle.listItemSpace,
+                    ),
+                    itemBuilder: (context, index) {
+                      return AttachmentItemComposerWidget(
+                        fileState: _listFileDisplayed[index],
+                        itemMargin: MobileAttachmentComposerWidgetStyle.itemMargin,
+                        itemPadding: const EdgeInsets.symmetric(horizontal: 8),
+                        onDeleteAttachmentAction: widget.onDeleteAttachmentAction
+                      );
+                    }
+                  )
                 ),
-                itemBuilder: (context, index) {
-                  return AttachmentItemComposerWidget(
-                    fileState: _listFileDisplayed[index],
-                    itemMargin: MobileAttachmentComposerWidgetStyle.itemMargin,
-                    onDeleteAttachmentAction: widget.onDeleteAttachmentAction
-                  );
-                }
-              ),
+                Flexible(
+                  flex: 3,
+                  child: _isExceededDisplayedAttachments
+                    ? Row(
+                        children: [
+                          if (!_isCollapsed)
+                            TMailButtonWidget(
+                              text: AppLocalizations.of(context).showLess,
+                              icon: _imagePaths.icChevronUp,
+                              iconAlignment: TextDirection.rtl,
+                              iconSpace: 2,
+                              iconSize: 24,
+                              iconColor: AppColor.primaryColor,
+                              backgroundColor: Colors.transparent,
+                              textStyle: Theme.of(context).textTheme.labelSmall?.copyWith(
+                                fontSize: 15,
+                                color: AppColor.primaryColor
+                              ),
+                              padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 8),
+                              margin: const EdgeInsetsDirectional.only(start: 8, top: 10),
+                              onTapActionCallback: _toggleListAttachments
+                            )
+                          else
+                            TMailButtonWidget.fromText(
+                              text: AppLocalizations.of(context).showMoreAttachment(_countRemainingAttachments),
+                              backgroundColor: Colors.transparent,
+                              textStyle: Theme.of(context).textTheme.labelSmall?.copyWith(
+                                fontSize: 15,
+                                color: AppColor.primaryColor
+                              ),
+                              padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 8),
+                              margin: const EdgeInsetsDirectional.only(start: 8, top: 10),
+                              onTapActionCallback: _toggleListAttachments
+                            ),
+                          const Spacer(),
+                        ],
+                      )
+                    : const SizedBox.shrink()
+                )
+              ],
             )
           else
             ...[
@@ -122,7 +167,7 @@ class _MobileAttachmentComposerWidgetState extends State<MobileAttachmentCompose
               ),
               if (_isCollapsed && _isExceededDisplayedAttachments)
                 TMailButtonWidget.fromText(
-                  text: AppLocalizations.of(context).showMore(_countRemainingAttachments),
+                  text: AppLocalizations.of(context).showMoreAttachment(_countRemainingAttachments),
                   backgroundColor: Colors.transparent,
                   textStyle: Theme.of(context).textTheme.labelSmall?.copyWith(
                     fontSize: 15,