From eec37295c82e0fe31f32f621c773cef4a11b7f04 Mon Sep 17 00:00:00 2001 From: dab246 Date: Tue, 22 Feb 2022 15:06:21 +0700 Subject: [PATCH] TF-233 Add presentation for create new mailbox --- .../extensions/color_extension.dart | 6 + .../presentation/utils/responsive_utils.dart | 51 +----- .../views/text/input_decoration_builder.dart | 39 +++-- .../destination_picker_bindings.dart | 2 +- .../presentation/destination_picker_view.dart | 47 ++++- .../widgets/app_bar_mail_widget_builder.dart | 13 +- .../login/presentation/login_view.dart | 18 +- .../presentation/mailbox_controller.dart | 11 ++ .../mailbox/presentation/mailbox_view.dart | 2 +- .../mailbox_creator_bindings.dart | 10 ++ .../mailbox_creator_controller.dart | 44 +++++ .../presentation/mailbox_creator_view.dart | 165 ++++++++++++++++++ .../model/mailbox_creator_arguments.dart | 12 ++ .../model/new_mailbox_arguments.dart | 13 ++ .../app_bar_mailbox_creator_widget.dart | 87 +++++++++ ...mailbox_name_input_decoration_builder.dart | 33 ++++ lib/main/localizations/app_localizations.dart | 28 +++ lib/main/pages/app_pages.dart | 7 + lib/main/routes/app_routes.dart | 1 + 19 files changed, 503 insertions(+), 86 deletions(-) create mode 100644 lib/features/mailbox_creator/presentation/mailbox_creator_bindings.dart create mode 100644 lib/features/mailbox_creator/presentation/mailbox_creator_controller.dart create mode 100644 lib/features/mailbox_creator/presentation/mailbox_creator_view.dart create mode 100644 lib/features/mailbox_creator/presentation/model/mailbox_creator_arguments.dart create mode 100644 lib/features/mailbox_creator/presentation/model/new_mailbox_arguments.dart create mode 100644 lib/features/mailbox_creator/presentation/widgets/app_bar_mailbox_creator_widget.dart create mode 100644 lib/features/mailbox_creator/presentation/widgets/create_mailbox_name_input_decoration_builder.dart diff --git a/core/lib/presentation/extensions/color_extension.dart b/core/lib/presentation/extensions/color_extension.dart index c8253067e..a33f226d2 100644 --- a/core/lib/presentation/extensions/color_extension.dart +++ b/core/lib/presentation/extensions/color_extension.dart @@ -74,6 +74,12 @@ extension AppColor on Color { static const colorFilterMessageDisabled = Color(0xFF99A2AD); static const colorFilterMessageEnabled = Color(0xFF007AFF); static const colorDefaultCupertinoActionSheet = Color(0x66000000); + static const colorDisableMailboxCreateButton = Color(0x2E3C3C43); + static const colorInputBorderErrorVerifyName = Color(0xFFE64646); + static const colorInputBorderCreateMailbox = Color(0x1F000000); + static const colorInputBackgroundErrorVerifyName = Color(0xFFFAEBEB); + static const colorInputBackgroundCreateMailbox = Color(0xFFF2F3F5); + static const colorHintInputCreateMailbox= Color(0xFFA9B4C2); static const mapGradientColor = [ [Color(0xFF21D4FD), Color(0xFFB721FF)], diff --git a/core/lib/presentation/utils/responsive_utils.dart b/core/lib/presentation/utils/responsive_utils.dart index 80b2d97a2..d324e980a 100644 --- a/core/lib/presentation/utils/responsive_utils.dart +++ b/core/lib/presentation/utils/responsive_utils.dart @@ -10,10 +10,10 @@ class ResponsiveUtils { static const double _loginTextFieldWidthLargeScreen = 320.0; static const double _loginButtonWidth = 240.0; - static const double _tabletHorizontalMargin = 120.0; - static const double _tabletVerticalMargin = 200.0; - static const double _desktopVerticalMargin = 120.0; - static const double _desktopHorizontalMargin = 200.0; + final double tabletHorizontalMargin = 120.0; + final double tabletVerticalMargin = 200.0; + final double desktopVerticalMargin = 120.0; + final double desktopHorizontalMargin = 200.0; bool isMobileDevice(BuildContext context) => MediaQuery.of(context).size.shortestSide < 600; @@ -38,47 +38,4 @@ class ResponsiveUtils { double getWidthLoginTextField(BuildContext context) => isMobile(context) ? _loginTextFieldWidthSmallScreen : _loginTextFieldWidthLargeScreen; double getWidthLoginButton() => _loginButtonWidth; - - EdgeInsets getMarginDestinationPicker(BuildContext context) { - if (isMobileDevice(context) && isLandscape(context)) { - return EdgeInsets.only( - left: _tabletHorizontalMargin, - right: _tabletHorizontalMargin, - top: 50.0); - } else if (isTablet(context)) { - return getSizeHeightScreen(context) <= _tabletVerticalMargin * 2 - ? EdgeInsets.symmetric( - horizontal: _tabletHorizontalMargin, - vertical: 0.0) - : EdgeInsets.symmetric( - horizontal: _tabletHorizontalMargin, - vertical: _tabletVerticalMargin); - } else if (isDesktop(context) || isTabletLarge(context)) { - return getSizeHeightScreen(context) <= _desktopVerticalMargin * 2 - ? EdgeInsets.symmetric( - horizontal: _desktopHorizontalMargin, - vertical: 0.0) - : EdgeInsets.symmetric( - horizontal: _desktopHorizontalMargin, - vertical: _desktopVerticalMargin); - } else { - return EdgeInsets.zero; - } - } - - BorderRadius radiusDestinationPicker(BuildContext context, double radius) { - if (isMobileDevice(context) && isLandscape(context)) { - return BorderRadius.only(topLeft: Radius.circular(radius), topRight: Radius.circular(radius)); - } else if (isTablet(context)) { - return getSizeHeightScreen(context) <= _tabletVerticalMargin * 2 - ? BorderRadius.only(topLeft: Radius.circular(radius), topRight: Radius.circular(radius)) - : BorderRadius.circular(radius); - } else if (isDesktop(context) || isTabletLarge(context)) { - return getSizeHeightScreen(context) <= _desktopVerticalMargin * 2 - ? BorderRadius.only(topLeft: Radius.circular(radius), topRight: Radius.circular(radius)) - : BorderRadius.circular(radius); - } else { - return BorderRadius.only(topLeft: Radius.circular(radius), topRight: Radius.circular(radius)); - } - } } \ No newline at end of file diff --git a/core/lib/presentation/views/text/input_decoration_builder.dart b/core/lib/presentation/views/text/input_decoration_builder.dart index 50cd91ba5..f25f5ef58 100644 --- a/core/lib/presentation/views/text/input_decoration_builder.dart +++ b/core/lib/presentation/views/text/input_decoration_builder.dart @@ -8,40 +8,48 @@ abstract class InputDecorationBuilder { TextStyle? hintStyle; EdgeInsets? contentPadding; OutlineInputBorder? enabledBorder; + OutlineInputBorder? errorBorder; + String? errorText; + TextStyle? errorTextStyle; - InputDecorationBuilder setPrefixText(String newPrefixText) { + void setPrefixText(String newPrefixText) { prefixText = newPrefixText; - return this; } - InputDecorationBuilder setLabelText(String newLabelText) { + void setLabelText(String newLabelText) { labelText = newLabelText; - return this; } - InputDecorationBuilder setLabelStyle(TextStyle newLabelStyle) { + void setLabelStyle(TextStyle newLabelStyle) { labelStyle = newLabelStyle; - return this; } - InputDecorationBuilder setHintText(String newHintText) { + void setHintText(String newHintText) { hintText = newHintText; - return this; } - InputDecorationBuilder setHintStyle(TextStyle newHintStyle) { + void setHintStyle(TextStyle newHintStyle) { hintStyle = newHintStyle; - return this; } - InputDecorationBuilder setContentPadding(EdgeInsets newContentPadding) { + void setContentPadding(EdgeInsets newContentPadding) { contentPadding = newContentPadding; - return this; } - InputDecorationBuilder setEnabledBorder(OutlineInputBorder newEnabledBorder) { + void setEnabledBorder(OutlineInputBorder newEnabledBorder) { enabledBorder = newEnabledBorder; - return this; + } + + void setErrorBorder(OutlineInputBorder newErrorBorder) { + errorBorder = newErrorBorder; + } + + void setErrorText(String newText) { + errorText = newText; + } + + void setErrorTextStyle(TextStyle newStyle) { + errorTextStyle = newStyle; } InputDecoration build() { @@ -52,6 +60,9 @@ abstract class InputDecorationBuilder { hintText: hintText, hintStyle: hintStyle, contentPadding: contentPadding, + errorBorder: errorBorder, + errorText: errorText, + errorStyle: errorTextStyle, enabledBorder: enabledBorder); } } \ No newline at end of file diff --git a/lib/features/destination_picker/presentation/destination_picker_bindings.dart b/lib/features/destination_picker/presentation/destination_picker_bindings.dart index 0bfb82ff0..80b173f0d 100644 --- a/lib/features/destination_picker/presentation/destination_picker_bindings.dart +++ b/lib/features/destination_picker/presentation/destination_picker_bindings.dart @@ -32,7 +32,7 @@ class DestinationPickerBindings extends Bindings { Get.lazyPut(() => Get.find()); Get.lazyPut(() => GetAllMailboxInteractor(Get.find())); Get.lazyPut(() => TreeBuilder()); - Get.put(DestinationPickerController( + Get.lazyPut(() => DestinationPickerController( Get.find(), Get.find())); } diff --git a/lib/features/destination_picker/presentation/destination_picker_view.dart b/lib/features/destination_picker/presentation/destination_picker_view.dart index 80e353789..7a4875082 100644 --- a/lib/features/destination_picker/presentation/destination_picker_view.dart +++ b/lib/features/destination_picker/presentation/destination_picker_view.dart @@ -24,9 +24,9 @@ class DestinationPickerView extends GetWidget { borderOnForeground: false, color: Colors.transparent, child: Container( - margin: _responsiveUtils.getMarginDestinationPicker(context), + margin: _getMarginDestinationPicker(context), child: ClipRRect( - borderRadius: _responsiveUtils.radiusDestinationPicker(context, 20), + borderRadius: _radiusDestinationPicker(context, 20), child: GestureDetector( onTap: () => {}, child: SafeArea( @@ -194,4 +194,47 @@ class DestinationPickerView extends GetWidget { )) .toList(); } + + EdgeInsets _getMarginDestinationPicker(BuildContext context) { + if (_responsiveUtils.isMobileDevice(context) && _responsiveUtils.isLandscape(context)) { + return EdgeInsets.only( + left: _responsiveUtils.tabletHorizontalMargin, + right: _responsiveUtils.tabletHorizontalMargin, + top: 50.0); + } else if (_responsiveUtils.isTablet(context)) { + return _responsiveUtils.getSizeHeightScreen(context) <= _responsiveUtils.tabletVerticalMargin * 2 + ? EdgeInsets.symmetric( + horizontal: _responsiveUtils.tabletHorizontalMargin, + vertical: 0.0) + : EdgeInsets.symmetric( + horizontal: _responsiveUtils.tabletHorizontalMargin, + vertical: _responsiveUtils.tabletVerticalMargin); + } else if (_responsiveUtils.isDesktop(context) || _responsiveUtils.isTabletLarge(context)) { + return _responsiveUtils.getSizeHeightScreen(context) <= _responsiveUtils.desktopVerticalMargin * 2 + ? EdgeInsets.symmetric( + horizontal: _responsiveUtils.desktopHorizontalMargin, + vertical: 0.0) + : EdgeInsets.symmetric( + horizontal: _responsiveUtils.desktopHorizontalMargin, + vertical: _responsiveUtils.desktopVerticalMargin); + } else { + return EdgeInsets.zero; + } + } + + BorderRadius _radiusDestinationPicker(BuildContext context, double radius) { + if (_responsiveUtils.isMobileDevice(context) && _responsiveUtils.isLandscape(context)) { + return BorderRadius.only(topLeft: Radius.circular(radius), topRight: Radius.circular(radius)); + } else if (_responsiveUtils.isTablet(context)) { + return _responsiveUtils.getSizeHeightScreen(context) <= _responsiveUtils.tabletVerticalMargin * 2 + ? BorderRadius.only(topLeft: Radius.circular(radius), topRight: Radius.circular(radius)) + : BorderRadius.circular(radius); + } else if (_responsiveUtils.isDesktop(context) || _responsiveUtils.isTabletLarge(context)) { + return _responsiveUtils.getSizeHeightScreen(context) <= _responsiveUtils.desktopVerticalMargin * 2 + ? BorderRadius.only(topLeft: Radius.circular(radius), topRight: Radius.circular(radius)) + : BorderRadius.circular(radius); + } else { + return BorderRadius.only(topLeft: Radius.circular(radius), topRight: Radius.circular(radius)); + } + } } \ No newline at end of file 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 07a26e239..dc07b291b 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 @@ -2,9 +2,7 @@ import 'package:core/core.dart'; import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; -import 'package:get/get.dart'; import 'package:model/model.dart'; -import 'package:tmail_ui_user/main/routes/app_routes.dart'; typedef OnBackActionClick = void Function(); typedef OnUnreadEmailActionClick = void Function(PresentationEmail presentationEmail); @@ -56,8 +54,7 @@ class AppBarMailWidgetBuilder { crossAxisAlignment: CrossAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.end, children: [ - if ((!_responsiveUtils.isDesktop(_context) && !_responsiveUtils.isTabletLarge(_context)) - || Get.currentRoute != AppRoutes.MAILBOX_DASHBOARD) + if ((!_responsiveUtils.isDesktop(_context) && !_responsiveUtils.isTabletLarge(_context))) Expanded(child: Row( crossAxisAlignment: CrossAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.start, @@ -86,14 +83,6 @@ class AppBarMailWidgetBuilder { mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.center, children: [ - // IconButton( - // color: AppColor.baseTextColor, - // icon: SvgPicture.asset(_imagePaths.icTrash, color: AppColor.baseTextColor, fit: BoxFit.fill), - // onPressed: () { - // if (_onBackActionClick != null) { - // _onBackActionClick!(); - // } - // }), IconButton( key: Key('button_mark_as_star_email'), icon: SvgPicture.asset( diff --git a/lib/features/login/presentation/login_view.dart b/lib/features/login/presentation/login_view.dart index 5e4443806..ad8be09b1 100644 --- a/lib/features/login/presentation/login_view.dart +++ b/lib/features/login/presentation/login_view.dart @@ -96,9 +96,9 @@ class LoginView extends GetWidget { ..onChange((value) => loginController.setUrlText(value)) ..textInputAction(TextInputAction.next) ..keyboardType(TextInputType.url) - ..textDecoration(LoginInputDecorationBuilder() - .setLabelText(AppLocalizations.of(context).prefix_https) - .setPrefixText(AppLocalizations.of(context).prefix_https) + ..textDecoration((LoginInputDecorationBuilder() + ..setLabelText(AppLocalizations.of(context).prefix_https) + ..setPrefixText(AppLocalizations.of(context).prefix_https)) .build())) .build())); } @@ -113,9 +113,9 @@ class LoginView extends GetWidget { ..onChange((value) => loginController.setUserNameText(value)) ..textInputAction(TextInputAction.next) ..keyboardType(TextInputType.emailAddress) - ..textDecoration(LoginInputDecorationBuilder() - .setLabelText(AppLocalizations.of(context).email) - .setHintText(AppLocalizations.of(context).email) + ..textDecoration((LoginInputDecorationBuilder() + ..setLabelText(AppLocalizations.of(context).email) + ..setHintText(AppLocalizations.of(context).email)) .build())) .build())); } @@ -130,9 +130,9 @@ class LoginView extends GetWidget { ..obscureText(true) ..onChange((value) => loginController.setPasswordText(value)) ..textInputAction(TextInputAction.done) - ..textDecoration(LoginInputDecorationBuilder() - .setLabelText(AppLocalizations.of(context).password) - .setHintText(AppLocalizations.of(context).password) + ..textDecoration((LoginInputDecorationBuilder() + ..setLabelText(AppLocalizations.of(context).password) + ..setHintText(AppLocalizations.of(context).password)) .build())) .build())); } diff --git a/lib/features/mailbox/presentation/mailbox_controller.dart b/lib/features/mailbox/presentation/mailbox_controller.dart index e2373bcc4..0dd290081 100644 --- a/lib/features/mailbox/presentation/mailbox_controller.dart +++ b/lib/features/mailbox/presentation/mailbox_controller.dart @@ -16,6 +16,7 @@ import 'package:tmail_ui_user/features/mailbox/domain/usecases/refresh_all_mailb import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_node.dart'; import 'package:tmail_ui_user/features/mailbox/presentation/model/mailbox_tree_builder.dart'; import 'package:tmail_ui_user/features/mailbox/presentation/extensions/list_mailbox_node_extension.dart'; +import 'package:tmail_ui_user/features/mailbox_creator/presentation/model/mailbox_creator_arguments.dart'; import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/mailbox_dashboard_controller.dart'; import 'package:tmail_ui_user/features/thread/domain/state/mark_as_multiple_email_read_state.dart'; import 'package:tmail_ui_user/features/thread/domain/state/move_multiple_email_to_mailbox_state.dart'; @@ -36,6 +37,8 @@ class MailboxController extends BaseController { final defaultMailboxList = [].obs; final folderMailboxNodeList = [].obs; + List allMailboxes = []; + jmapState.State? currentMailboxState; MailboxController( @@ -82,6 +85,7 @@ class MailboxController extends BaseController { super.onData(newState); newState.map((success) { if (success is GetAllMailboxSuccess) { + allMailboxes = success.defaultMailboxList + success.folderMailboxList; currentMailboxState = success.currentMailboxState; defaultMailboxList.value = success.defaultMailboxList; _setUpMapMailboxIdDefault(success.defaultMailboxList, success.folderMailboxList); @@ -202,6 +206,13 @@ class MailboxController extends BaseController { await _cachingManager.clearAll(); } + void createNewMailbox() async { + final newMailboxArguments = await push( + AppRoutes.MAILBOX_CREATOR, + arguments: MailboxCreatorArguments(allMailboxes) + ); + } + void closeMailboxScreen() { mailboxDashBoardController.closeDrawer(); } diff --git a/lib/features/mailbox/presentation/mailbox_view.dart b/lib/features/mailbox/presentation/mailbox_view.dart index 02ec432ae..5d91a9921 100644 --- a/lib/features/mailbox/presentation/mailbox_view.dart +++ b/lib/features/mailbox/presentation/mailbox_view.dart @@ -84,7 +84,7 @@ class MailboxView extends GetWidget { padding: EdgeInsets.only(left: 16, right: 16), child: IconButton( key: Key('mailbox_add_new_folder_button'), - onPressed: () => {}, + onPressed: () => controller.createNewMailbox(), icon: SvgPicture.asset(imagePaths.icAddNewFolder, width: 30, height: 30, fit: BoxFit.fill))); } diff --git a/lib/features/mailbox_creator/presentation/mailbox_creator_bindings.dart b/lib/features/mailbox_creator/presentation/mailbox_creator_bindings.dart new file mode 100644 index 000000000..a416a4899 --- /dev/null +++ b/lib/features/mailbox_creator/presentation/mailbox_creator_bindings.dart @@ -0,0 +1,10 @@ +import 'package:get/get.dart'; +import 'package:tmail_ui_user/features/mailbox_creator/presentation/mailbox_creator_controller.dart'; + +class MailboxCreatorBindings extends Bindings { + + @override + void dependencies() { + Get.lazyPut(() => MailboxCreatorController()); + } +} \ No newline at end of file diff --git a/lib/features/mailbox_creator/presentation/mailbox_creator_controller.dart b/lib/features/mailbox_creator/presentation/mailbox_creator_controller.dart new file mode 100644 index 000000000..1fadca7e6 --- /dev/null +++ b/lib/features/mailbox_creator/presentation/mailbox_creator_controller.dart @@ -0,0 +1,44 @@ + +import 'package:core/core.dart'; +import 'package:dartz/dartz.dart'; +import 'package:get/get.dart'; +import 'package:model/model.dart'; +import 'package:tmail_ui_user/features/base/base_controller.dart'; +import 'package:tmail_ui_user/features/mailbox_creator/presentation/model/mailbox_creator_arguments.dart'; +import 'package:tmail_ui_user/main/routes/route_navigation.dart'; +import 'package:tmail_ui_user/main/utils/app_logger.dart'; + +class MailboxCreatorController extends BaseController { + + final selectedMailbox = Rxn(); + + List allMailboxes = []; + + MailboxCreatorController(); + + @override + void onReady() { + super.onReady(); + final arguments = Get.arguments; + if (arguments is MailboxCreatorArguments) { + allMailboxes = arguments.allMailboxes; + log('allMailboxes: $allMailboxes'); + } + } + + @override + void onData(Either newState) { + super.onData(newState); + } + + @override + void onDone() { + } + + @override + void onError(error) {} + + void closeMailboxCreator() { + popBack(); + } +} \ No newline at end of file diff --git a/lib/features/mailbox_creator/presentation/mailbox_creator_view.dart b/lib/features/mailbox_creator/presentation/mailbox_creator_view.dart new file mode 100644 index 000000000..8fda9a0b9 --- /dev/null +++ b/lib/features/mailbox_creator/presentation/mailbox_creator_view.dart @@ -0,0 +1,165 @@ +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/mailbox_creator/presentation/mailbox_creator_controller.dart'; +import 'package:tmail_ui_user/features/mailbox_creator/presentation/widgets/app_bar_mailbox_creator_widget.dart'; +import 'package:tmail_ui_user/features/mailbox_creator/presentation/widgets/create_mailbox_name_input_decoration_builder.dart'; +import 'package:tmail_ui_user/main/localizations/app_localizations.dart'; + +class MailboxCreatorView extends GetWidget { + + final _imagePaths = Get.find(); + final _responsiveUtils = Get.find(); + + @override + Widget build(BuildContext context) { + return Card( + margin: EdgeInsets.zero, + borderOnForeground: false, + color: Colors.transparent, + child: GestureDetector( + onTap: () => controller.closeMailboxCreator(), + child: ResponsiveWidget( + responsiveUtils: _responsiveUtils, + mobile: Container( + child: _buildBody(context), + width: _responsiveUtils.getSizeWidthScreen(context)), + tablet: Container( + child: Row( + children: [ + Expanded(flex: 1, child: _buildBody(context)), + Expanded(flex: 1, child: Container(color: Colors.transparent)), + ] + ) + ), + tabletLarge: Container( + child: Row( + children: [ + Expanded(flex: 7, child: _buildBody(context)), + Expanded(flex: 13, child: Container(color: Colors.transparent)), + ] + ) + ), + desktop: Container( + child: Row( + children: [ + Expanded(flex: 1, child: _buildBody(context)), + Expanded(flex: 3, child: Container(color: Colors.transparent)), + ] + ) + ) + ), + ) + ); + } + + Widget _buildBody(BuildContext context) { + return SafeArea( + top: _responsiveUtils.isMobile(context) ? true : false, + bottom: false, + left: false, + right: false, + child: GestureDetector( + onTap: () => FocusScope.of(context).unfocus(), + child: ClipRRect( + borderRadius: BorderRadius.only( + topRight: Radius.circular(_responsiveUtils.isMobile(context) ? 14 : 0), + topLeft: Radius.circular(_responsiveUtils.isMobile(context) ? 14 : 0)), + child: Drawer( + child: Container( + color: AppColor.colorBgMailbox, + width: double.infinity, + child: SafeArea( + top: false, + bottom: false, + left: _responsiveUtils.isMobileDevice(context) ? true : false, + right: _responsiveUtils.isMobileDevice(context) ? true : false, + child: Column( + children: [ + _buildAppBar(context), + _buildCreateMailboxNameInput(context), + _buildMailboxLocation(context), + ] + ), + ) + ) + ) + ), + ) + ); + } + + Widget _buildAppBar(BuildContext context) { + return Padding( + padding: EdgeInsets.only(top: 10, bottom: 4), + child: (AppBarMailboxCreatorWidget(context) + ..addOnCancelActionClick(() => controller.closeMailboxCreator()) + ..addOnCreateActionClick(() {})) + .build()); + } + + Widget _buildCreateMailboxNameInput(BuildContext context) { + return Padding( + padding: EdgeInsets.symmetric(horizontal: 16, vertical: 14), + child: (TextFieldBuilder() + ..key(Key('create_mailbox_name_input')) + ..onChange((value) => {}) + ..keyboardType(TextInputType.visiblePassword) + ..textDecoration((CreateMailboxNameInputDecorationBuilder()).build())) + .build()); + } + + Widget _buildMailboxLocation(BuildContext context) { + return Column(crossAxisAlignment: CrossAxisAlignment.start, children: [ + Padding( + padding: EdgeInsets.only(left: 16, right: 16, top: 4), + child: Text( + AppLocalizations.of(context).mailbox_location.toUpperCase(), + textAlign: TextAlign.left, + style: TextStyle(fontSize: 13, color: AppColor.colorHintSearchBar)), + ), + Container( + alignment: Alignment.center, + margin: EdgeInsets.symmetric(horizontal: 16, vertical: 8), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(14), + color: Colors.white + ), + child: MediaQuery( + data: MediaQueryData(padding: EdgeInsets.zero), + child: ListTile( + contentPadding: EdgeInsets.zero, + onTap: () => {}, + leading: Padding( + padding: EdgeInsets.only(left: 16), + child: SvgPicture.asset( + _imagePaths.icFolderMailbox, + width: 28, + height: 28, + fit: BoxFit.fill)), + title: Transform( + transform: Matrix4.translationValues(-5.0, 0.0, 0.0), + child: Row(children: [ + Expanded(child: Text( + '${controller.selectedMailbox.value?.name?.name ?? AppLocalizations.of(context).default_mailbox}', + maxLines: 1, + overflow:TextOverflow.ellipsis, + style: TextStyle( + fontSize: 15, + color: controller.selectedMailbox.isBlank == true ? AppColor.colorHintSearchBar : 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: () {} + )) + ), + ) + ) + ]); + } +} \ No newline at end of file diff --git a/lib/features/mailbox_creator/presentation/model/mailbox_creator_arguments.dart b/lib/features/mailbox_creator/presentation/model/mailbox_creator_arguments.dart new file mode 100644 index 000000000..0ea8534be --- /dev/null +++ b/lib/features/mailbox_creator/presentation/model/mailbox_creator_arguments.dart @@ -0,0 +1,12 @@ + +import 'package:equatable/equatable.dart'; +import 'package:model/mailbox/presentation_mailbox.dart'; + +class MailboxCreatorArguments with EquatableMixin{ + final List allMailboxes; + + MailboxCreatorArguments(this.allMailboxes); + + @override + List get props => [allMailboxes]; +} \ No newline at end of file diff --git a/lib/features/mailbox_creator/presentation/model/new_mailbox_arguments.dart b/lib/features/mailbox_creator/presentation/model/new_mailbox_arguments.dart new file mode 100644 index 000000000..457a321a5 --- /dev/null +++ b/lib/features/mailbox_creator/presentation/model/new_mailbox_arguments.dart @@ -0,0 +1,13 @@ + +import 'package:equatable/equatable.dart'; +import 'package:model/mailbox/presentation_mailbox.dart'; + +class NewMailboxArguments with EquatableMixin{ + final String nameMailbox; + final PresentationMailbox mailboxLocation; + + NewMailboxArguments(this.nameMailbox, this.mailboxLocation); + + @override + List get props => [nameMailbox, mailboxLocation]; +} \ No newline at end of file diff --git a/lib/features/mailbox_creator/presentation/widgets/app_bar_mailbox_creator_widget.dart b/lib/features/mailbox_creator/presentation/widgets/app_bar_mailbox_creator_widget.dart new file mode 100644 index 000000000..c678bfc7c --- /dev/null +++ b/lib/features/mailbox_creator/presentation/widgets/app_bar_mailbox_creator_widget.dart @@ -0,0 +1,87 @@ + +import 'package:core/core.dart'; +import 'package:flutter/material.dart'; +import 'package:tmail_ui_user/main/localizations/app_localizations.dart'; + +typedef OnCancelActionClick = void Function(); +typedef OnCreateActionClick = void Function(); + +class AppBarMailboxCreatorWidget { + OnCancelActionClick? _cancelActionClick; + OnCreateActionClick? _createActionClick; + + final BuildContext _context; + final bool isValidated; + + AppBarMailboxCreatorWidget( + this._context, + {this.isValidated = false} + ); + + void addOnCancelActionClick(OnCancelActionClick onCancelActionClick) { + _cancelActionClick = onCancelActionClick; + } + + void addOnCreateActionClick(OnCreateActionClick onCreateActionClick) { + _createActionClick = onCreateActionClick; + } + + Widget build() { + return Container( + key: Key('app_bar_mailbox_creator'), + alignment: Alignment.center, + padding: EdgeInsets.symmetric(vertical: 8, horizontal: 12), + decoration: BoxDecoration( + borderRadius: BorderRadius.only(topLeft: Radius.circular(20), topRight: Radius.circular(20)), + color: AppColor.colorBgMailbox), + child: MediaQuery( + data: MediaQueryData(padding: EdgeInsets.zero), + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + _buildCancelButton(), + Expanded(child: _buildTitle()), + _buildCreateButton() + ] + ) + ) + ); + } + + Widget _buildCancelButton() { + return Material( + borderRadius: BorderRadius.circular(20), + color: Colors.transparent, + child: TextButton( + child: Text( + AppLocalizations.of(_context).cancel, + style: TextStyle(fontSize: 17, color: AppColor.colorTextButton), + ), + onPressed: () => _cancelActionClick?.call() + ) + ); + } + + Widget _buildCreateButton() { + return Material( + borderRadius: BorderRadius.circular(20), + color: Colors.transparent, + child: TextButton( + child: Text( + AppLocalizations.of(_context).done, + style: TextStyle(fontSize: 17, color: isValidated ? AppColor.colorTextButton : AppColor.colorDisableMailboxCreateButton), + ), + onPressed: () => _createActionClick?.call() + ) + ); + } + + Widget _buildTitle() { + return Padding( + padding: EdgeInsets.symmetric(horizontal: 8), + child: Text( + AppLocalizations.of(_context).new_mailbox, + textAlign: TextAlign.center, + style: TextStyle(fontSize: 17, color: AppColor.colorNameEmail, fontWeight: FontWeight.w700))); + } +} \ No newline at end of file diff --git a/lib/features/mailbox_creator/presentation/widgets/create_mailbox_name_input_decoration_builder.dart b/lib/features/mailbox_creator/presentation/widgets/create_mailbox_name_input_decoration_builder.dart new file mode 100644 index 000000000..a55741da5 --- /dev/null +++ b/lib/features/mailbox_creator/presentation/widgets/create_mailbox_name_input_decoration_builder.dart @@ -0,0 +1,33 @@ + +import 'package:core/core.dart'; +import 'package:flutter/material.dart'; + +class CreateMailboxNameInputDecorationBuilder extends InputDecorationBuilder { + + @override + InputDecoration build() { + return InputDecoration( + enabledBorder: enabledBorder ?? OutlineInputBorder( + borderRadius: BorderRadius.all(Radius.circular(10)), + borderSide: BorderSide(width: 1, color: AppColor.colorInputBorderCreateMailbox)), + focusedBorder: enabledBorder ?? OutlineInputBorder( + borderRadius: BorderRadius.all(Radius.circular(10)), + borderSide: BorderSide(width: 1, color: AppColor.colorTextButton)), + errorBorder: errorBorder ?? OutlineInputBorder( + borderRadius: BorderRadius.all(Radius.circular(10)), + borderSide: BorderSide(width: 1, color: AppColor.colorInputBorderErrorVerifyName)), + prefixText: prefixText, + labelText: labelText, + floatingLabelBehavior: FloatingLabelBehavior.never, + labelStyle: labelStyle ?? TextStyle(color: AppColor.colorNameEmail, fontSize: 16), + hintText: hintText, + hintStyle: hintStyle ?? TextStyle(color: AppColor.colorHintInputCreateMailbox, fontSize: 16), + contentPadding: contentPadding ?? EdgeInsets.all(12), + errorText: errorText, + errorStyle: errorTextStyle ?? TextStyle(color: AppColor.colorInputBorderErrorVerifyName, fontSize: 13), + filled: true, + fillColor: errorText?.isNotEmpty == true + ? AppColor.colorInputBackgroundErrorVerifyName + : AppColor.colorInputBackgroundCreateMailbox); + } +} \ No newline at end of file diff --git a/lib/main/localizations/app_localizations.dart b/lib/main/localizations/app_localizations.dart index 12983df9b..c279a7b27 100644 --- a/lib/main/localizations/app_localizations.dart +++ b/lib/main/localizations/app_localizations.dart @@ -585,4 +585,32 @@ class AppLocalizations { name: 'message_has_been_sent_failure', ); } + + String get done { + return Intl.message( + 'Done', + name: 'done' + ); + } + + String get new_mailbox { + return Intl.message( + 'New mailbox', + name: 'new_mailbox', + ); + } + + String get mailbox_location { + return Intl.message( + 'Mailbox location', + name: 'mailbox_location', + ); + } + + String get default_mailbox { + return Intl.message( + 'Default mailbox', + name: 'default_mailbox', + ); + } } \ No newline at end of file diff --git a/lib/main/pages/app_pages.dart b/lib/main/pages/app_pages.dart index 2ff3ab6ad..07e837d25 100644 --- a/lib/main/pages/app_pages.dart +++ b/lib/main/pages/app_pages.dart @@ -9,6 +9,8 @@ import 'package:tmail_ui_user/features/login/presentation/login_bindings.dart'; import 'package:tmail_ui_user/features/login/presentation/login_view.dart'; import 'package:tmail_ui_user/features/email/presentation/email_view.dart'; import 'package:tmail_ui_user/features/mailbox/presentation/mailbox_view.dart'; +import 'package:tmail_ui_user/features/mailbox_creator/presentation/mailbox_creator_bindings.dart'; +import 'package:tmail_ui_user/features/mailbox_creator/presentation/mailbox_creator_view.dart'; import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/mailbox_dashboard_bindings.dart'; import 'package:tmail_ui_user/features/mailbox_dashboard/presentation/mailbox_dashboard_view.dart'; import 'package:tmail_ui_user/features/thread/presentation/thread_view.dart'; @@ -52,5 +54,10 @@ class AppPages { opaque: false, page: () => DestinationPickerView(), binding: DestinationPickerBindings()), + GetPage( + name: AppRoutes.MAILBOX_CREATOR, + opaque: false, + page: () => MailboxCreatorView(), + binding: MailboxCreatorBindings()), ]; } diff --git a/lib/main/routes/app_routes.dart b/lib/main/routes/app_routes.dart index a94653ab0..4b3050db5 100644 --- a/lib/main/routes/app_routes.dart +++ b/lib/main/routes/app_routes.dart @@ -8,4 +8,5 @@ abstract class AppRoutes { static const SESSION = '/session'; static const COMPOSER = '/composer'; static const DESTINATION_PICKER = '/destinationPicker'; + static const MAILBOX_CREATOR = '/mailboxCreator'; } \ No newline at end of file