diff --git a/core/lib/presentation/utils/responsive_utils.dart b/core/lib/presentation/utils/responsive_utils.dart index 9ec00d7c1..c4b42eeef 100644 --- a/core/lib/presentation/utils/responsive_utils.dart +++ b/core/lib/presentation/utils/responsive_utils.dart @@ -84,8 +84,8 @@ class ResponsiveUtils { bool hasLeftMenuDrawerActive(BuildContext context) { if (BuildUtils.isWeb) { - return isMobile(context) && - isTablet(context) && + return isMobile(context) || + isTablet(context) || isTabletLarge(context); } else { return true; @@ -94,4 +94,26 @@ class ResponsiveUtils { bool isWebDesktop(BuildContext context) => BuildUtils.isWeb && isDesktop(context); + + bool mailboxDashboardHasMailboxAndEmailView(BuildContext context) { + if (BuildUtils.isWeb) { + return isDesktop(context) || + isMobile(context) || + isTablet(context); + } else { + return isPortraitMobile(context) || + isLandscapeMobile(context) || + isTablet(context); + } + } + + bool mailboxDashboardOnlyHasEmailView(BuildContext context) { + if (BuildUtils.isWeb) { + return isMobile(context) || isTablet(context); + } else { + return isPortraitMobile(context) || + isLandscapeMobile(context) || + isTablet(context); + } + } } \ No newline at end of file diff --git a/core/lib/presentation/views/button/button_builder.dart b/core/lib/presentation/views/button/button_builder.dart index b550a0ecd..c8f2ad1bb 100644 --- a/core/lib/presentation/views/button/button_builder.dart +++ b/core/lib/presentation/views/button/button_builder.dart @@ -122,6 +122,7 @@ class ButtonBuilder { if (_text != null) { return _isVertical! ? Column( + mainAxisSize: MainAxisSize.min, mainAxisAlignment: MainAxisAlignment.center, children: [ _buildIcon(), @@ -129,6 +130,7 @@ class ButtonBuilder { if (_iconAction != null) _iconAction! ]) : Row( + mainAxisSize: MainAxisSize.min, mainAxisAlignment: MainAxisAlignment.center, children: [ _buildIcon(), @@ -148,7 +150,7 @@ class ButtonBuilder { return Text( '${_text ?? ''}', maxLines: 1, - overflow: TextOverflow.ellipsis, + overflow: CommonTextStyle.defaultTextOverFlow, style: _textStyle ?? TextStyle(fontSize: 12, color: AppColor.colorTextButton), ); } diff --git a/core/lib/presentation/views/responsive/responsive_widget.dart b/core/lib/presentation/views/responsive/responsive_widget.dart index 52c797df2..7e7c8ed35 100644 --- a/core/lib/presentation/views/responsive/responsive_widget.dart +++ b/core/lib/presentation/views/responsive/responsive_widget.dart @@ -26,30 +26,51 @@ class ResponsiveWidget extends StatelessWidget { Widget build(BuildContext context) { log('ResponsiveWidget::build(): WIDTH_SIZE: ${responsiveUtils.getDeviceWidth(context)}'); - if (responsiveUtils.isLandscapeMobile(context)) { - return landscapeMobile ?? mobile; - } + if (BuildUtils.isWeb) { - if (responsiveUtils.isLandscapeTablet(context)) { - return landscapeTablet ?? tablet ?? mobile; - } + if (responsiveUtils.isMobile(context)) { + return tablet ?? mobile; + } - if (responsiveUtils.isMobile(context)) { - return tablet ?? mobile; - } + if (responsiveUtils.isTablet(context)) { + return tablet ?? mobile; + } - if (responsiveUtils.isTablet(context)) { - return tablet ?? mobile; - } + if (responsiveUtils.isTabletLarge(context)) { + return tabletLarge ?? tablet ?? mobile; + } - if (responsiveUtils.isTabletLarge(context)) { - return tabletLarge ?? tablet ?? mobile; - } + if (responsiveUtils.isDesktop(context)) { + return desktop ?? tablet ?? mobile; + } - if (responsiveUtils.isDesktop(context)) { - return desktop ?? tablet ?? mobile; - } + return mobile; + } else { + if (responsiveUtils.isLandscapeMobile(context)) { + return landscapeMobile ?? mobile; + } - return mobile; + if (responsiveUtils.isLandscapeTablet(context)) { + return landscapeTablet ?? tablet ?? mobile; + } + + if (responsiveUtils.isMobile(context)) { + return tablet ?? mobile; + } + + if (responsiveUtils.isTablet(context)) { + return tablet ?? mobile; + } + + if (responsiveUtils.isTabletLarge(context)) { + return tabletLarge ?? tablet ?? mobile; + } + + if (responsiveUtils.isDesktop(context)) { + return desktop ?? tablet ?? mobile; + } + + return mobile; + } } } \ No newline at end of file diff --git a/lib/features/email/presentation/email_view.dart b/lib/features/email/presentation/email_view.dart index 344d137f3..bc36bdb02 100644 --- a/lib/features/email/presentation/email_view.dart +++ b/lib/features/email/presentation/email_view.dart @@ -122,11 +122,11 @@ class EmailView extends GetWidget with NetworkConnectionMixin { } Widget _buildBottomBar(BuildContext context) { - bool isMobileDevice = responsiveUtils.isPortraitMobile(context) && + bool isMobileDevice = responsiveUtils.isPortraitMobile(context) || responsiveUtils.isLandscapeMobile(context); return Padding( padding: EdgeInsets.only( - bottom: !BuildUtils.isWeb && isMobileDevice ? 16 : 0), + bottom: isMobileDevice ? 16 : 0), child: Obx(() => (BottomBarMailWidgetBuilder( context, imagePaths, diff --git a/lib/features/email/presentation/widgets/app_bar_mail_widget_builder.dart b/lib/features/email/presentation/widgets/app_bar_mail_widget_builder.dart index 813ff6450..21ca58d38 100644 --- a/lib/features/email/presentation/widgets/app_bar_mail_widget_builder.dart +++ b/lib/features/email/presentation/widgets/app_bar_mail_widget_builder.dart @@ -51,9 +51,9 @@ class AppBarMailWidgetBuilder { child: Row( mainAxisAlignment: MainAxisAlignment.end, children: [ - if (_mailboxDashboardOnlyHasEmailView(_context)) + if (_responsiveUtils.mailboxDashboardHasMailboxAndEmailView(_context)) _buildBackButton(), - if (_mailboxDashboardOnlyHasEmailView(_context)) + if (_responsiveUtils.mailboxDashboardHasMailboxAndEmailView(_context)) Expanded(child: _buildMailboxName()), if (_presentationEmail != null) _buildListOptionButton(), ] @@ -62,16 +62,6 @@ class AppBarMailWidgetBuilder { ); } - bool _mailboxDashboardOnlyHasEmailView(BuildContext context) { - if (BuildUtils.isWeb) { - return _responsiveUtils.isDesktop(context); - } else { - return _responsiveUtils.isPortraitMobile(context) || - _responsiveUtils.isLandscapeMobile(context) || - _responsiveUtils.isTablet(context); - } - } - Widget _buildBackButton() { return buildIconWeb( icon: SvgPicture.asset(_imagePaths.icBack, width: 18, height: 18, color: AppColor.colorTextButton, fit: BoxFit.fill), diff --git a/lib/features/email/presentation/widgets/bottom_bar_mail_widget_builder.dart b/lib/features/email/presentation/widgets/bottom_bar_mail_widget_builder.dart index 3f5ab7f34..b82b60a8f 100644 --- a/lib/features/email/presentation/widgets/bottom_bar_mail_widget_builder.dart +++ b/lib/features/email/presentation/widgets/bottom_bar_mail_widget_builder.dart @@ -7,6 +7,8 @@ typedef OnPressEmailActionClick = void Function(EmailActionType emailActionType) class BottomBarMailWidgetBuilder { + static const double maxWidthBottomBar = 540; + final BuildContext _context; final ImagePaths _imagePaths; final ResponsiveUtils _responsiveUtils; @@ -32,7 +34,9 @@ class BottomBarMailWidgetBuilder { color: Colors.white, child: MediaQuery( data: const MediaQueryData(padding: EdgeInsets.zero), - child: _presentationEmail != null ? _buildListOptionButton(_presentationEmail!) : const SizedBox.shrink() + child: _presentationEmail != null + ? _buildListOptionButton(_presentationEmail!) + : const SizedBox.shrink() ) ); } @@ -91,7 +95,7 @@ class BottomBarMailWidgetBuilder { }}) ..text(AppLocalizations.of(_context).forward, isVertical: _responsiveUtils.isMobile(_context))) .build()), - if (!_responsiveUtils.isDesktop(_context)) + if (_responsiveUtils.mailboxDashboardOnlyHasEmailView(_context)) Expanded(child: (ButtonBuilder(_imagePaths.icNewMessage) ..key(const Key('button_new_message')) ..size(20) diff --git a/lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view_web.dart b/lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view_web.dart index 1305ea580..f75ea4f3e 100644 --- a/lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view_web.dart +++ b/lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view_web.dart @@ -18,8 +18,6 @@ import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/widgets/ad import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/widgets/advanced_search/icon_open_advanced_search_widget.dart'; import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/widgets/email_quick_search_item_tile_widget.dart'; import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/widgets/recent_search_item_tile_widget.dart'; -import 'package:tmail_ui_user/features/manage_account/presentation/model/app_setting.dart'; -import 'package:tmail_ui_user/features/manage_account/presentation/model/reading_pane.dart'; import 'package:tmail_ui_user/features/thread/domain/model/filter_message_option.dart'; import 'package:tmail_ui_user/features/thread/presentation/thread_view.dart'; import 'package:tmail_ui_user/main/localizations/app_localizations.dart'; @@ -34,8 +32,7 @@ class MailboxDashBoardView extends BaseMailboxDashBoardView { @override Widget build(BuildContext context) { - if (controller.isDrawerOpen && (responsiveUtils.isDesktop(context) - || responsiveUtils.isTabletLarge(context))) { + if (controller.isDrawerOpen && responsiveUtils.isDesktop(context)) { WidgetsBinding.instance.addPostFrameCallback((_) { controller.closeMailboxMenuDrawer(); }); @@ -48,10 +45,9 @@ class MailboxDashBoardView extends BaseMailboxDashBoardView { responsiveUtils: responsiveUtils, mobile: SizedBox(child: MailboxView(), width: ResponsiveUtils.defaultSizeDrawer), tablet: SizedBox(child: MailboxView(), width: ResponsiveUtils.defaultSizeDrawer), - tabletLarge: const SizedBox.shrink(), - desktop: const SizedBox.shrink(), - ), - drawerEnableOpenDragGesture: responsiveUtils.isMobile(context) || responsiveUtils.isTablet(context), + tabletLarge: SizedBox(child: MailboxView(), width: ResponsiveUtils.defaultSizeLeftMenuMobile), + desktop: const SizedBox.shrink()), + drawerEnableOpenDragGesture: !responsiveUtils.isDesktop(context), body: Portal( child: Stack(children: [ ResponsiveWidget( @@ -97,7 +93,16 @@ class MailboxDashBoardView extends BaseMailboxDashBoardView { SizedBox(child: MailboxView(), width: responsiveUtils.defaultSizeMenu), Expanded(child: Column(children: [ _buildMarkAsMailboxReadLoading(context), - Expanded(child: _wrapContainerForThreadAndEmail(context)) + Expanded(child: Obx(() { + switch(controller.routePath.value) { + case AppRoutes.THREAD: + return ThreadView(); + case AppRoutes.EMAIL: + return EmailView(); + default: + return const SizedBox.shrink(); + } + })) ])) ], )) @@ -106,60 +111,40 @@ class MailboxDashBoardView extends BaseMailboxDashBoardView { tabletLarge: Row( crossAxisAlignment: CrossAxisAlignment.start, children: [ - SizedBox(child: MailboxView(), width: responsiveUtils.defaultSizeMenu), - Expanded(child: _wrapContainerForThreadAndEmail(context)) + SizedBox( + width: ResponsiveUtils.defaultSizeLeftMenuMobile, + child: ThreadView()), + Expanded(child: EmailView()), ], ), - tablet: ThreadView(), - mobile: ThreadView(), + mobile: Obx(() { + switch(controller.routePath.value) { + case AppRoutes.THREAD: + return ThreadView(); + case AppRoutes.EMAIL: + return EmailView(); + default: + return ThreadView(); + } + }), ), Obx(() => controller.composerOverlayState.value == ComposerOverlayState.active ? ComposerView() : const SizedBox.shrink()), - Obx(() => controller.isNetworkConnectionAvailable() - ? const SizedBox.shrink() - : Align(alignment: Alignment.bottomCenter, child: buildNetworkConnectionWidget(context))), + Obx(() { + if (controller.isNetworkConnectionAvailable()) { + return const SizedBox.shrink(); + } else { + return Align( + alignment: Alignment.bottomCenter, + child: buildNetworkConnectionWidget(context)); + } + }), ]), ), ); } - Widget _wrapContainerForThreadAndEmail(BuildContext context) { - switch(AppSetting.readingPane) { - case ReadingPane.noSplit: - return Obx(() { - switch(controller.routePath.value) { - case AppRoutes.THREAD: - return ThreadView(); - case AppRoutes.EMAIL: - return EmailView(); - default: - return const SizedBox.shrink(); - } - }); - case ReadingPane.rightOfInbox: - if (responsiveUtils.isDesktop(context)) { - return Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Expanded(flex: 1, child: ThreadView()), - Expanded(flex: 2, child: EmailView()), - ], - ); - } else { - return Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Expanded(flex: 1, child: ThreadView()), - Expanded(flex: 1, child: EmailView()), - ], - ); - } - default: - return const SizedBox.shrink(); - } - } - Widget _buildRightHeader(BuildContext context) { return Row(children: [ Obx(() { diff --git a/lib/features/manage_account/presentation/model/app_setting.dart b/lib/features/manage_account/presentation/model/app_setting.dart deleted file mode 100644 index 5de65ed1f..000000000 --- a/lib/features/manage_account/presentation/model/app_setting.dart +++ /dev/null @@ -1,6 +0,0 @@ - -import 'package:tmail_ui_user/features/manage_account/presentation/model/reading_pane.dart'; - -class AppSetting { - static ReadingPane readingPane = ReadingPane.noSplit; -} \ No newline at end of file diff --git a/lib/features/thread/presentation/widgets/app_bar_thread_widget_builder.dart b/lib/features/thread/presentation/widgets/app_bar_thread_widget_builder.dart index 5ec772b62..338a29190 100644 --- a/lib/features/thread/presentation/widgets/app_bar_thread_widget_builder.dart +++ b/lib/features/thread/presentation/widgets/app_bar_thread_widget_builder.dart @@ -88,8 +88,10 @@ class AppBarThreadWidgetBuilder { Widget _buildBodyAppBarForWeb() { return Row(children: [ - if (!_responsiveUtils.isTabletLarge(_context)) _buildMenuButton(), - if (_responsiveUtils.isTabletLarge(_context)) const SizedBox(width: 16), + if (_responsiveUtils.hasLeftMenuDrawerActive(_context)) + _buildMenuButton(), + if (_responsiveUtils.hasLeftMenuDrawerActive(_context)) + const SizedBox(width: 16), Expanded(child: Text( _currentMailbox?.name?.name.capitalizeFirstEach ?? '', maxLines: 1,