TF-3472 Prevent attachments from wrapping 2nd line

lib/features/email/presentation/styles/attachment/attachment_item_widget_style.dart

@@ -31,4 +31,23 @@ class AttachmentItemWidgetStyle {
     color: AppColor.attachmentFileSizeColor,
     fontWeight: FontWeight.normal
   );
+
+  static double getMaxWidthItem({
+    required bool platformIsMobile,
+    required bool responsiveIsMobile,
+    required bool responsiveIsTablet,
+    required bool responsiveIsTabletLarge,
+  }) {
+    if (platformIsMobile) {
+      return responsiveIsMobile ? maxWidthMobile : maxWidthTablet;
+    } else {
+      if (responsiveIsTabletLarge) {
+        return maxWidthTabletLarge;
+      } else if (responsiveIsTablet) {
+        return maxWidthTablet;
+      } else {
+        return maxWidthMobile;
+      }
+    }
+  }
 }

lib/features/email/presentation/widgets/attachment_item_widget.dart

@@ -57,7 +57,12 @@ class AttachmentItemWidget extends StatelessWidget {
                 borderRadius: const BorderRadius.all(Radius.circular(AttachmentItemWidgetStyle.radius)),
                 border: Border.all(color: AttachmentItemWidgetStyle.borderColor),
               ),
-              width: _getMaxWidthItem(context),
+              width: AttachmentItemWidgetStyle.getMaxWidthItem(
+                platformIsMobile: PlatformInfo.isMobile,
+                responsiveIsMobile: _responsiveUtils.isMobile(context),
+                responsiveIsTablet: _responsiveUtils.isTablet(context),
+                responsiveIsTabletLarge: _responsiveUtils.isTabletLarge(context),
+              ),
               child: Row(
                 children: [
                   isLoading
@@ -116,20 +121,4 @@ class AttachmentItemWidget extends StatelessWidget {
       }
     );
   }
-
-  double _getMaxWidthItem(BuildContext context) {
-    if (PlatformInfo.isMobile) {
-      return _responsiveUtils.isMobile(context)
-        ? AttachmentItemWidgetStyle.maxWidthMobile
-        : AttachmentItemWidgetStyle.maxWidthTablet;
-    } else {
-      if (_responsiveUtils.isTabletLarge(context)) {
-        return AttachmentItemWidgetStyle.maxWidthTabletLarge;
-      } else if (_responsiveUtils.isTablet(context)) {
-        return AttachmentItemWidgetStyle.maxWidthTablet;
-      } else {
-        return AttachmentItemWidgetStyle.maxWidthMobile;
-      }
-    }
-  }
 }

lib/features/email/presentation/widgets/email_attachments_widget.dart

@@ -7,6 +7,7 @@ import 'package:filesize/filesize.dart';
 import 'package:flutter/material.dart';
 import 'package:model/email/attachment.dart';
 import 'package:model/extensions/list_attachment_extension.dart';
+import 'package:tmail_ui_user/features/email/presentation/styles/attachment/attachment_item_widget_style.dart';
 import 'package:tmail_ui_user/features/email/presentation/styles/email_attachments_styles.dart';
 import 'package:tmail_ui_user/features/email/presentation/widgets/attachment_item_widget.dart';
 import 'package:tmail_ui_user/features/email/presentation/widgets/attachments_info.dart';
@@ -40,9 +41,34 @@ class EmailAttachmentsWidget extends StatelessWidget {
     this.onTapDownloadAllButton,
   });
 
