diff --git a/assets/images/ic_add_new_folder.svg b/assets/images/ic_add_new_folder.svg new file mode 100644 index 000000000..141e6c9eb --- /dev/null +++ b/assets/images/ic_add_new_folder.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/ic_close_mailbox.svg b/assets/images/ic_close_mailbox.svg new file mode 100644 index 000000000..f5c33a4af --- /dev/null +++ b/assets/images/ic_close_mailbox.svg @@ -0,0 +1,4 @@ + + + + diff --git a/assets/images/ic_folder_mailbox.svg b/assets/images/ic_folder_mailbox.svg new file mode 100644 index 000000000..f1d152f6c --- /dev/null +++ b/assets/images/ic_folder_mailbox.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/ic_mailbox_archived_v2.svg b/assets/images/ic_mailbox_archived_v2.svg new file mode 100644 index 000000000..1e6bae8c1 --- /dev/null +++ b/assets/images/ic_mailbox_archived_v2.svg @@ -0,0 +1,4 @@ + + + + diff --git a/assets/images/ic_mailbox_drafts_v2.svg b/assets/images/ic_mailbox_drafts_v2.svg new file mode 100644 index 000000000..573849489 --- /dev/null +++ b/assets/images/ic_mailbox_drafts_v2.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/ic_mailbox_inbox_v2.svg b/assets/images/ic_mailbox_inbox_v2.svg new file mode 100644 index 000000000..d27976256 --- /dev/null +++ b/assets/images/ic_mailbox_inbox_v2.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/ic_mailbox_sent_v2.svg b/assets/images/ic_mailbox_sent_v2.svg new file mode 100644 index 000000000..eaaa0bdcb --- /dev/null +++ b/assets/images/ic_mailbox_sent_v2.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/ic_mailbox_spam_v2.svg b/assets/images/ic_mailbox_spam_v2.svg new file mode 100644 index 000000000..897ea0b6d --- /dev/null +++ b/assets/images/ic_mailbox_spam_v2.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/images/ic_mailbox_trash_v2.svg b/assets/images/ic_mailbox_trash_v2.svg new file mode 100644 index 000000000..8c62ceb1b --- /dev/null +++ b/assets/images/ic_mailbox_trash_v2.svg @@ -0,0 +1,3 @@ + + + diff --git a/core/lib/presentation/extensions/color_extension.dart b/core/lib/presentation/extensions/color_extension.dart index db3760671..3f7d6ac31 100644 --- a/core/lib/presentation/extensions/color_extension.dart +++ b/core/lib/presentation/extensions/color_extension.dart @@ -68,6 +68,9 @@ extension AppColor on Color { static const colorHintSearchBar = Color(0xFF818C99); static const colorBgSearchBar = Color(0xFFEBEDF0); static const colorShadowBgContentEmail = Color(0x14000000); + static const colorDividerMailbox = Color(0xFF99A2AD); + static const colorArrowUserMailbox = Color(0xFFB8C1CC); + static const colorBgMailbox = Color(0xFFF7F7F7); static const mapGradientColor = [ [Color(0xFF21D4FD), Color(0xFFB721FF)], diff --git a/core/lib/presentation/resources/image_paths.dart b/core/lib/presentation/resources/image_paths.dart index bd17237b8..5758855e8 100644 --- a/core/lib/presentation/resources/image_paths.dart +++ b/core/lib/presentation/resources/image_paths.dart @@ -2,7 +2,7 @@ import 'package:core/presentation/resources/assets_paths.dart'; class ImagePaths { String get icTMailLogo => _getImagePath('tmail_logo.svg'); - String get icCloseMailbox => _getImagePath('ic_close.svg'); + String get icClose => _getImagePath('ic_close.svg'); String get icSearch => _getImagePath('ic_search.svg'); String get icNextArrow => _getImagePath('ic_next_arrow.svg'); String get icMailboxInbox => _getImagePath('ic_mailbox_inbox.svg'); @@ -66,6 +66,15 @@ class ImagePaths { String get icForwardV2 => _getImagePath('ic_forward_v2.svg'); String get icMoveEmail => _getImagePath('ic_move_email.svg'); String get icUnreadEmail => _getImagePath('ic_unread_email.svg'); + String get icCloseMailbox => _getImagePath('ic_close_mailbox.svg'); + String get icAddNewFolder => _getImagePath('ic_add_new_folder.svg'); + String get icFolderMailbox => _getImagePath('ic_folder_mailbox.svg'); + String get icMailboxInboxV2 => _getImagePath('ic_mailbox_inbox_v2.svg'); + String get icMailboxDraftsV2 => _getImagePath('ic_mailbox_drafts_v2.svg'); + String get icMailboxSentV2 => _getImagePath('ic_mailbox_sent_v2.svg'); + String get icMailboxArchivedV2 => _getImagePath('ic_mailbox_archived_v2.svg'); + String get icMailboxSpamV2 => _getImagePath('ic_mailbox_spam_v2.svg'); + String get icMailboxTrashV2 => _getImagePath('ic_mailbox_trash_v2.svg'); String _getImagePath(String imageName) { return AssetsPaths.images + imageName; diff --git a/core/lib/presentation/views/image/avatar_builder.dart b/core/lib/presentation/views/image/avatar_builder.dart index 82fd273bc..3238de154 100644 --- a/core/lib/presentation/views/image/avatar_builder.dart +++ b/core/lib/presentation/views/image/avatar_builder.dart @@ -13,6 +13,7 @@ class AvatarBuilder { Color? _textColor; OnTapAvatarActionClick? _onTapAvatarActionClick; List? _avatarColors; + List? _boxShadows; void key(Key key) { _key = key; @@ -43,6 +44,10 @@ class AvatarBuilder { _avatarColors = avatarColors; } + void addBoxShadows(List? boxShadows) { + _boxShadows = boxShadows; + } + void addOnTapActionClick(OnTapAvatarActionClick onTapAvatarActionClick) { _onTapAvatarActionClick = onTapAvatarActionClick; } @@ -67,6 +72,7 @@ class AvatarBuilder { decoration: BoxDecoration( borderRadius: BorderRadius.circular((_size ?? 40) / 2), border: Border.all(color: Colors.transparent), + boxShadow: _boxShadows ?? [], gradient: _avatarColors?.isNotEmpty == true ? LinearGradient( begin: Alignment.topCenter, diff --git a/lib/features/mailbox/domain/extensions/presentation_mailbox_extension.dart b/lib/features/mailbox/domain/extensions/presentation_mailbox_extension.dart index e16d7d2a3..265240da4 100644 --- a/lib/features/mailbox/domain/extensions/presentation_mailbox_extension.dart +++ b/lib/features/mailbox/domain/extensions/presentation_mailbox_extension.dart @@ -7,26 +7,26 @@ extension PresentationMailboxExtension on PresentationMailbox { if (hasRole()) { switch(role!.value) { case 'inbox': - return imagePaths.icMailboxInbox; + return imagePaths.icMailboxInboxV2; case 'drafts': - return imagePaths.icMailboxDrafts; + return imagePaths.icMailboxDraftsV2; case 'outbox': - return imagePaths.icMailboxInbox; + return imagePaths.icMailboxArchivedV2; case 'sent': - return imagePaths.icMailboxSent; + return imagePaths.icMailboxSentV2; case 'trash': - return imagePaths.icMailboxTrash; + return imagePaths.icMailboxTrashV2; case 'spam': - return imagePaths.icMailboxSpam; + return imagePaths.icMailboxSpamV2; case 'templates': return imagePaths.icMailboxTemplate; case 'all_mail': return imagePaths.icMailboxAllMail; default: - return imagePaths.icMailboxFolder; + return imagePaths.icFolderMailbox; } } else { - return imagePaths.icMailboxFolder; + return imagePaths.icFolderMailbox; } } } \ No newline at end of file diff --git a/lib/features/mailbox/presentation/mailbox_controller.dart b/lib/features/mailbox/presentation/mailbox_controller.dart index f1aa28cff..e2373bcc4 100644 --- a/lib/features/mailbox/presentation/mailbox_controller.dart +++ b/lib/features/mailbox/presentation/mailbox_controller.dart @@ -203,6 +203,10 @@ class MailboxController extends BaseController { } void closeMailboxScreen() { + mailboxDashBoardController.closeDrawer(); + } + + void logoutAction() { _deleteCredential(); _clearAllCache(); pushAndPopAll(AppRoutes.LOGIN); diff --git a/lib/features/mailbox/presentation/mailbox_view.dart b/lib/features/mailbox/presentation/mailbox_view.dart index 0b523cd78..912e3be86 100644 --- a/lib/features/mailbox/presentation/mailbox_view.dart +++ b/lib/features/mailbox/presentation/mailbox_view.dart @@ -5,12 +5,10 @@ import 'package:get/get.dart'; import 'package:model/model.dart'; import 'package:tmail_ui_user/features/mailbox/presentation/mailbox_controller.dart'; import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_node.dart'; -// import 'package:tmail_ui_user/features/mailbox/presentation/widgets/mailbox_button_new_folder_builder.dart'; import 'package:tmail_ui_user/features/mailbox/presentation/widgets/mailbox_folder_tile_builder.dart'; import 'package:tmail_ui_user/features/mailbox/presentation/widgets/mailbox_tile_builder.dart'; -// import 'package:tmail_ui_user/features/mailbox/presentation/widgets/search_form_widget_builder.dart'; -// import 'package:tmail_ui_user/features/mailbox/presentation/widgets/storage_widget_builder.dart'; import 'package:tmail_ui_user/features/mailbox/presentation/widgets/user_information_widget_builder.dart'; +import 'package:tmail_ui_user/features/thread/presentation/widgets/search_bar_thread_view_widget.dart'; import 'package:tmail_ui_user/main/localizations/app_localizations.dart'; class MailboxView extends GetWidget { @@ -20,78 +18,95 @@ class MailboxView extends GetWidget { @override Widget build(BuildContext context) { - return Drawer( - child: Scaffold( - backgroundColor: AppColor.primaryLightColor, - body: SafeArea( - right: false, - left: false, - child: Container( - alignment: Alignment.center, - child: Column( - children: [ - _buildHeaderMailbox(context), - // _buildSearchFormWidget(context), - SizedBox(height: 16), - Divider(color: AppColor.dividerColor, height: 1), - _buildLoadingView(), - Expanded(child: RefreshIndicator( - color: AppColor.primaryColor, - onRefresh: () async => controller.refreshAllMailbox(), - child: _buildListMailbox(context))) - ] - ) + return SafeArea( + top: responsiveUtils.isMobile(context) ? true : false, + bottom: false, + left: false, + right: false, + child: ClipRRect( + borderRadius: BorderRadius.only( + topRight: Radius.circular(responsiveUtils.isMobile(context) ? 14 : 0), + topLeft: Radius.circular(14)), + child: Drawer( + child: Scaffold( + backgroundColor: Colors.white, + body: Column( + children: [ + _buildHeaderMailbox(context), + Expanded(child: Container( + color: AppColor.colorBgMailbox, + child: RefreshIndicator( + color: AppColor.primaryColor, + onRefresh: () async => controller.refreshAllMailbox(), + child: _buildListMailbox(context)), + )) + ] + ), ) - ), - // bottomNavigationBar: responsiveUtils.isMobile(context) ? _buildStorageWidget(context) : null + ) ) ); } Widget _buildHeaderMailbox(BuildContext context) { - return ResponsiveWidget( - tablet: Column( - mainAxisAlignment: MainAxisAlignment.start, - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - _buildCloseScreenButton(context), - _buildUserInformationWidget(context) - ]), - mobile: Row( - mainAxisAlignment: MainAxisAlignment.start, - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - _buildCloseScreenButton(context), - Expanded(child: _buildUserInformationWidget(context)) - ]), - responsiveUtils: responsiveUtils); + return Column( + mainAxisAlignment: MainAxisAlignment.start, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Padding( + padding: EdgeInsets.only( + top: responsiveUtils.isMobile(context) ? 14 : 30, + bottom: 10), + child: Row(mainAxisAlignment: MainAxisAlignment.center, children: [ + !responsiveUtils.isDesktop(context) ? _buildCloseScreenButton(context) : SizedBox(width: 50), + Expanded(child: Text( + AppLocalizations.of(context).folders, + textAlign: TextAlign.center, + style: TextStyle(fontSize: 20, color: AppColor.colorNameEmail, fontWeight: FontWeight.w700),)), + _buildAddNewFolderButton(context), + ])), + Divider(color: AppColor.colorDividerMailbox, height: 0.5, thickness: 0.2), + ] + ); } Widget _buildCloseScreenButton(BuildContext context) { return Padding( - padding: EdgeInsets.only(left: 16, top: responsiveUtils.isMobile(context) ? 0 : 12), + padding: EdgeInsets.only(left: 16, right: 16), child: IconButton( key: Key('mailbox_close_button'), onPressed: () => controller.closeMailboxScreen(), icon: SvgPicture.asset(imagePaths.icCloseMailbox, width: 30, height: 30, fit: BoxFit.fill))); } + Widget _buildAddNewFolderButton(BuildContext context) { + return Padding( + padding: EdgeInsets.only(left: 16, right: 16), + child: IconButton( + key: Key('mailbox_add_new_folder_button'), + onPressed: () => {}, + icon: SvgPicture.asset(imagePaths.icAddNewFolder, width: 30, height: 30, fit: BoxFit.fill))); + } + Widget _buildUserInformationWidget(BuildContext context) { return Padding( padding: EdgeInsets.only(left: 16, top: 8.0, right: 16), - child: Obx(() => UserInformationWidgetBuilder( - // imagePaths, + child: Obx(() => (UserInformationWidgetBuilder( + imagePaths, + context, controller.mailboxDashBoardController.userProfile.value) - .build())); + ..addOnLogoutAction(() => controller.logoutAction())) + .build())); } - // Widget _buildSearchFormWidget(BuildContext context) { - // return Padding( - // padding: EdgeInsets.only(top: 16, left: 16, right: 16), - // child: SearchFormWidgetBuilder(context, imagePaths) - // .onNewSearchQuery((searchQuery) => {}) - // .build()); - // } + Widget _buildSearchFormWidget(BuildContext context) { + return Padding( + padding: EdgeInsets.only(top: 12), + child: (SearchBarThreadViewWidget(imagePaths) + ..hintTextSearch(AppLocalizations.of(context).hint_search_mailboxes) + ..addOnOpenSearchViewAction(() {})) + .build()); + } Widget _buildLoadingView() { return Obx(() => controller.viewState.value.fold( @@ -113,37 +128,41 @@ class MailboxView extends GetWidget { shrinkWrap: true, padding: EdgeInsets.zero, children: [ + _buildUserInformationWidget(context), + Padding( + padding: EdgeInsets.only(top: 16), + child: Divider(color: AppColor.colorDividerMailbox, height: 0.5, thickness: 0.2)), + _buildSearchFormWidget(context), + _buildLoadingView(), Obx(() => controller.defaultMailboxList.isNotEmpty - ? _buildDefaultMailbox(context, controller.defaultMailboxList) + ? Container( + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(14), + color: Colors.white), + margin: EdgeInsets.only(left: 16, right: 16, top: 4), + child: _buildDefaultMailbox(context, controller.defaultMailboxList)) : SizedBox.shrink()), Padding( - padding: EdgeInsets.only( - left: 25, - top: 20), + padding: EdgeInsets.only(left: 25, top: 26, bottom: 12), child: Text( - AppLocalizations.of(context).my_folders, + AppLocalizations.of(context).folders, maxLines: 1, - style: TextStyle(fontSize: 12, color: AppColor.myFolderTitleColor, fontWeight: FontWeight.w500)) + style: TextStyle(fontSize: 20, color: AppColor.colorNameEmail, fontWeight: FontWeight.w600)) + ), + Container( + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(14), + color: Colors.white), + margin: EdgeInsets.only(left: 16, right: 16, bottom: 30), + child: _buildFolderMailbox(context), ), - // Padding( - // padding: EdgeInsets.only( - // left: 8, - // right: 16, - // top: 10), - // child: (MailboxNewFolderTileBuilder() - // ..addIcon(imagePaths.icMailboxNewFolder) - // ..addName(AppLocalizations.of(context).new_folder)) - // .build() - // ), - SizedBox(height: 10), - _buildFolderMailbox(context), ] ); } Widget _buildDefaultMailbox(BuildContext context, List defaultMailbox) { return ListView.builder( - padding: EdgeInsets.only(top: 16, left: 16, right: 16), + padding: EdgeInsets.only(top: 8, left: 8, right: 8), key: PageStorageKey('default_mailbox_list'), itemCount: defaultMailbox.length, shrinkWrap: true, @@ -164,7 +183,7 @@ class MailboxView extends GetWidget { ? Transform( transform: Matrix4.translationValues(-4.0, 0.0, 0.0), child: Padding( - padding: EdgeInsets.only(right: 12), + padding: EdgeInsets.only(right: 12, top: 10), child: TreeView( startExpanded: false, key: Key('folder_mailbox_list'), @@ -178,7 +197,7 @@ class MailboxView extends GetWidget { return listMailboxNode .map((mailboxNode) => mailboxNode.hasChildren() ? Padding( - padding: EdgeInsets.only(left: 20), + padding: EdgeInsets.only(left: 16), child: TreeViewChild( context, key: Key('children_tree_mailbox_child'), @@ -197,7 +216,7 @@ class MailboxView extends GetWidget { children: _buildListChildTileWidget(context, mailboxNode.childrenItems!) ).build()) : Padding( - padding: EdgeInsets.only(left: 20), + padding: EdgeInsets.only(left: 16), child: Obx(() => (MailBoxFolderTileBuilder( context, imagePaths, diff --git a/lib/features/mailbox/presentation/widgets/mailbox_folder_tile_builder.dart b/lib/features/mailbox/presentation/widgets/mailbox_folder_tile_builder.dart index 183595b43..f073818ba 100644 --- a/lib/features/mailbox/presentation/widgets/mailbox_folder_tile_builder.dart +++ b/lib/features/mailbox/presentation/widgets/mailbox_folder_tile_builder.dart @@ -51,51 +51,46 @@ class MailBoxFolderTileBuilder { key: Key('mailbox_folder_tile'), alignment: Alignment.center, decoration: BoxDecoration( - borderRadius: BorderRadius.circular( mailboxDisplayed == MailboxDisplayed.mailbox ? 16 : 0), + borderRadius: BorderRadius.circular(mailboxDisplayed == MailboxDisplayed.mailbox ? 10 : 0), color: mailboxDisplayed == MailboxDisplayed.mailbox ? selectMode == SelectMode.ACTIVE ? AppColor.mailboxSelectedBackgroundColor : AppColor.mailboxBackgroundColor - : AppColor.bgMailboxListMail + : Colors.white ), child: MediaQuery( data: MediaQueryData(padding: EdgeInsets.zero), - child: ListTile( - onTap: () { - if (_onSelectMailboxFolderClick != null) { - _onSelectMailboxFolderClick!(_mailboxNode); - } - }, - contentPadding: EdgeInsets.zero, - leading: Padding( - padding: EdgeInsets.only(left: 26), - child: SvgPicture.asset( - _imagePaths.icMailboxFolder, - width: 24, - height: 24, - color: selectMode == SelectMode.ACTIVE - ? AppColor.mailboxSelectedIconColor - : AppColor.mailboxIconColor, - fit: BoxFit.fill)), - title: _buildTitleFolderItem(), - trailing: _mailboxNode.hasChildren() - ? Padding( - padding: EdgeInsets.only( - right: mailboxDisplayed == MailboxDisplayed.mailbox - ? _responsiveUtils.isMobile(_context) ? 0 : 8 - : 0, - left: 16), - child: IconButton( - color: AppColor.primaryColor, - icon: SvgPicture.asset( - _mailboxNode.expandMode == ExpandMode.EXPAND ? _imagePaths.icExpandFolder : _imagePaths.icFolderArrow, - color: selectMode == SelectMode.ACTIVE ? AppColor.mailboxSelectedIconColor : AppColor.mailboxIconColor, - fit: BoxFit.fill), - onPressed: () { - if (_onExpandFolderActionClick != null) { - _onExpandFolderActionClick!(_mailboxNode); - } - })) - : null - ) + child: Column(children: [ + ListTile( + onTap: () { + if (_onSelectMailboxFolderClick != null) { + _onSelectMailboxFolderClick!(_mailboxNode); + } + }, + contentPadding: EdgeInsets.zero, + leading: Padding( + padding: EdgeInsets.only(left: 8), + child: SvgPicture.asset(_imagePaths.icFolderMailbox, width: 28, height: 28, fit: BoxFit.fill)), + title: _buildTitleFolderItem(), + trailing: _mailboxNode.hasChildren() + ? Padding( + padding: EdgeInsets.only(right: mailboxDisplayed == MailboxDisplayed.mailbox ? _responsiveUtils.isMobile(_context) ? 0 : 8 : 0, left: 16), + child: IconButton( + color: AppColor.primaryColor, + icon: SvgPicture.asset( + _mailboxNode.expandMode == ExpandMode.EXPAND ? _imagePaths.icExpandFolder : _imagePaths.icFolderArrow, + color: selectMode == SelectMode.ACTIVE ? AppColor.mailboxSelectedIconColor : AppColor.colorArrowUserMailbox, + fit: BoxFit.fill), + onPressed: () { + if (_onExpandFolderActionClick != null) { + _onExpandFolderActionClick!(_mailboxNode); + } + } + )) + : null + ), + Padding( + padding: EdgeInsets.only(left: 45), + child: Divider(color: AppColor.lineItemListColor, height: 0.5, thickness: 0.2)), + ]) ) ) ); @@ -104,16 +99,15 @@ class MailBoxFolderTileBuilder { Widget _buildTitleFolderItem() { return Row( children: [ - Expanded(child: Padding( - padding: EdgeInsets.only(left: 8), + Expanded(child: Transform( + transform: Matrix4.translationValues(-10.0, 0.0, 0.0), child: Text( '${_mailboxNode.item.name?.name ?? ''}', maxLines: 1, overflow: TextOverflow.ellipsis, style: TextStyle( fontSize: 15, - color: selectMode == SelectMode.ACTIVE ? AppColor.mailboxSelectedTextColor : AppColor.mailboxTextColor, - fontWeight: mailboxDisplayed == MailboxDisplayed.mailbox ? FontWeight.bold : FontWeight.w500), + color: AppColor.colorNameEmail), ))), if (_mailboxNode.item.getCountUnReadEmails().isNotEmpty && mailboxDisplayed == MailboxDisplayed.mailbox) !_mailboxNode.hasChildren() @@ -136,10 +130,7 @@ class MailBoxFolderTileBuilder { '${_mailboxNode.item.getCountUnReadEmails()} ${AppLocalizations.of(_context).unread_email_notification}', maxLines: 1, overflow: TextOverflow.ellipsis, - style: TextStyle( - fontSize: 10, - color: selectMode == SelectMode.ACTIVE ? AppColor.mailboxTextColor : AppColor.counterMailboxColor, - fontWeight: FontWeight.bold), + style: TextStyle(fontSize: 12, color: AppColor.colorNameEmail), )); } } \ No newline at end of file diff --git a/lib/features/mailbox/presentation/widgets/mailbox_tile_builder.dart b/lib/features/mailbox/presentation/widgets/mailbox_tile_builder.dart index 6f96ea128..edf4db526 100644 --- a/lib/features/mailbox/presentation/widgets/mailbox_tile_builder.dart +++ b/lib/features/mailbox/presentation/widgets/mailbox_tile_builder.dart @@ -1,8 +1,5 @@ -import 'dart:ui'; - import 'package:core/core.dart'; import 'package:flutter/material.dart'; -import 'package:flutter/widgets.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:model/model.dart'; import 'package:tmail_ui_user/features/mailbox/domain/extensions/presentation_mailbox_extension.dart'; @@ -41,10 +38,10 @@ class MailboxTileBuilder { key: Key('mailbox_list_tile'), alignment: Alignment.center, decoration: BoxDecoration( - borderRadius: BorderRadius.circular(mailboxDisplayed == MailboxDisplayed.mailbox ? 16 : 0), + borderRadius: BorderRadius.circular(mailboxDisplayed == MailboxDisplayed.mailbox ? 10 : 0), color: mailboxDisplayed == MailboxDisplayed.mailbox ? selectMode == SelectMode.ACTIVE ? AppColor.mailboxSelectedBackgroundColor : AppColor.mailboxBackgroundColor - : AppColor.bgMailboxListMail + : Colors.white ), child: MediaQuery( data: MediaQueryData(padding: EdgeInsets.zero), @@ -56,41 +53,40 @@ class MailboxTileBuilder { } }, leading: Padding( - padding: EdgeInsets.only(left: 24), + padding: EdgeInsets.only(left: 8), child: SvgPicture.asset( '${_presentationMailbox.getMailboxIcon(_imagePaths)}', - width: 24, - height: 24, - color: selectMode == SelectMode.ACTIVE - ? AppColor.mailboxSelectedIconColor - : AppColor.mailboxIconColor, + width: 28, + height: 28, fit: BoxFit.fill)), - title: Padding( - padding: EdgeInsets.only(left: 8), - child: Text( - '${_presentationMailbox.name?.name ?? ''}', - maxLines: 1, - overflow:TextOverflow.ellipsis, - style: TextStyle( - fontSize: 15, - color: selectMode == SelectMode.ACTIVE - ? AppColor.mailboxSelectedTextColor - : AppColor.mailboxTextColor, - fontWeight: mailboxDisplayed == MailboxDisplayed.mailbox ? FontWeight.bold : FontWeight.w500), - )), - trailing: mailboxDisplayed == MailboxDisplayed.mailbox - ? Padding( - padding: EdgeInsets.only(right: 24, left: 16), - child: Text( - '${_presentationMailbox.getCountUnReadEmails()}', - maxLines: 1, - style: TextStyle( - fontSize: 15, - color: selectMode == SelectMode.ACTIVE - ? AppColor.mailboxSelectedTextNumberColor - : AppColor.mailboxTextNumberColor, - fontWeight: FontWeight.bold))) - : SizedBox.shrink() + title: Transform( + transform: Matrix4.translationValues(-10.0, 0.0, 0.0), + child: Row(children: [ + Expanded(child: Text( + '${_presentationMailbox.name?.name ?? ''}', + maxLines: 1, + overflow:TextOverflow.ellipsis, + style: TextStyle(fontSize: 15, color: AppColor.colorNameEmail), + )), + if (mailboxDisplayed == MailboxDisplayed.mailbox) + Transform( + transform: Matrix4.translationValues(40.0, 0.0, 0.0), + child: Text( + '${_presentationMailbox.getCountUnReadEmails()}', + maxLines: 1, + style: TextStyle(fontSize: 13, color: AppColor.colorNameEmail))) + ])), + trailing: Transform( + transform: Matrix4.translationValues(8.0, 0.0, 0.0), + child: IconButton( + color: AppColor.primaryColor, + icon: SvgPicture.asset(_imagePaths.icFolderArrow, color: AppColor.colorArrowUserMailbox, fit: BoxFit.fill), + onPressed: () { + if (_onOpenMailboxActionClick != null) { + _onOpenMailboxActionClick!(_presentationMailbox); + } + } + )) ), ) ) diff --git a/lib/features/mailbox/presentation/widgets/user_information_widget_builder.dart b/lib/features/mailbox/presentation/widgets/user_information_widget_builder.dart index fa6c6cdd6..49f44f1f6 100644 --- a/lib/features/mailbox/presentation/widgets/user_information_widget_builder.dart +++ b/lib/features/mailbox/presentation/widgets/user_information_widget_builder.dart @@ -1,60 +1,83 @@ -import 'dart:ui'; import 'package:core/core.dart'; import 'package:flutter/material.dart'; -import 'package:flutter/widgets.dart'; -// import 'package:flutter_svg/flutter_svg.dart'; +import 'package:flutter_svg/flutter_svg.dart'; import 'package:model/model.dart'; +import 'package:tmail_ui_user/main/localizations/app_localizations.dart'; -typedef OnOpenUserInformationActionClick = void Function(); +typedef OnLogoutActionClick = void Function(); class UserInformationWidgetBuilder { - // final ImagePaths _imagePaths; + final ImagePaths _imagePaths; final UserProfile? _userProfile; + final BuildContext _context; - OnOpenUserInformationActionClick? _onOpenUserInformationActionClick; + OnLogoutActionClick? _onLogoutActionClick; UserInformationWidgetBuilder( - // this._imagePaths, - this._userProfile + this._imagePaths, + this._context, + this._userProfile, ); - UserInformationWidgetBuilder onOpenUserInformationAction( - OnOpenUserInformationActionClick onOpenUserInformationActionClick) { - _onOpenUserInformationActionClick = onOpenUserInformationActionClick; - return this; + void addOnLogoutAction(OnLogoutActionClick onLogoutActionClick) { + _onLogoutActionClick = onLogoutActionClick; } Widget build() { return Container( key: Key('user_information_widget'), - alignment: Alignment.center, - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(16), - color: AppColor.userInformationBackgroundColor), + color: Colors.transparent, + padding: EdgeInsets.zero, + margin: EdgeInsets.zero, child: ListTile( - onTap: () { - if (_onOpenUserInformationActionClick != null) { - _onOpenUserInformationActionClick!(); - } - }, - leading: (AvatarBuilder() - ..text(_userProfile != null ? _userProfile!.getAvatarText() : '') - ..size(40)) - .build(), - title: Transform( + contentPadding: EdgeInsets.zero, + onTap: () {}, + leading: Transform( transform: Matrix4.translationValues(0.0, 0.0, 0.0), + child: (AvatarBuilder() + ..text(_userProfile != null ? _userProfile!.getAvatarText() : '') + ..backgroundColor(Colors.white) + ..textColor(Colors.black) + ..addBoxShadows([BoxShadow( + color: AppColor.colorShadowBgContentEmail, + spreadRadius: 2, + blurRadius: 2, + offset: Offset(0, 1), // changes position of shadow + )]) + ..size(56)) + .build(), + ), + title: Transform( + transform: Matrix4.translationValues(8.0, 16.0, 0.0), child: Text( _userProfile != null ? _userProfile!.email : '', maxLines: 1, overflow: TextOverflow.ellipsis, - style: TextStyle(fontSize: 16, color: AppColor.nameUserColor, fontWeight: FontWeight.w500), - ))), - // trailing: Transform( - // transform: Matrix4.translationValues(0.0, 0.0, 0.0), - // child: IconButton( - // icon: SvgPicture.asset(_imagePaths.icNextArrow, width: 7, height: 12, fit: BoxFit.fill), - // onPressed: () => {}))), + style: TextStyle(fontSize: 17, color: AppColor.colorNameEmail, fontWeight: FontWeight.w600)) + ), + subtitle: Transform( + transform: Matrix4.translationValues(0.0, 8.0, 0.0), + child: Material( + borderRadius: BorderRadius.circular(12), + color: Colors.transparent, + child: Align( + alignment: Alignment.centerLeft, + child: TextButton( + onPressed: () => _onLogoutActionClick?.call(), + child: Text( + AppLocalizations.of(_context).logout, + style: TextStyle(fontSize: 14, color: AppColor.colorTextButton), + ), + ) + ) + ) + ), + trailing: Transform( + transform: Matrix4.translationValues(10.0, 0.0, 0.0), + child: IconButton( + icon: SvgPicture.asset(_imagePaths.icNextArrow, width: 7, height: 12, fit: BoxFit.fill, color: AppColor.colorArrowUserMailbox), + onPressed: () => {}))), ); } } \ No newline at end of file diff --git a/lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view.dart b/lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view.dart index 3839bf922..13a5dda73 100644 --- a/lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view.dart +++ b/lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view.dart @@ -22,6 +22,9 @@ class MailboxDashBoardView extends GetWidget { ? responsiveUtils.getSizeWidthScreen(context) : responsiveUtils.getSizeWidthScreen(context) / 2), tablet: Container( + child: MailboxView(), + width: responsiveUtils.getSizeWidthScreen(context) / 2), + tabletLarge: Container( child: MailboxView(), width: responsiveUtils.getSizeWidthScreen(context) * 0.35), desktop: null diff --git a/lib/features/thread/presentation/thread_view.dart b/lib/features/thread/presentation/thread_view.dart index 2c4b0c547..dd1049c45 100644 --- a/lib/features/thread/presentation/thread_view.dart +++ b/lib/features/thread/presentation/thread_view.dart @@ -38,7 +38,8 @@ class ThreadView extends GetWidget { children: [ _buildAppBarThread(context), Obx(() => !controller.isSearchActive() - ? (SearchBarThreadViewWidget(context, imagePaths) + ? (SearchBarThreadViewWidget(imagePaths) + ..hintTextSearch(AppLocalizations.of(context).hint_search_emails) ..addOnOpenSearchViewAction(() => controller.enableSearch(context))) .build() : SizedBox.shrink()), diff --git a/lib/features/thread/presentation/widgets/search_bar_thread_view_widget.dart b/lib/features/thread/presentation/widgets/search_bar_thread_view_widget.dart index 41062e72c..3ce18c8da 100644 --- a/lib/features/thread/presentation/widgets/search_bar_thread_view_widget.dart +++ b/lib/features/thread/presentation/widgets/search_bar_thread_view_widget.dart @@ -2,24 +2,20 @@ import 'package:core/core.dart'; import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; -import 'package:tmail_ui_user/main/localizations/app_localizations.dart'; typedef OnOpenSearchViewAction = Function(); class SearchBarThreadViewWidget { OnOpenSearchViewAction? _onOpenSearchViewAction; - final BuildContext _context; final ImagePaths _imagePaths; double? _heightSearchBar; EdgeInsets? _padding; EdgeInsets? _margin; + String? _hintTextSearch; - SearchBarThreadViewWidget( - this._context, - this._imagePaths, - ); + SearchBarThreadViewWidget(this._imagePaths); void addOnOpenSearchViewAction(OnOpenSearchViewAction onOpenSearchViewAction) { _onOpenSearchViewAction = onOpenSearchViewAction; @@ -37,6 +33,10 @@ class SearchBarThreadViewWidget { _margin = margin; } + void hintTextSearch(String text) { + _hintTextSearch = text; + } + Widget build() { return GestureDetector( onTap: () => _onOpenSearchViewAction?.call(), @@ -56,7 +56,7 @@ class SearchBarThreadViewWidget { children: [ _buildSearchButton(), Text( - AppLocalizations.of(_context).hint_search_emails, + _hintTextSearch ?? '', style: TextStyle(fontSize: 17, color: AppColor.colorHintSearchBar),) ] ) diff --git a/lib/main/localizations/app_localizations.dart b/lib/main/localizations/app_localizations.dart index f4f3e29ec..50c07ff02 100644 --- a/lib/main/localizations/app_localizations.dart +++ b/lib/main/localizations/app_localizations.dart @@ -526,4 +526,22 @@ class AppLocalizations { args: [action] ); } + + String get folders { + return Intl.message( + 'Folders', + name: 'folders' + ); + } + + String get logout { + return Intl.message('Logout', + name: 'logout'); + } + + String get hint_search_mailboxes { + return Intl.message( + 'Search for mailboxes', + name: 'hint_search_mailboxes'); + } } \ No newline at end of file