From fca73d467646fde4fa25555a498aecd28b25b409 Mon Sep 17 00:00:00 2001 From: dab246 Date: Mon, 12 Sep 2022 10:16:41 +0700 Subject: [PATCH] TF-888 Update new design for notification message vacation --- .../extensions/color_extension.dart | 2 +- .../email/presentation/email_view.dart | 3 +- .../mailbox_dashboard_controller.dart | 12 ++ .../mailbox_dashboard_view_web.dart | 3 +- .../manage_account_dashboard_controller.dart | 18 +++ .../manage_account_dashboard_view.dart | 10 +- .../menu/settings/settings_view.dart | 6 +- .../model/manage_account_arguments.dart | 6 +- .../vacation_notification_message_widget.dart | 143 ++++++++++++++---- .../thread/presentation/thread_view.dart | 27 ++-- lib/l10n/intl_messages.arb | 20 ++- lib/main/localizations/app_localizations.dart | 21 ++- 12 files changed, 202 insertions(+), 69 deletions(-) diff --git a/core/lib/presentation/extensions/color_extension.dart b/core/lib/presentation/extensions/color_extension.dart index df4cd6129..7849d82d4 100644 --- a/core/lib/presentation/extensions/color_extension.dart +++ b/core/lib/presentation/extensions/color_extension.dart @@ -138,11 +138,11 @@ extension AppColor on Color { static const colorBackgroundFieldConditionRulesFilter = Color(0xFFF2F3F5); static const colorDividerRuleFilter = Color(0xFFE7E8EC); static const colorIconTextField = Color(0xFFB8C1CC); - static const colorVacationNotificationMessageBackground = Color(0x2999A2AD); static const colorDeletePermanentlyButton = Color(0xffE64646); static const colorDefaultButton = Color(0xff9AA1AD); static const colorVacationSettingExplanation = Color(0xFF686E76); static const colorBackgroundVacationSettingField = Color(0xFFF2F3F5); + static const colorBackgroundNotificationVacationSetting= Color(0xFFFFF5C2); static const mapGradientColor = [ [Color(0xFF21D4FD), Color(0xFFB721FF)], diff --git a/lib/features/email/presentation/email_view.dart b/lib/features/email/presentation/email_view.dart index fe6e4d3d1..5de0ae2c1 100644 --- a/lib/features/email/presentation/email_view.dart +++ b/lib/features/email/presentation/email_view.dart @@ -71,7 +71,8 @@ class EmailView extends GetWidget with NetworkConnectionMixin { radius: 0, margin: EdgeInsets.zero, vacationResponse: controller.mailboxDashBoardController.vacationResponse.value!, - action: () => controller.mailboxDashBoardController.disableVacationResponder()), + actionGotoVacationSetting: () => controller.mailboxDashBoardController.goToVacationSetting(), + actionEndNow: () => controller.mailboxDashBoardController.disableVacationResponder()), ); } else { return const SizedBox.shrink(); diff --git a/lib/features/mailbox_dashboard/presentation/controller/mailbox_dashboard_controller.dart b/lib/features/mailbox_dashboard/presentation/controller/mailbox_dashboard_controller.dart index 8cfbca053..426bf97c5 100644 --- a/lib/features/mailbox_dashboard/presentation/controller/mailbox_dashboard_controller.dart +++ b/lib/features/mailbox_dashboard/presentation/controller/mailbox_dashboard_controller.dart @@ -50,6 +50,7 @@ import 'package:tmail_ui_user/features/manage_account/domain/usecases/get_all_va import 'package:tmail_ui_user/features/manage_account/domain/usecases/log_out_oidc_interactor.dart'; import 'package:tmail_ui_user/features/manage_account/domain/usecases/update_vacation_interactor.dart'; import 'package:tmail_ui_user/features/manage_account/presentation/extensions/vacation_response_extension.dart'; +import 'package:tmail_ui_user/features/manage_account/presentation/model/account_menu_item.dart'; import 'package:tmail_ui_user/features/manage_account/presentation/model/manage_account_arguments.dart'; import 'package:tmail_ui_user/features/thread/domain/model/filter_message_option.dart'; import 'package:tmail_ui_user/features/thread/domain/model/search_query.dart'; @@ -623,6 +624,17 @@ class MailboxDashBoardController extends ReloadableController { } } + void goToVacationSetting() async { + final result = await push(AppRoutes.MANAGE_ACCOUNT, + arguments: ManageAccountArguments( + sessionCurrent, + menuSettingCurrent: AccountMenuItem.vacation)); + + if (result is VacationResponse) { + vacationResponse.value = result; + } + } + void _handleUpdateVacationSuccess(UpdateVacationSuccess success) { if (success.listVacationResponse.isNotEmpty) { if (currentContext != null && currentOverlayContext != null) { 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 8dafc1010..4694e724c 100644 --- a/lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view_web.dart +++ b/lib/features/mailbox_dashboard/presentation/mailbox_dashboard_view_web.dart @@ -100,7 +100,8 @@ class MailboxDashBoardView extends BaseMailboxDashBoardView { return VacationNotificationMessageWidget( margin: const EdgeInsets.only(top: 16, right: 16), vacationResponse: controller.vacationResponse.value!, - action: () => controller.disableVacationResponder()); + actionGotoVacationSetting: () => controller.goToVacationSetting(), + actionEndNow: () => controller.disableVacationResponder()); } else { return const SizedBox.shrink(); } diff --git a/lib/features/manage_account/presentation/manage_account_dashboard_controller.dart b/lib/features/manage_account/presentation/manage_account_dashboard_controller.dart index 8d5f0cdd8..cdbae9892 100644 --- a/lib/features/manage_account/presentation/manage_account_dashboard_controller.dart +++ b/lib/features/manage_account/presentation/manage_account_dashboard_controller.dart @@ -33,6 +33,7 @@ class ManageAccountDashBoardController extends ReloadableController { final _appToast = Get.find(); final _imagePaths = Get.find(); + final _responsiveUtils = Get.find(); final GetAllVacationInteractor _getAllVacationInteractor; final UpdateVacationInteractor _updateVacationInteractor; @@ -107,6 +108,9 @@ class ManageAccountDashBoardController extends ReloadableController { _getUserProfile(); _getVacationResponse(); injectAutoCompleteBindings(); + if (arguments.menuSettingCurrent != null) { + _goToSettingMenuCurrent(arguments.menuSettingCurrent!); + } } else { if (kIsWeb) { reload(); @@ -157,6 +161,20 @@ class ManageAccountDashBoardController extends ReloadableController { closeMenuDrawer(); } } + + void _goToSettingMenuCurrent(AccountMenuItem accountMenuItem) { + if(accountMenuItem == AccountMenuItem.emailRules) { + EmailRulesBindings().dependencies(); + } + if(accountMenuItem == AccountMenuItem.forward) { + ForwardBindings().dependencies(); + } + accountMenuItemSelected.value = accountMenuItem; + if (currentContext != null && + !_responsiveUtils.isDesktop(currentContext!)) { + settingsPageLevel.value = SettingsPageLevel.level1; + } + } void goToSettings() { pushAndPop(AppRoutes.MANAGE_ACCOUNT, diff --git a/lib/features/manage_account/presentation/manage_account_dashboard_view.dart b/lib/features/manage_account/presentation/manage_account_dashboard_view.dart index b8a4c79a5..9a62d9dd9 100644 --- a/lib/features/manage_account/presentation/manage_account_dashboard_view.dart +++ b/lib/features/manage_account/presentation/manage_account_dashboard_view.dart @@ -1,7 +1,6 @@ import 'package:core/core.dart'; import 'package:flutter/material.dart'; -import 'package:flutter_svg/flutter_svg.dart'; import 'package:get/get.dart'; import 'package:tmail_ui_user/features/emails_forward_creator/presentation/emails_forward_creator_view.dart'; import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/mixin/user_setting_popup_menu_mixin.dart'; @@ -91,8 +90,12 @@ class ManageAccountDashBoardView extends GetWidget controller.disableVacationResponder()); + actionGotoVacationSetting: !controller.inVacationSettings() + ? () => controller.selectAccountMenuItem(AccountMenuItem.vacation) + : null, + actionEndNow: () => controller.disableVacationResponder()); } else if ((controller.vacationResponse.value?.vacationResponderIsWaiting == true || controller.vacationResponse.value?.vacationResponderIsStopped == true) && controller.accountMenuItemSelected.value == AccountMenuItem.vacation) { @@ -101,10 +104,9 @@ class ManageAccountDashBoardView extends GetWidget { left: BuildUtils.isWeb ? 24 : 16, right: BuildUtils.isWeb ? 24 : 16, top: 16), + fromAccountDashBoard: true, vacationResponse: controller.manageAccountDashboardController.vacationResponse.value!, - action: () => controller.manageAccountDashboardController.disableVacationResponder()); + actionEndNow: () => controller.manageAccountDashboardController.disableVacationResponder()); } else if ((controller.manageAccountDashboardController.vacationResponse.value?.vacationResponderIsWaiting == true || controller.manageAccountDashboardController.vacationResponse.value?.vacationResponderIsStopped == true) && controller.manageAccountDashboardController.inVacationSettings()) { @@ -59,10 +60,9 @@ class SettingsView extends GetWidget { left: BuildUtils.isWeb ? 24 : 16, right: BuildUtils.isWeb ? 24 : 16, top: 16), + fromAccountDashBoard: true, vacationResponse: controller.manageAccountDashboardController.vacationResponse.value!, padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 16), - fontWeight: FontWeight.normal, - backgroundColor: Colors.yellow, leadingIcon: const Padding( padding: EdgeInsets.only(right: 16), child: Icon(Icons.timer, size: 20), diff --git a/lib/features/manage_account/presentation/model/manage_account_arguments.dart b/lib/features/manage_account/presentation/model/manage_account_arguments.dart index 66f4f84ea..17eab59cc 100644 --- a/lib/features/manage_account/presentation/model/manage_account_arguments.dart +++ b/lib/features/manage_account/presentation/model/manage_account_arguments.dart @@ -1,13 +1,15 @@ import 'package:equatable/equatable.dart'; import 'package:jmap_dart_client/jmap/core/session/session.dart'; +import 'package:tmail_ui_user/features/manage_account/presentation/model/account_menu_item.dart'; class ManageAccountArguments with EquatableMixin { final Session? session; + final AccountMenuItem? menuSettingCurrent; - ManageAccountArguments(this.session); + ManageAccountArguments(this.session, {this.menuSettingCurrent}); @override - List get props => [session]; + List get props => [session, menuSettingCurrent]; } \ No newline at end of file diff --git a/lib/features/manage_account/presentation/vacation/widgets/vacation_notification_message_widget.dart b/lib/features/manage_account/presentation/vacation/widgets/vacation_notification_message_widget.dart index 1ce627ded..9a78bca46 100644 --- a/lib/features/manage_account/presentation/vacation/widgets/vacation_notification_message_widget.dart +++ b/lib/features/manage_account/presentation/vacation/widgets/vacation_notification_message_widget.dart @@ -1,68 +1,151 @@ import 'package:core/core.dart'; import 'package:flutter/material.dart'; +import 'package:get/get.dart'; import 'package:jmap_dart_client/jmap/mail/vacation/vacation_response.dart'; import 'package:tmail_ui_user/features/manage_account/presentation/extensions/vacation_response_extension.dart'; import 'package:tmail_ui_user/main/localizations/app_localizations.dart'; -typedef DisableVacationResponderAction = Function(); +typedef EndNowVacationSettingAction = Function(); +typedef GoToVacationSettingAction = Function(); class VacationNotificationMessageWidget extends StatelessWidget { final VacationResponse vacationResponse; - final DisableVacationResponderAction? action; + final EndNowVacationSettingAction? actionEndNow; + final GoToVacationSettingAction? actionGotoVacationSetting; final EdgeInsets? margin; final EdgeInsets? padding; final double? radius; final Widget? leadingIcon; final Color? backgroundColor; final FontWeight? fontWeight; + final bool fromAccountDashBoard; const VacationNotificationMessageWidget({ super.key, required this.vacationResponse, - this.action, + this.actionEndNow, + this.actionGotoVacationSetting, this.radius, this.margin, this.padding, this.leadingIcon, this.backgroundColor, this.fontWeight, + this.fromAccountDashBoard = false, }); @override Widget build(BuildContext context) { return Container( width: double.infinity, - margin: margin ?? const EdgeInsets.symmetric(horizontal: 16), - padding: padding ?? const EdgeInsets.only(left: 16), + margin: margin ?? const EdgeInsets.symmetric(horizontal: 12), + padding: padding ?? const EdgeInsets.only(left: 12), decoration: BoxDecoration( - borderRadius: BorderRadius.circular(radius ?? 5), - color: backgroundColor ?? AppColor.colorVacationNotificationMessageBackground, + borderRadius: BorderRadius.circular(radius ?? 8), + color: backgroundColor ?? AppColor.colorBackgroundNotificationVacationSetting, + ), + child: ResponsiveWidget( + responsiveUtils: Get.find(), + mobile: _buildBodyForMobile(context), + tabletLarge: fromAccountDashBoard + ? _buildBodyForDesktop(context) + : _buildBodyForMobile(context), + landscapeTablet: fromAccountDashBoard + ? _buildBodyForDesktop(context) + : _buildBodyForMobile(context), + desktop: _buildBodyForDesktop(context), + tablet: _buildBodyForDesktop(context), + landscapeMobile: _buildBodyForDesktop(context), ), - child: Row(children: [ - if (leadingIcon != null) leadingIcon!, - Expanded( - child: Text( - vacationResponse.getNotificationMessage(context), - style: TextStyle( - color: Colors.black, - fontSize: 13, - fontWeight: fontWeight ?? FontWeight.w500, - ))), - if (action != null) - buildTextButton( - AppLocalizations.of(context).disable.allInCaps, - textStyle: const TextStyle( - fontWeight: FontWeight.w500, - fontSize: 13, - color: AppColor.colorTextButton), - backgroundColor: Colors.transparent, - width: 128, - height: 44, - radius: 10, - onTap: () => action!.call()) - ]), ); } + + Widget _buildBodyForDesktop(BuildContext context) { + return Row(children: [ + if (leadingIcon != null) leadingIcon!, + Expanded( + child: Text( + vacationResponse.getNotificationMessage(context), + style: TextStyle( + color: Colors.black, + fontSize: 16, + fontWeight: fontWeight ?? FontWeight.normal, + ))), + if (actionEndNow != null) + buildTextButton( + AppLocalizations.of(context).endNow, + textStyle: const TextStyle( + fontWeight: FontWeight.w500, + fontSize: 16, + color: AppColor.colorTextButton), + backgroundColor: Colors.transparent, + width: 90, + height: 44, + radius: 10, + onTap: () => actionEndNow!.call()), + if (actionGotoVacationSetting != null) + buildTextButton( + AppLocalizations.of(context).vacationSetting, + textStyle: const TextStyle( + fontWeight: FontWeight.w500, + fontSize: 16, + color: AppColor.colorTextButton), + backgroundColor: Colors.transparent, + width: 150, + height: 44, + radius: 10, + onTap: () => actionGotoVacationSetting!.call()) + ]); + } + + Widget _buildBodyForMobile(BuildContext context) { + return Column(children: [ + Row(children: [ + if (leadingIcon != null) leadingIcon!, + Expanded( + child: Padding( + padding: const EdgeInsets.only(top: 8, right: 12), + child: Center( + child: Text( + vacationResponse.getNotificationMessage(context), + style: TextStyle( + color: Colors.black, + fontSize: 16, + fontWeight: fontWeight ?? FontWeight.normal, + )), + ), + )), + ]), + Row(children: [ + const Spacer(), + if (actionEndNow != null) + buildTextButton( + AppLocalizations.of(context).endNow, + textStyle: const TextStyle( + fontWeight: FontWeight.w500, + fontSize: 16, + color: AppColor.colorTextButton), + backgroundColor: Colors.transparent, + width: 90, + height: 36, + radius: 10, + onTap: () => actionEndNow!.call()), + if (actionGotoVacationSetting != null) + buildTextButton( + AppLocalizations.of(context).vacationSetting, + textStyle: const TextStyle( + fontWeight: FontWeight.w500, + fontSize: 16, + color: AppColor.colorTextButton), + backgroundColor: Colors.transparent, + width: 150, + height: 36, + radius: 10, + onTap: () => actionGotoVacationSetting!.call()), + const Spacer(), + ]) + ]); + } } \ No newline at end of file diff --git a/lib/features/thread/presentation/thread_view.dart b/lib/features/thread/presentation/thread_view.dart index 0ab4224b3..db3bd2f4b 100644 --- a/lib/features/thread/presentation/thread_view.dart +++ b/lib/features/thread/presentation/thread_view.dart @@ -62,18 +62,6 @@ class ThreadView extends GetWidget with AppLoaderMixin, if ((!_responsiveUtils.isDesktop(context) && BuildUtils.isWeb) || !BuildUtils.isWeb) ... [ _buildAppBarNormal(context), - Obx(() { - if (controller.mailboxDashBoardController.vacationResponse.value?.vacationResponderIsValid == true) { - return Padding( - padding: const EdgeInsets.only(bottom: 16), - child: VacationNotificationMessageWidget( - vacationResponse: controller.mailboxDashBoardController.vacationResponse.value!, - action: () => controller.mailboxDashBoardController.disableVacationResponder()), - ); - } else { - return const SizedBox.shrink(); - } - }), Obx(() { return Stack(children: [ if (!controller.isSearchActive()) @@ -95,7 +83,20 @@ class ThreadView extends GetWidget with AppLoaderMixin, bottom: !BuildUtils.isWeb ? 16 : 0), child: _buildSearchFormActive(context)) ]); - }) + }), + Obx(() { + if (controller.mailboxDashBoardController.vacationResponse.value?.vacationResponderIsValid == true) { + return Padding( + padding: const EdgeInsets.only(bottom: 8, top: 4), + child: VacationNotificationMessageWidget( + vacationResponse: controller.mailboxDashBoardController.vacationResponse.value!, + actionGotoVacationSetting: () => controller.mailboxDashBoardController.goToVacationSetting(), + actionEndNow: () => controller.mailboxDashBoardController.disableVacationResponder()), + ); + } else { + return const SizedBox.shrink(); + } + }), ] else const SizedBox.shrink(), diff --git a/lib/l10n/intl_messages.arb b/lib/l10n/intl_messages.arb index 0b73e4c88..a35619cdb 100644 --- a/lib/l10n/intl_messages.arb +++ b/lib/l10n/intl_messages.arb @@ -1,5 +1,5 @@ { - "@@last_modified": "2022-09-09T19:44:24.604383", + "@@last_modified": "2022-09-12T10:15:14.832674", "initializing_data": "Initializing data...", "@initializing_data": { "type": "text", @@ -1996,12 +1996,6 @@ "placeholders_order": [], "placeholders": {} }, - "disable": "Disable", - "@disable": { - "type": "text", - "placeholders_order": [], - "placeholders": {} - }, "yourVacationResponderIsDisabledSuccessfully": "Your vacation responder is disabled successfully", "@yourVacationResponderIsDisabledSuccessfully": { "type": "text", @@ -2167,5 +2161,17 @@ "type": "text", "placeholders_order": [], "placeholders": {} + }, + "endNow": "End now", + "@endNow": { + "type": "text", + "placeholders_order": [], + "placeholders": {} + }, + "vacationSetting": "Vacation setting", + "@vacationSetting": { + "type": "text", + "placeholders_order": [], + "placeholders": {} } } \ No newline at end of file diff --git a/lib/main/localizations/app_localizations.dart b/lib/main/localizations/app_localizations.dart index ba3a14382..92fe7a723 100644 --- a/lib/main/localizations/app_localizations.dart +++ b/lib/main/localizations/app_localizations.dart @@ -2065,13 +2065,6 @@ class AppLocalizations { ); } - String get disable { - return Intl.message( - 'Disable', - name: 'disable', - ); - } - String get yourVacationResponderIsDisabledSuccessfully { return Intl.message( 'Your vacation responder is disabled successfully', @@ -2237,4 +2230,18 @@ class AppLocalizations { name: 'messageIsRequired', ); } + + String get endNow { + return Intl.message( + 'End now', + name: 'endNow', + ); + } + + String get vacationSetting { + return Intl.message( + 'Vacation setting', + name: 'vacationSetting', + ); + } } \ No newline at end of file