eduvia/workavia-mail-front
11
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

TF-3472 Prevent attachments from wrapping 2nd line

Browse Source
This commit is contained in:
DatDang
2025-03-04 17:14:15 +07:00
committed by Dat H. Pham
parent 1b4871af9a
commit 3da5b5863d
3 changed files with 143 additions and 142 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/features/email/presentation/styles/attachment/attachment_item_widget_style.dart
+19
View File
@@ -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
+6 -17
View File
@@ -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
+118 -125
View File
@@ -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,135 +41,127 @@ class EmailAttachmentsWidget extends StatelessWidget {
this.onTapDownloadAllButton,
});
@override
Widget build(BuildContext context) {
final attachmentDisplayed = _getAttachmentDisplayed(context);
int hideItemsCount = attachments.length - attachmentDisplayed.length;
return Padding(
padding: EmailAttachmentsStyles.padding,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
AttachmentsInfo(
imagePaths: imagePaths,
numberOfAttachments: attachments.length,
totalSizeInfo: filesize(attachments.totalSize, 1),
responsiveUtils: responsiveUtils,
onTapShowAllAttachmentFile: onTapShowAllAttachmentFile,
downloadAllEnabled: showDownloadAllAttachmentsButton,
onTapDownloadAllButton: onTapDownloadAllButton,
),
const SizedBox(height: EmailAttachmentsStyles.marginHeader),
Row(
crossAxisAlignment: responsiveUtils.isMobile(context)
? CrossAxisAlignment.end
: CrossAxisAlignment.center,
children: [
Flexible(
child: Wrap(
spacing: EmailAttachmentsStyles.listSpace,
runSpacing: EmailAttachmentsStyles.listSpace,
children: attachmentDisplayed.map((attachment) {
if (PlatformInfo.isWeb) {
return DraggableAttachmentItemWidget(
attachment: attachment,
onDragStarted: onDragStarted,
onDragEnd: onDragEnd,
downloadAttachmentAction: downloadAttachmentAction,
viewAttachmentAction: viewAttachmentAction,
);
} else {
return AttachmentItemWidget(
attachment: attachment,
downloadAttachmentAction: downloadAttachmentAction,
viewAttachmentAction: viewAttachmentAction,
);
}
}).toList(),
),
),
if (hideItemsCount > 0 && !responsiveUtils.isMobile(context))
TMailButtonWidget(
text: AppLocalizations.of(context).moreAttachments(hideItemsCount),
backgroundColor: Colors.transparent,
borderRadius: EmailAttachmentsStyles.buttonBorderRadius,
padding: EmailAttachmentsStyles.buttonPadding,
margin: EmailAttachmentsStyles.moreButtonMargin,
textStyle: const TextStyle(
fontSize: EmailAttachmentsStyles.buttonMoreAttachmentsTextSize,
color: EmailAttachmentsStyles.buttonMoreAttachmentsTextColor,
fontWeight: EmailAttachmentsStyles.buttonMoreAttachmentsFontWeight,
),
onTapActionCallback: onTapShowAllAttachmentFile,
),
]
),
const SizedBox(height: EmailAttachmentsStyles.marginHeader),
if (responsiveUtils.isMobile(context))
Row(
children: [
if (hideItemsCount > 0)
TMailButtonWidget(
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(
text: AppLocalizations.of(context).downloadAll,
icon: imagePaths.icDownloadAll,
iconAlignment: TextDirection.rtl,
backgroundColor: Colors.transparent,
borderRadius: EmailAttachmentsStyles.buttonBorderRadius,
padding: EmailAttachmentsStyles.buttonPadding,
textStyle: const TextStyle(
fontSize: EmailAttachmentsStyles.buttonTextSize,
color: EmailAttachmentsStyles.buttonTextColor,
fontWeight: EmailAttachmentsStyles.buttonFontWeight
),
onTapActionCallback: 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,
);
}
List<Attachment> _getAttachmentDisplayed(BuildContext context) {
if (attachments.length <= 2) {
return attachments;
}
@override
Widget build(BuildContext 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,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
AttachmentsInfo(
imagePaths: imagePaths,
numberOfAttachments: attachments.length,
totalSizeInfo: filesize(attachments.totalSize, 1),
responsiveUtils: responsiveUtils,
onTapShowAllAttachmentFile: onTapShowAllAttachmentFile,
downloadAllEnabled: showDownloadAllAttachmentsButton,
onTapDownloadAllButton: onTapDownloadAllButton,
),
const SizedBox(height: EmailAttachmentsStyles.marginHeader),
Row(
crossAxisAlignment: responsiveUtils.isMobile(context)
? CrossAxisAlignment.end
: CrossAxisAlignment.center,
children: [
Flexible(
child: Wrap(
spacing: EmailAttachmentsStyles.listSpace,
runSpacing: EmailAttachmentsStyles.listSpace,
children: attachmentDisplayed.map((attachment) {
if (PlatformInfo.isWeb) {
return DraggableAttachmentItemWidget(
attachment: attachment,
onDragStarted: onDragStarted,
onDragEnd: onDragEnd,
downloadAttachmentAction: downloadAttachmentAction,
viewAttachmentAction: viewAttachmentAction,
);
} else {
return AttachmentItemWidget(
attachment: attachment,
downloadAttachmentAction: downloadAttachmentAction,
viewAttachmentAction: viewAttachmentAction,
);
}
}).toList(),
),
),
if (hideItemsCount > 0 && !responsiveUtils.isMobile(context))
_buildMoreAttachmentButton(
context,
hideItemsCount,
padding: EmailAttachmentsStyles.buttonPadding,
),
]
),
const SizedBox(height: EmailAttachmentsStyles.marginHeader),
if (responsiveUtils.isMobile(context))
Row(
children: [
if (hideItemsCount > 0)
_buildMoreAttachmentButton(context, hideItemsCount),
const Spacer(),
if (showDownloadAllAttachmentsButton)
TMailButtonWidget(
text: AppLocalizations.of(context).downloadAll,
icon: imagePaths.icDownloadAll,
iconAlignment: TextDirection.rtl,
backgroundColor: Colors.transparent,
borderRadius: EmailAttachmentsStyles.buttonBorderRadius,
padding: EmailAttachmentsStyles.buttonPadding,
textStyle: const TextStyle(
fontSize: EmailAttachmentsStyles.buttonTextSize,
color: EmailAttachmentsStyles.buttonTextColor,
fontWeight: EmailAttachmentsStyles.buttonFontWeight
),
onTapActionCallback: onTapDownloadAllButton,
),
]
),
],
),
);
});
}
if (attachments.length == 3) {
if (PlatformInfo.isWeb) {
return responsiveUtils.isDesktop(context)
? attachments
: attachments.sublist(0, 2);
} 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);
}
List<Attachment> _getAttachmentDisplayed(BuildContext context, double maxWidth) {
const moreAttachmentButtonWidth = 120; // Asumming 999 more items
final maxWidthItem = AttachmentItemWidgetStyle.getMaxWidthItem(
platformIsMobile: PlatformInfo.isMobile,
responsiveIsMobile: responsiveUtils.isMobile(context),
responsiveIsTablet: responsiveUtils.isTablet(context),
responsiveIsTabletLarge: responsiveUtils.isTabletLarge(context),
);
final possibleNumberOfDisplayedAttachments = (maxWidth - moreAttachmentButtonWidth) ~/ maxWidthItem;
return possibleNumberOfDisplayedAttachments >= attachments.length
? attachments
: attachments.sublist(0, possibleNumberOfDisplayedAttachments);
}
}