+  Widget _buildMoreAttachmentButton(
+    BuildContext context,
+    int hideItemsCount, {
+    EdgeInsetsGeometry padding = EdgeInsets.zero,
+  }) {
+    return TMailButtonWidget(
+      text: AppLocalizations.of(context).moreAttachments(hideItemsCount),
+      backgroundColor: Colors.transparent,
+      borderRadius: EmailAttachmentsStyles.buttonBorderRadius,
+      padding: padding,
+      margin: EmailAttachmentsStyles.moreButtonMargin,
+      textStyle: const TextStyle(
+        fontSize: EmailAttachmentsStyles.buttonMoreAttachmentsTextSize,
+        color: EmailAttachmentsStyles.buttonMoreAttachmentsTextColor,
+        fontWeight: EmailAttachmentsStyles.buttonMoreAttachmentsFontWeight,
+      ),
+      onTapActionCallback: onTapShowAllAttachmentFile,
+    );
+  }
+
   @override
   Widget build(BuildContext context) {
-    final attachmentDisplayed = _getAttachmentDisplayed(context);
+    return LayoutBuilder(builder: (context, constraints) {
+      final attachmentDisplayed = _getAttachmentDisplayed(
+        context,
+        constraints.maxWidth
+          - EmailAttachmentsStyles.padding.horizontal
+          - EmailAttachmentsStyles.listSpace * 2);
       int hideItemsCount = attachments.length - attachmentDisplayed.length;
       return Padding(
         padding: EmailAttachmentsStyles.padding,
@@ -88,18 +114,10 @@ class EmailAttachmentsWidget extends StatelessWidget {
                   ),
                 ),
                 if (hideItemsCount > 0 && !responsiveUtils.isMobile(context))
-                TMailButtonWidget(
+                  _buildMoreAttachmentButton(
-                  text: AppLocalizations.of(context).moreAttachments(hideItemsCount),
+                    context,
-                  backgroundColor: Colors.transparent,
+                    hideItemsCount,
-                  borderRadius: EmailAttachmentsStyles.buttonBorderRadius,
                     padding: EmailAttachmentsStyles.buttonPadding,
-                  margin: EmailAttachmentsStyles.moreButtonMargin,
-                  textStyle: const TextStyle(
-                    fontSize: EmailAttachmentsStyles.buttonMoreAttachmentsTextSize,
-                    color: EmailAttachmentsStyles.buttonMoreAttachmentsTextColor,
-                    fontWeight: EmailAttachmentsStyles.buttonMoreAttachmentsFontWeight,
-                  ),
-                  onTapActionCallback: onTapShowAllAttachmentFile,
                   ),
               ]
             ),
@@ -108,19 +126,7 @@ class EmailAttachmentsWidget extends StatelessWidget {
               Row(
                 children: [
                   if (hideItemsCount > 0)
-                  TMailButtonWidget(
+                    _buildMoreAttachmentButton(context, hideItemsCount),
-                    text: AppLocalizations.of(context).moreAttachments(hideItemsCount),
-                    backgroundColor: Colors.transparent,
-                    borderRadius: EmailAttachmentsStyles.buttonBorderRadius,
-                    padding: EdgeInsets.zero,
-                    margin: EmailAttachmentsStyles.moreButtonMargin,
-                    textStyle: const TextStyle(
-                      fontSize: EmailAttachmentsStyles.buttonMoreAttachmentsTextSize,
-                      color: EmailAttachmentsStyles.buttonMoreAttachmentsTextColor,
-                      fontWeight: EmailAttachmentsStyles.buttonMoreAttachmentsFontWeight,
-                    ),
-                    onTapActionCallback: onTapShowAllAttachmentFile,
-                  ),
                   const Spacer(),
                   if (showDownloadAllAttachmentsButton)
                     TMailButtonWidget(
@@ -142,33 +148,20 @@ class EmailAttachmentsWidget extends StatelessWidget {
           ],
         ),
       );
+    });
   }
 
-  List<Attachment> _getAttachmentDisplayed(BuildContext context) {
+  List<Attachment> _getAttachmentDisplayed(BuildContext context, double maxWidth) {
-    if (attachments.length <= 2) {
+    const moreAttachmentButtonWidth = 120; // Asumming 999 more items 
-      return attachments;
+    final maxWidthItem = AttachmentItemWidgetStyle.getMaxWidthItem(
-    }
+      platformIsMobile: PlatformInfo.isMobile,
-
+      responsiveIsMobile: responsiveUtils.isMobile(context),
-    if (attachments.length == 3) {
+      responsiveIsTablet: responsiveUtils.isTablet(context),
-      if (PlatformInfo.isWeb) {
+      responsiveIsTabletLarge: responsiveUtils.isTabletLarge(context),
-        return responsiveUtils.isDesktop(context)
+    );
+    final possibleNumberOfDisplayedAttachments = (maxWidth - moreAttachmentButtonWidth) ~/ maxWidthItem;
+    return possibleNumberOfDisplayedAttachments >= attachments.length
       ? attachments
-          : attachments.sublist(0, 2);
+      : attachments.sublist(0, possibleNumberOfDisplayedAttachments);
-      } else {
-        return responsiveUtils.isMobile(context)
-          ? attachments
-          : attachments.sublist(0, 2);
-      }
-    }
-
-    if (PlatformInfo.isWeb) {
-      return responsiveUtils.isDesktop(context) || responsiveUtils.isMobile(context)
-        ? attachments.sublist(0, 4)
-        : attachments.sublist(0, 2);
-    } else {
-      return responsiveUtils.isMobile(context)
-        ? attachments.sublist(0, 4)
-        : attachments.sublist(0, 2);
-    }
   }
 }