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

TF-3758 Update text style for folder item

Browse Source 
Signed-off-by: dab246 <tdvu@linagora.com>
This commit is contained in:
dab246
2025-05-30 03:03:52 +07:00
committed by Dat H. Pham
parent 8ec93be8ec
commit f179a9a6a8
15 changed files with 248 additions and 129 deletions
Download Patch File Download Diff File Expand all files Collapse all files
core/lib/presentation/extensions/color_extension.dart
+2
View File
@@ -254,6 +254,8 @@ extension AppColor on Color {
static const blackAlpha40 = Color.fromRGBO(0, 0, 0, 0.4);
static const blackAlpha20 = Color.fromRGBO(0, 0, 0, 0.2);
static const textPrimary = Color(0xFF424244);
static const iconFolder = Color(0xFF297EF2);
static const folderDivider = Color(0xFFE4E8EC);
static const mapGradientColor = [
[Color(0xFF21D4FD), Color(0xFFB721FF)],
core/lib/presentation/utils/theme_utils.dart
+19 -1
View File
@@ -222,7 +222,25 @@ class ThemeUtils {
letterSpacing: 0.0,
fontSize: fontSize ?? 15,
height: 20 / (fontSize ?? 15),
color: color,
color: color ?? Colors.black,
);
static TextStyle textStyleInter500() => const TextStyle(
fontFamily: ConstantsUI.fontApp,
fontWeight: FontWeight.w500,
letterSpacing: 0.0,
fontSize: 14,
height: 18 / 14,
color: Colors.black,
);
static TextStyle textStyleInter400() => const TextStyle(
fontFamily: ConstantsUI.fontApp,
fontWeight: FontWeight.normal,
letterSpacing: 0.01,
fontSize: 13,
height: 16 / 13,
color: Colors.black,
);
static TextStyle textStyleM3LabelLarge({Color? color}) => TextStyle(
lib/features/mailbox/presentation/mailbox_view.dart
+37 -18
View File
@@ -7,6 +7,7 @@ import 'package:tmail_ui_user/features/home/domain/extensions/session_extensions
import 'package:tmail_ui_user/features/mailbox/presentation/base_mailbox_view.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_categories.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_node.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/styles/mailbox_item_widget_styles.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/folder_widget.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/folders_bar_widget.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/mailbox_category_widget.dart';
@@ -38,7 +39,6 @@ class MailboxView extends BaseMailboxView {
child: _buildListMailbox(context),
),
),
const Divider(color: AppColor.colorDividerHorizontal),
const QuotasView(),
Container(
width: double.infinity,
@@ -75,9 +75,10 @@ class MailboxView extends BaseMailboxView {
}
}),
Obx(() {
if (controller.mailboxDashBoardController.listSendingEmails.isNotEmpty &&
PlatformInfo.isMobile) {
if (controller.mailboxDashBoardController.listSendingEmails.isNotEmpty) {
return SendingQueueMailboxWidget(
imagePaths: controller.imagePaths,
responsiveUtils: controller.responsiveUtils,
listSendingEmails: controller.mailboxDashBoardController.listSendingEmails,
onOpenSendingQueueAction: () => controller.openSendingQueueViewAction(context),
isSelected: controller.mailboxDashBoardController.dashboardRoute.value == DashboardRoutes.sendingQueue,
@@ -86,13 +87,25 @@ class MailboxView extends BaseMailboxView {
return const SizedBox.shrink();
}
}),
const SizedBox(height: 8),
const Divider(color: AppColor.colorDividerMailbox, height: 1),
Obx(() {
if (controller.defaultMailboxIsNotEmpty ||
controller.mailboxDashBoardController.listSendingEmails.isNotEmpty) {
return const Padding(
padding: EdgeInsets.only(top: 8),
child: Divider(color: AppColor.folderDivider, height: 1),
);
} else {
return const SizedBox.shrink();
}
}),
FoldersBarWidget(
onOpenSearchFolder: () => controller.openSearchViewAction(context),
onAddNewFolder: () => controller.goToCreateNewMailboxView(context),
imagePaths: controller.imagePaths,
responsiveUtils: controller.responsiveUtils,
height: 40,
padding: const EdgeInsets.symmetric(horizontal: 24),
labelStyle: ThemeUtils.textStyleInter500(),
),
Obx(() {
if (controller.personalMailboxIsNotEmpty) {
@@ -105,7 +118,6 @@ class MailboxView extends BaseMailboxView {
return const SizedBox.shrink();
}
}),
const SizedBox(height: 8),
Obx(() {
if (controller.teamMailboxesIsNotEmpty) {
return _buildMailboxCategory(
@@ -137,9 +149,10 @@ class MailboxView extends BaseMailboxView {
return Column(
mainAxisSize: MainAxisSize.min,
children: [
const SizedBox(height: 8),
const Divider(color: AppColor.colorDividerMailbox, height: 1),
const SizedBox(height: 8),
const Padding(
padding: EdgeInsets.only(top: 8),
child: Divider(color: AppColor.folderDivider, height: 1),
),
FolderWidget(
icon: controller.imagePaths.icHelp,
label: AppLocalizations.of(context).support,
@@ -147,7 +160,13 @@ class MailboxView extends BaseMailboxView {
.mailboxDashBoardController
.onGetHelpOrReportBug(contactSupportCapability!),
tooltip: AppLocalizations.of(context).getHelpOrReportABug,
padding: const EdgeInsets.symmetric(horizontal: 16)
padding: const EdgeInsets.symmetric(horizontal: 12),
itemPadding: const EdgeInsets.symmetric(
horizontal: MailboxItemWidgetStyles.mobileItemPadding,
),
borderRadius: MailboxItemWidgetStyles.mobileBorderRadius,
height: MailboxItemWidgetStyles.mobileHeight,
labelTextStyle: ThemeUtils.textStyleInter500(),
),
],
);
@@ -189,7 +208,7 @@ class MailboxView extends BaseMailboxView {
context: context,
categories: categories,
mailboxNode: mailboxNode,
padding: const EdgeInsets.symmetric(horizontal: 16),
padding: const EdgeInsets.symmetric(horizontal: 12),
);
}
return Column(children: [
@@ -206,10 +225,10 @@ class MailboxView extends BaseMailboxView {
),
isArrangeLTR: false,
showIcon: true,
padding: const EdgeInsetsDirectional.only(
start: 26,
end: 16,
),
padding: const EdgeInsets.symmetric(horizontal: 24),
height: 40,
iconSpace: MailboxItemWidgetStyles.mobileLabelIconSpace,
labelTextStyle: ThemeUtils.textStyleInter500(),
)),
AnimatedContainer(
duration: const Duration(milliseconds: 400),
@@ -219,8 +238,8 @@ class MailboxView extends BaseMailboxView {
categories: categories,
mailboxNode: mailboxNode,
padding: const EdgeInsetsDirectional.only(
start: 30,
end: 16,
start: 24,
end: 12,
),
)
: const Offstage())
@@ -235,7 +254,7 @@ class MailboxView extends BaseMailboxView {
context,
key: const Key('children_tree_mailbox_child'),
isExpanded: mailboxNode.expandMode == ExpandMode.EXPAND,
paddingChild: const EdgeInsetsDirectional.only(start: 14),
paddingChild: const EdgeInsetsDirectional.only(start: 12),
parent: Obx(() => MailboxItemWidget(
mailboxNode: mailboxNode,
mailboxNodeSelected: controller.mailboxDashBoardController.selectedMailbox.value,
lib/features/mailbox/presentation/styles/mailbox_item_widget_styles.dart
+4
View File
@@ -2,8 +2,12 @@
class MailboxItemWidgetStyles {
static const double selectionIconSize = 20;
static const double itemPadding = 10;
static const double mobileItemPadding = 12;
static const double borderRadius = 8;
static const double mobileBorderRadius = 10;
static const double height = 36;
static const double mobileHeight = 40;
static const double teamMailboxHeight = 52;
static const double labelIconSpace = 16;
static const double mobileLabelIconSpace = 8;
}
lib/features/mailbox/presentation/styles/trailing_mailbox_item_widget_styles.dart
+2
View File
@@ -7,6 +7,8 @@ class TrailingMailboxItemWidgetStyles {
static const Color menuIconBackgroundColor = Colors.transparent;
static const EdgeInsetsGeometry countEmailsPadding = EdgeInsetsDirectional.only(start: 5);
static const EdgeInsetsGeometry mobileCountEmailsPadding =
EdgeInsetsDirectional.only(start: 8);
static const EdgeInsetsGeometry menuIconMargin = EdgeInsetsDirectional.only(start: 5);
static const EdgeInsetsGeometry menuIconPadding = EdgeInsetsDirectional.all(2);
}
lib/features/mailbox/presentation/widgets/count_of_emails_widget.dart
+8 -6
View File
@@ -1,5 +1,6 @@
import 'package:core/presentation/utils/style_utils.dart';
import 'package:core/presentation/utils/theme_utils.dart';
import 'package:core/utils/platform_info.dart';
import 'package:flutter/material.dart';
class CountOfEmailsWidget extends StatelessWidget {
@@ -13,11 +14,12 @@ class CountOfEmailsWidget extends StatelessWidget {
return Text(
value,
maxLines: 1,
overflow: CommonTextStyle.defaultTextOverFlow,
softWrap: CommonTextStyle.defaultSoftWrap,
style: Theme.of(context).textTheme.bodySmall?.copyWith(
color: Colors.black,
),
overflow: TextOverflow.ellipsis,
style: PlatformInfo.isMobile
? ThemeUtils.textStyleInter400()
: Theme.of(context).textTheme.bodyMedium?.copyWith(
color: Colors.black,
),
);
}
}
lib/features/mailbox/presentation/widgets/folder_widget.dart
+24 -20
View File
@@ -2,9 +2,8 @@ import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/utils/theme_utils.dart';
import 'package:core/presentation/views/text/text_overflow_builder.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/styles/mailbox_icon_widget_styles.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/styles/mailbox_item_widget_styles.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/mailbox_icon_widget.dart';
class FolderWidget extends StatelessWidget {
final String icon;
@@ -12,6 +11,10 @@ class FolderWidget extends StatelessWidget {
final VoidCallback onOpenFolderAction;
final String? tooltip;
final EdgeInsetsGeometry? padding;
final EdgeInsetsGeometry? itemPadding;
final double? borderRadius;
final double? height;
final TextStyle? labelTextStyle;
const FolderWidget({
super.key,
@@ -20,35 +23,36 @@ class FolderWidget extends StatelessWidget {
required this.onOpenFolderAction,
this.tooltip,
this.padding,
this.itemPadding,
this.borderRadius,
this.height,
this.labelTextStyle,
});
@override
Widget build(BuildContext context) {
Widget item = Container(
decoration: const BoxDecoration(
decoration: BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(MailboxItemWidgetStyles.borderRadius),
Radius.circular(borderRadius ?? MailboxItemWidgetStyles.borderRadius),
),
),
padding: const EdgeInsets.symmetric(
padding: itemPadding ?? const EdgeInsets.symmetric(
horizontal: MailboxItemWidgetStyles.itemPadding,
),
height: MailboxItemWidgetStyles.height,
height: height ?? MailboxItemWidgetStyles.height,
child: Row(children: [
SvgPicture.asset(
icon,
width: MailboxIconWidgetStyles.iconSize,
height: MailboxIconWidgetStyles.iconSize,
fit: BoxFit.fill,
MailboxIconWidget(
icon: icon,
padding: const EdgeInsetsDirectional.only(
end: MailboxItemWidgetStyles.mobileLabelIconSpace,
),
color: AppColor.iconFolder,
),
const SizedBox(width: MailboxItemWidgetStyles.labelIconSpace),
Expanded(
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 3),
child: TextOverflowBuilder(
label,
style: ThemeUtils.textStyleBodyBody3(color: Colors.black),
),
child: TextOverflowBuilder(
label,
style: labelTextStyle ?? ThemeUtils.textStyleBodyBody3(color: Colors.black),
),
)
]),
@@ -65,8 +69,8 @@ class FolderWidget extends StatelessWidget {
color: Colors.transparent,
child: InkWell(
onTap: onOpenFolderAction,
borderRadius: const BorderRadius.all(
Radius.circular(MailboxItemWidgetStyles.borderRadius),
borderRadius: BorderRadius.all(
Radius.circular(borderRadius ?? MailboxItemWidgetStyles.borderRadius),
),
hoverColor: AppColor.blue100,
child: item,
lib/features/mailbox/presentation/widgets/folders_bar_widget.dart
+11 -3
View File
@@ -11,6 +11,9 @@ class FoldersBarWidget extends StatelessWidget {
final VoidCallback onAddNewFolder;
final ImagePaths imagePaths;
final ResponsiveUtils responsiveUtils;
final double? height;
final EdgeInsetsGeometry? padding;
final TextStyle? labelStyle;
const FoldersBarWidget({
super.key,
@@ -18,6 +21,9 @@ class FoldersBarWidget extends StatelessWidget {
required this.onAddNewFolder,
required this.imagePaths,
required this.responsiveUtils,
this.height,
this.padding,
this.labelStyle,
});
@override
@@ -56,17 +62,19 @@ class FoldersBarWidget extends StatelessWidget {
}
return Container(
padding: EdgeInsetsDirectional.only(
padding: padding ?? EdgeInsetsDirectional.only(
start: responsiveUtils.isWebDesktop(context) ? 10 : 26,
end: responsiveUtils.isWebDesktop(context) ? 0 : 8,
),
height: 48,
height: height ?? 48,
child: Row(
children: [
Expanded(
child: Text(
AppLocalizations.of(context).folders,
style: ThemeUtils.textStyleInter700(color: Colors.black),
style: labelStyle ?? ThemeUtils.textStyleInter700(),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
),
Row(children: [searchBarIcon, newFolderIcon]),
lib/features/mailbox/presentation/widgets/label_mailbox_item_widget.dart
+16 -3
View File
@@ -1,7 +1,9 @@
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/utils/theme_utils.dart';
import 'package:core/presentation/views/text/text_overflow_builder.dart';
import 'package:core/utils/platform_info.dart';
import 'package:flutter/material.dart';
import 'package:model/extensions/presentation_mailbox_extension.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/extensions/presentation_mailbox_extension.dart';
@@ -51,9 +53,7 @@ class _LabelMailboxItemWidgetState extends State<LabelMailboxItemWidget> {
Widget build(BuildContext context) {
final displayNameWidget = TextOverflowBuilder(
widget.mailboxNode.item.getDisplayName(context),
style: widget.isSelected
? ThemeUtils.textStyleInter700(color: Colors.black, fontSize: 14)
: ThemeUtils.textStyleBodyBody3(color: Colors.black),
style: _displayNameTextStyle,
);
final nameWithExpandIcon = Row(
@@ -159,4 +159,17 @@ class _LabelMailboxItemWidgetState extends State<LabelMailboxItemWidget> {
return widget.responsiveUtils.isWebDesktop(context) &&
widget.mailboxNode.item.allowedHasEmptyAction;
}
TextStyle get _displayNameTextStyle {
if (isSelected) {
return ThemeUtils.textStyleInter700(
color: PlatformInfo.isMobile ? AppColor.iconFolder : null,
fontSize: 14,
);
} else {
return PlatformInfo.isMobile
? ThemeUtils.textStyleInter500()
: ThemeUtils.textStyleBodyBody3(color: Colors.black);
}
}
}
lib/features/mailbox/presentation/widgets/mailbox_category_widget.dart
+22 -6
View File
@@ -2,6 +2,7 @@ import 'package:core/presentation/resources/image_paths.dart';
import 'package:core/presentation/utils/theme_utils.dart';
import 'package:core/presentation/views/button/tmail_button_widget.dart';
import 'package:core/utils/direction_utils.dart';
import 'package:core/utils/platform_info.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:get/get.dart';
@@ -21,6 +22,9 @@ class MailboxCategoryWidget extends StatefulWidget {
final bool isArrangeLTR;
final bool showIcon;
final EdgeInsetsGeometry? padding;
final double? height;
final double? iconSpace;
final TextStyle? labelTextStyle;
const MailboxCategoryWidget({
super.key,
@@ -30,6 +34,9 @@ class MailboxCategoryWidget extends StatefulWidget {
this.isArrangeLTR = true,
this.showIcon = false,
this.padding,
this.height,
this.iconSpace,
this.labelTextStyle,
});
@override
@@ -55,7 +62,7 @@ class _MailboxCategoryWidgetState extends State<MailboxCategoryWidget> {
height: MailboxIconWidgetStyles.iconSize,
fit: BoxFit.fill,
),
const SizedBox(width: MailboxItemWidgetStyles.labelIconSpace),
SizedBox(width: widget.iconSpace ?? MailboxItemWidgetStyles.labelIconSpace),
],
if (!widget.isArrangeLTR)
Flexible(
@@ -63,7 +70,7 @@ class _MailboxCategoryWidgetState extends State<MailboxCategoryWidget> {
widget.categories.getTitle(context),
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: ThemeUtils.textStyleBodyBody3(color: Colors.black),
style: widget.labelTextStyle ?? ThemeUtils.textStyleBodyBody3(color: Colors.black),
),
),
TMailButtonWidget.fromIcon(
@@ -72,9 +79,12 @@ class _MailboxCategoryWidgetState extends State<MailboxCategoryWidget> {
DirectionUtils.isDirectionRTLByLanguage(context),
),
iconColor: Colors.black,
iconSize: 20,
iconSize: PlatformInfo.isMobile ? 17 : 20,
backgroundColor: Colors.transparent,
padding: const EdgeInsets.all(5),
margin: PlatformInfo.isMobile
? const EdgeInsetsDirectional.only(start: 8)
: null,
padding: EdgeInsets.all(PlatformInfo.isMobile ? 3 : 5),
tooltipMessage: widget.expandMode.getTooltipMessage(AppLocalizations.of(context)),
onTapActionCallback: () =>
widget.onToggleMailboxCategories(widget.categories, _key)),
@@ -84,13 +94,19 @@ class _MailboxCategoryWidgetState extends State<MailboxCategoryWidget> {
widget.categories.getTitle(context),
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: ThemeUtils.textStyleBodyBody3(color: Colors.black),
style: widget.labelTextStyle ?? ThemeUtils.textStyleBodyBody3(color: Colors.black),
),
),
],
);
if (widget.padding != null) {
if (widget.padding != null && widget.height != null) {
return Container(
padding: widget.padding!,
height: widget.height!,
child: item,
);
} else if (widget.padding != null) {
return Padding(padding: widget.padding!, child: item);
} else {
return item;
lib/features/mailbox/presentation/widgets/mailbox_expand_button.dart
+6 -2
View File
@@ -2,6 +2,7 @@ import 'package:core/presentation/extensions/color_extension.dart';
import 'package:core/presentation/resources/image_paths.dart';
import 'package:core/presentation/views/button/tmail_button_widget.dart';
import 'package:core/utils/direction_utils.dart';
import 'package:core/utils/platform_info.dart';
import 'package:flutter/material.dart';
import 'package:model/extensions/presentation_mailbox_extension.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/extensions/expand_mode_extension.dart';
@@ -31,8 +32,11 @@ class MailboxExpandButton extends StatelessWidget {
DirectionUtils.isDirectionRTLByLanguage(context),
),
iconColor: _expandIconColor,
iconSize: 20,
padding: const EdgeInsets.all(5),
iconSize: PlatformInfo.isMobile ? 17 : 20,
margin: PlatformInfo.isMobile
? const EdgeInsetsDirectional.only(start: 8)
: null,
padding: EdgeInsets.all(PlatformInfo.isMobile ? 3 : 5),
backgroundColor: Colors.transparent,
tooltipMessage: mailboxNode.expandMode.getTooltipMessage(AppLocalizations.of(context)),
onTapActionCallback: () => onExpandFolderActionClick?.call(mailboxNode, itemKey),
lib/features/mailbox/presentation/widgets/mailbox_icon_widget.dart
+11 -2
View File
@@ -1,3 +1,4 @@
import 'package:core/presentation/extensions/color_extension.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/styles/mailbox_icon_widget_styles.dart';
@@ -5,19 +6,27 @@ import 'package:tmail_ui_user/features/mailbox/presentation/styles/mailbox_item_
class MailboxIconWidget extends StatelessWidget {
final String icon;
final EdgeInsetsGeometry? padding;
final Color? color;
const MailboxIconWidget({super.key, required this.icon});
const MailboxIconWidget({
super.key,
required this.icon,
this.padding,
this.color,
});
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsetsDirectional.only(
padding: padding ?? const EdgeInsetsDirectional.only(
end: MailboxItemWidgetStyles.labelIconSpace,
),
child: SvgPicture.asset(
icon,
width: MailboxIconWidgetStyles.iconSize,
height: MailboxIconWidgetStyles.iconSize,
colorFilter: color?.asFilter(),
fit: BoxFit.fill,
),
);
lib/features/mailbox/presentation/widgets/mailbox_item_widget.dart
+16 -13
View File
@@ -156,22 +156,32 @@ class _MailboxItemWidgetState extends State<MailboxItemWidget> {
child: InkWell(
onLongPress: () => widget.onLongPressMailboxNodeAction?.call(widget.mailboxNode),
onTap: () => widget.onOpenMailboxFolderClick?.call(widget.mailboxNode),
borderRadius: const BorderRadius.all(Radius.circular(MailboxItemWidgetStyles.borderRadius)),
borderRadius: const BorderRadius.all(
Radius.circular(MailboxItemWidgetStyles.mobileBorderRadius),
),
child: Container(
decoration: BoxDecoration(
borderRadius: const BorderRadius.all(Radius.circular(MailboxItemWidgetStyles.borderRadius)),
borderRadius: const BorderRadius.all(
Radius.circular(MailboxItemWidgetStyles.mobileBorderRadius),
),
color: backgroundColorItem
),
padding: const EdgeInsetsDirectional.symmetric(
horizontal: MailboxItemWidgetStyles.itemPadding,
horizontal: MailboxItemWidgetStyles.mobileItemPadding,
),
height: widget.mailboxNode.item.isTeamMailboxes
? MailboxItemWidgetStyles.teamMailboxHeight
: MailboxItemWidgetStyles.height,
: MailboxItemWidgetStyles.mobileHeight,
child: Row(
children: [
if (_isIconDisplayed)
MailboxIconWidget(icon: _iconMailbox),
MailboxIconWidget(
icon: _iconMailbox,
padding: const EdgeInsetsDirectional.only(
end: MailboxItemWidgetStyles.mobileLabelIconSpace,
),
color: AppColor.iconFolder,
),
Expanded(
child: LabelMailboxItemWidget(
itemKey: _key,
@@ -183,15 +193,8 @@ class _MailboxItemWidgetState extends State<MailboxItemWidget> {
onMenuActionClick: widget.onMenuActionClick,
onEmptyMailboxActionCallback: widget.onEmptyMailboxActionCallback,
onClickExpandMailboxNodeAction: widget.onExpandFolderActionClick,
)
),
),
if (_isSelectActionNoValid)
SvgPicture.asset(
_imagePaths.icSelectedSB,
width: MailboxItemWidgetStyles.selectionIconSize,
height: MailboxItemWidgetStyles.selectionIconSize,
fit: BoxFit.fill
)
]
),
),
lib/features/mailbox/presentation/widgets/sending_queue_mailbox_widget.dart
+58 -51
View File
@@ -1,11 +1,13 @@
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/utils/theme_utils.dart';
import 'package:core/presentation/views/text/text_overflow_builder.dart';
import 'package:core/utils/platform_info.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:get/get.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/styles/mailbox_item_widget_styles.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/styles/trailing_mailbox_item_widget_styles.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/count_of_emails_widget.dart';
import 'package:tmail_ui_user/features/mailbox/presentation/widgets/mailbox_icon_widget.dart';
import 'package:tmail_ui_user/features/sending_queue/domain/model/sending_email.dart';
import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
@@ -13,73 +15,59 @@ class SendingQueueMailboxWidget extends StatelessWidget {
final List<SendingEmail> listSendingEmails;
final bool isSelected;
final ImagePaths imagePaths;
final ResponsiveUtils responsiveUtils;
final VoidCallback? onOpenSendingQueueAction;
const SendingQueueMailboxWidget({
super.key,
required this.listSendingEmails,
required this.imagePaths,
required this.responsiveUtils,
this.isSelected = false,
this.onOpenSendingQueueAction
});
@override
Widget build(BuildContext context) {
final imagePath = Get.find<ImagePaths>();
final responsiveUtils = Get.find<ResponsiveUtils>();
return Padding(
padding: const EdgeInsets.only(left: 20, right: 16),
padding: const EdgeInsetsDirectional.symmetric(horizontal: 12),
child: Material(
color: Colors.transparent,
child: InkWell(
onTap: onOpenSendingQueueAction,
borderRadius: const BorderRadius.all(Radius.circular(8)),
borderRadius: const BorderRadius.all(
Radius.circular(MailboxItemWidgetStyles.mobileBorderRadius),
),
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
color: isSelected ? AppColor.colorBgMailboxSelected : Colors.transparent),
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 12),
child: Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
borderRadius: const BorderRadius.all(
Radius.circular(MailboxItemWidgetStyles.mobileBorderRadius),
),
color: backgroundColorItem,
),
padding: const EdgeInsetsDirectional.symmetric(
horizontal: MailboxItemWidgetStyles.mobileItemPadding,
),
height: MailboxItemWidgetStyles.mobileHeight,
child: Row(
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(width: responsiveUtils.isLandscapeMobile(context) ? 20 : 28),
SvgPicture.asset(
imagePath.icMailboxSendingQueue,
width: PlatformInfo.isWeb ? 20 : 24,
height: PlatformInfo.isWeb ? 20 : 24,
colorFilter: AppColor.primaryColor.asFilter(),
fit: BoxFit.fill),
const SizedBox(width: 12),
Expanded(child: Row(
crossAxisAlignment: CrossAxisAlignment.end,
children: [
Expanded(
child: TextOverflowBuilder(
AppLocalizations.of(context).sendingQueue,
style: const TextStyle(
fontSize: 15,
color: AppColor.colorNameEmail,
fontWeight: FontWeight.normal),
),
),
Padding(
padding: const EdgeInsetsDirectional.only(start: 12),
child: TextOverflowBuilder(
_getCountSendingEmails(),
style: const TextStyle(
fontSize: 13,
color: Colors.black,
fontWeight: FontWeight.normal
)
),
)
],
))
]
MailboxIconWidget(
icon: imagePaths.icMailboxSendingQueue,
padding: const EdgeInsetsDirectional.only(
end: MailboxItemWidgetStyles.mobileLabelIconSpace,
),
color: AppColor.iconFolder,
),
Expanded(
child: TextOverflowBuilder(
AppLocalizations.of(context).sendingQueue,
style: _displayNameTextStyle,
),
),
Padding(
padding: TrailingMailboxItemWidgetStyles.mobileCountEmailsPadding,
child: CountOfEmailsWidget(value: _getCountSendingEmails()),
),
]
),
@@ -89,10 +77,29 @@ class SendingQueueMailboxWidget extends StatelessWidget {
);
}
Color get backgroundColorItem {
if (isSelected) {
return AppColor.blue100;
} else {
return Colors.transparent;
}
}
String _getCountSendingEmails() {
if (listSendingEmails.isEmpty) {
return '';
}
return listSendingEmails.length <= 999 ? '${listSendingEmails.length}' : '999+';
}
TextStyle get _displayNameTextStyle {
if (isSelected) {
return ThemeUtils.textStyleInter700(
color: AppColor.iconFolder,
fontSize: 14,
);
} else {
return ThemeUtils.textStyleInter500();
}
}
}
lib/features/mailbox/presentation/widgets/trailing_mailbox_item_widget.dart
+12 -4
View File
@@ -45,12 +45,16 @@ class TrailingMailboxItemWidget extends StatelessWidget {
return const SizedBox();
} else if (mailboxNode.item.allowedToDisplayCountOfUnreadEmails) {
return Padding(
padding: TrailingMailboxItemWidgetStyles.countEmailsPadding,
padding: PlatformInfo.isMobile
? TrailingMailboxItemWidgetStyles.mobileCountEmailsPadding
: TrailingMailboxItemWidgetStyles.countEmailsPadding,
child: CountOfEmailsWidget(value: mailboxNode.item.countUnReadEmailsAsString),
);
} else if (mailboxNode.item.allowedToDisplayCountOfTotalEmails) {
return Padding(
padding: TrailingMailboxItemWidgetStyles.countEmailsPadding,
padding: PlatformInfo.isMobile
? TrailingMailboxItemWidgetStyles.mobileCountEmailsPadding
: TrailingMailboxItemWidgetStyles.countEmailsPadding,
child: CountOfEmailsWidget(value: mailboxNode.item.countTotalEmailsAsString),
);
} else {
@@ -59,12 +63,16 @@ class TrailingMailboxItemWidget extends StatelessWidget {
} else {
if (mailboxNode.item.allowedToDisplayCountOfUnreadEmails) {
return Padding(
padding: TrailingMailboxItemWidgetStyles.countEmailsPadding,
padding: PlatformInfo.isMobile
? TrailingMailboxItemWidgetStyles.mobileCountEmailsPadding
: TrailingMailboxItemWidgetStyles.countEmailsPadding,
child: CountOfEmailsWidget(value: mailboxNode.item.countUnReadEmailsAsString),
);
} else if (mailboxNode.item.allowedToDisplayCountOfTotalEmails) {
return Padding(
padding: TrailingMailboxItemWidgetStyles.countEmailsPadding,
padding: PlatformInfo.isMobile
? TrailingMailboxItemWidgetStyles.mobileCountEmailsPadding
: TrailingMailboxItemWidgetStyles.countEmailsPadding,
child: CountOfEmailsWidget(value: mailboxNode.item.countTotalEmailsAsString),
);
} else {