From 28a79a0b762c8e48b128e77a84f09c86c5158f98 Mon Sep 17 00:00:00 2001 From: dab246 Date: Thu, 6 Apr 2023 22:45:38 +0700 Subject: [PATCH] TF-1694 Upgrade `dropdown_button2` to version `2.0.0` (cherry picked from commit 84694b719bcd94a90282146bdc1c173c0e3fbd7e) --- .../base/widget/drop_down_button_widget.dart | 53 ++-- .../composer/presentation/composer_view.dart | 23 +- .../presentation/composer_view_web.dart | 23 +- .../drop_down_menu_header_style_widget.dart | 30 +- .../presentation/identity_creator_view.dart | 271 ++++++++---------- .../identity_drop_list_field_builder.dart | 80 +++--- .../identity_field_no_editable_builder.dart | 59 ++-- .../widgets/identity_input_field_builder.dart | 22 +- ...ty_input_with_drop_list_field_builder.dart | 76 +++-- .../date_drop_down_button.dart | 47 +-- pubspec.lock | 6 +- pubspec.yaml | 4 +- 12 files changed, 363 insertions(+), 331 deletions(-) diff --git a/lib/features/base/widget/drop_down_button_widget.dart b/lib/features/base/widget/drop_down_button_widget.dart index f0efffaad..84e94078f 100644 --- a/lib/features/base/widget/drop_down_button_widget.dart +++ b/lib/features/base/widget/drop_down_button_widget.dart @@ -130,33 +130,40 @@ class DropDownButtonWidget extends StatelessWidget { ) : null, onChanged: onChanged, - icon: iconArrowDown ?? SvgPicture.asset(imagePaths.icDropDown), - buttonPadding: const EdgeInsets.symmetric(horizontal: 12), - buttonDecoration: BoxDecoration( - borderRadius: BorderRadius.circular(radiusButton), - border: Border.all( - color: AppColor.colorInputBorderCreateMailbox, - width: 1, + buttonStyleData: ButtonStyleData( + height: heightItem, + padding: const EdgeInsets.symmetric(horizontal: 12), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(radiusButton), + border: Border.all( + color: AppColor.colorInputBorderCreateMailbox, + width: 1, + ), + color: colorButton, + ) + ), + dropdownStyleData: DropdownStyleData( + maxHeight: dropdownMaxHeight ?? 200, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(radiusButton), + color: Colors.white, + ), + width: dropdownWidth, + elevation: 4, + offset: const Offset(0.0, -8.0), + scrollbarTheme: ScrollbarThemeData( + radius: const Radius.circular(40), + thickness: MaterialStateProperty.all(6), + thumbVisibility: MaterialStateProperty.all(true), ), - color: colorButton, ), - itemHeight: heightItem, - buttonHeight: heightItem, - selectedItemHighlightColor: supportSelectionIcon - ? Colors.white - : Colors.black12, - itemPadding: const EdgeInsets.symmetric(horizontal: 12), - dropdownMaxHeight: dropdownMaxHeight ?? 200, - dropdownDecoration: BoxDecoration( - borderRadius: BorderRadius.circular(radiusButton), - color: Colors.white, + iconStyleData: IconStyleData(icon: iconArrowDown ?? SvgPicture.asset(imagePaths.icDropDown)), + menuItemStyleData: MenuItemStyleData( + height: heightItem, + padding: const EdgeInsets.symmetric(horizontal: 12), + overlayColor: MaterialStateProperty.resolveWith((Set states) => supportSelectionIcon ? Colors.white : Colors.black12) ), - offset: const Offset(0.0, -8.0), - dropdownElevation: 4, - scrollbarRadius: const Radius.circular(40), - scrollbarThickness: 6, onMenuStateChange: onMenuStateChange, - dropdownWidth: dropdownWidth, ), ), ); diff --git a/lib/features/composer/presentation/composer_view.dart b/lib/features/composer/presentation/composer_view.dart index ddf649232..771791bf7 100644 --- a/lib/features/composer/presentation/composer_view.dart +++ b/lib/features/composer/presentation/composer_view.dart @@ -314,16 +314,23 @@ class ComposerView extends GetWidget ), )).toList(), onChanged: (newIdentity) => controller.selectIdentity(newIdentity), - itemPadding: const EdgeInsets.symmetric(horizontal: 8), - itemHeight: 55, - dropdownMaxHeight: 240, - dropdownWidth: 300, - dropdownDecoration: BoxDecoration( + dropdownStyleData: DropdownStyleData( + maxHeight: 240, + width: 300, + decoration: BoxDecoration( borderRadius: BorderRadius.circular(20), color: Colors.white), - dropdownElevation: 4, - scrollbarRadius: const Radius.circular(40), - scrollbarThickness: 6, + elevation: 4, + scrollbarTheme: ScrollbarThemeData( + radius: const Radius.circular(40), + thickness: MaterialStateProperty.all(6), + thumbVisibility: MaterialStateProperty.all(true), + ), + ), + menuItemStyleData: const MenuItemStyleData( + height: 55, + padding: EdgeInsets.symmetric(horizontal: 8), + ) ), ), Expanded(child: Padding( diff --git a/lib/features/composer/presentation/composer_view_web.dart b/lib/features/composer/presentation/composer_view_web.dart index 759a6c03a..d55994b52 100644 --- a/lib/features/composer/presentation/composer_view_web.dart +++ b/lib/features/composer/presentation/composer_view_web.dart @@ -504,16 +504,23 @@ class ComposerView extends GetWidget ), )).toList(), onChanged: (newIdentity) => controller.selectIdentity(newIdentity), - itemPadding: const EdgeInsets.symmetric(horizontal: 8), - itemHeight: 55, - dropdownMaxHeight: 240, - dropdownWidth: 370, - dropdownDecoration: BoxDecoration( + dropdownStyleData: DropdownStyleData( + maxHeight: 240, + width: 370, + decoration: BoxDecoration( borderRadius: BorderRadius.circular(20), color: Colors.white), - dropdownElevation: 4, - scrollbarRadius: const Radius.circular(40), - scrollbarThickness: 6, + elevation: 4, + scrollbarTheme: ScrollbarThemeData( + radius: const Radius.circular(40), + thickness: MaterialStateProperty.all(6), + thumbVisibility: MaterialStateProperty.all(true), + ), + ), + menuItemStyleData: const MenuItemStyleData( + height: 55, + padding: EdgeInsets.symmetric(horizontal: 8), + ) ), ), Expanded(child: Padding( diff --git a/lib/features/composer/presentation/widgets/drop_down_menu_header_style_widget.dart b/lib/features/composer/presentation/widgets/drop_down_menu_header_style_widget.dart index 06052a4af..ae79b42c0 100644 --- a/lib/features/composer/presentation/widgets/drop_down_menu_header_style_widget.dart +++ b/lib/features/composer/presentation/widgets/drop_down_menu_header_style_widget.dart @@ -47,19 +47,25 @@ class DropDownMenuHeaderStyleWidget extends StatelessWidget { customButton: icon, onChanged: onChanged, onMenuStateChange: onMenuStateChange, - itemHeight: heightItem, - buttonHeight: heightItem, - itemPadding: const EdgeInsets.symmetric(horizontal: 12), - dropdownWidth: dropdownWidth, - dropdownMaxHeight: 200, - dropdownDecoration: BoxDecoration( - borderRadius: BorderRadius.circular(5), - color: Colors.white, + buttonStyleData: ButtonStyleData(height: heightItem), + dropdownStyleData: DropdownStyleData( + maxHeight: 200, + width: dropdownWidth, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(5), + color: Colors.white), + elevation: 4, + offset: const Offset(0.0, -8.0), + scrollbarTheme: ScrollbarThemeData( + radius: const Radius.circular(40), + thickness: MaterialStateProperty.all(6), + thumbVisibility: MaterialStateProperty.all(true), + ) ), - offset: const Offset(0.0, -8.0), - dropdownElevation: 4, - scrollbarRadius: const Radius.circular(40), - scrollbarThickness: 6, + menuItemStyleData: MenuItemStyleData( + height: heightItem, + padding: const EdgeInsets.symmetric(horizontal: 12) + ) ), ), ); diff --git a/lib/features/identity_creator/presentation/identity_creator_view.dart b/lib/features/identity_creator/presentation/identity_creator_view.dart index 10a3dd1a2..2ed947a61 100644 --- a/lib/features/identity_creator/presentation/identity_creator_view.dart +++ b/lib/features/identity_creator/presentation/identity_creator_view.dart @@ -1,6 +1,14 @@ -import 'dart:math'; +import 'dart:math' as math; -import 'package:core/core.dart'; +import 'package:core/presentation/extensions/capitalize_extension.dart'; +import 'package:core/presentation/extensions/color_extension.dart'; +import 'package:core/presentation/resources/image_paths.dart'; +import 'package:core/presentation/utils/html_transformer/html_template.dart'; +import 'package:core/presentation/utils/responsive_utils.dart'; +import 'package:core/presentation/views/button/icon_button_web.dart'; +import 'package:core/presentation/views/responsive/responsive_widget.dart'; +import 'package:core/utils/app_logger.dart'; +import 'package:core/utils/build_utils.dart'; import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:get/get.dart'; @@ -177,7 +185,7 @@ class IdentityCreatorView extends GetWidget { decoration: const BoxDecoration( color: Colors.white, borderRadius: BorderRadius.all(Radius.circular(16))), - width: max(_responsiveUtils.getSizeScreenWidth(context) * 0.4, 650), + width: math.max(_responsiveUtils.getSizeScreenWidth(context) * 0.4, 650), height: _responsiveUtils.getSizeScreenHeight(context) * 0.75, child: ClipRRect( borderRadius: const BorderRadius.all(Radius.circular(16)), @@ -197,64 +205,58 @@ class IdentityCreatorView extends GetWidget { child: Padding( padding: const EdgeInsets.all(24.0), child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [ - Obx(() => (IdentityInputFieldBuilder( + Obx(() => IdentityInputFieldBuilder( AppLocalizations.of(context).name, controller.errorNameIdentity.value, - AppLocalizations.of(context).required, + AppLocalizations.of(context).required, editingController: controller.inputNameIdentityController, focusNode: controller.inputNameIdentityFocusNode, - isMandatory: true) - ..addOnChangeInputNameAction((value) => controller.updateNameIdentity(context, value))) - .build()), + isMandatory: true, + onChangeInputNameAction: (value) => controller.updateNameIdentity(context, value) + )), const SizedBox(height: 24), Obx(() { if (controller.actionType.value == IdentityActionType.create) { - return (IdentityDropListFieldBuilder( - _imagePaths, - AppLocalizations.of(context).email.inCaps, - controller.emailOfIdentity.value, - controller.listEmailAddressDefault) - ..addOnSelectEmailAddressDropListAction((emailAddress) => - controller.updateEmailOfIdentity(emailAddress)) - ).build(); + return IdentityDropListFieldBuilder( + _imagePaths, + AppLocalizations.of(context).email.inCaps, + controller.emailOfIdentity.value, + controller.listEmailAddressDefault, + onSelectItemDropList: controller.updateEmailOfIdentity); } else { return IdentityFieldNoEditableBuilder( - AppLocalizations.of(context).email.inCaps, - controller.emailOfIdentity.value - ).build(); + AppLocalizations.of(context).email.inCaps, + controller.emailOfIdentity.value); } }), const SizedBox(height: 24), - Obx(() => (IdentityDropListFieldBuilder( - _imagePaths, - AppLocalizations.of(context).reply_to, - controller.replyToOfIdentity.value, - controller.listEmailAddressOfReplyTo) - ..addOnSelectEmailAddressDropListAction((newEmailAddress) => - controller.updaterReplyToOfIdentity(newEmailAddress))) - .build()), + Obx(() => IdentityDropListFieldBuilder( + _imagePaths, + AppLocalizations.of(context).reply_to, + controller.replyToOfIdentity.value, + controller.listEmailAddressOfReplyTo, + onSelectItemDropList: controller.updaterReplyToOfIdentity + )), const SizedBox(height: 24), - Obx(() => (IdentityInputWithDropListFieldBuilder( - AppLocalizations.of(context).bcc_to, - controller.errorBccIdentity.value, - controller.inputBccIdentityController, - focusNode: controller.inputBccIdentityFocusNode) - ..addOnSelectedSuggestionAction((newEmailAddress) { + Obx(() => IdentityInputWithDropListFieldBuilder( + AppLocalizations.of(context).bcc_to, + controller.errorBccIdentity.value, + controller.inputBccIdentityController, + focusNode: controller.inputBccIdentityFocusNode, + onSelectedSuggestionAction: (newEmailAddress) { controller.inputBccIdentityController?.text = newEmailAddress?.email ?? ''; controller.updateBccOfIdentity(newEmailAddress); - }) - ..addOnChangeInputSuggestionAction((pattern) { + }, + onChangeInputSuggestionAction: (pattern) { controller.validateInputBccAddress(context, pattern); if (pattern == null || pattern.trim().isEmpty) { controller.updateBccOfIdentity(null); } else { controller.updateBccOfIdentity(EmailAddress(null, pattern)); } - }) - ..addOnSuggestionCallbackAction((pattern) => - controller.getSuggestionEmailAddress(pattern))) - .build() - ), + }, + onSuggestionCallbackAction: controller.getSuggestionEmailAddress + )), const SizedBox(height: 32), Text(AppLocalizations.of(context).signature, style: const TextStyle( @@ -271,78 +273,10 @@ class IdentityCreatorView extends GetWidget { ), child: _buildSignatureHtmlTemplate(context), ), - if (_responsiveUtils.isTablet(context) || _responsiveUtils.isMobile(context))...[ - Obx(() { - if (controller.isDefaultIdentitySupported.isTrue) { - return Padding( - padding: const EdgeInsets.only(top: 27), - child: SetDefaultIdentityCheckboxBuilder( - imagePaths: _imagePaths, - isCheck: controller.isDefaultIdentity.value, - onCheckboxChanged: controller.onCheckboxChanged - ) - ); - } else { - return const SizedBox.shrink(); - } - }), - const SizedBox(height: 24), - Container( - alignment: Alignment.center, - color: Colors.white, - child: Row( - children: [ - Expanded( - child: buildTextButton( - AppLocalizations.of(context).cancel, - textStyle: const TextStyle( - fontWeight: FontWeight.w500, - fontSize: 17, - color: AppColor.colorTextButton, - ), - backgroundColor: AppColor.emailAddressChipColor, - width: 128, - height: 44, - radius: 10, - onTap: () => controller.closeView(context), - ), - ), - const SizedBox(width: 12), - Expanded( - child: Obx(() => controller.viewState.value.fold( - (failure) => buildTextButton( - controller.actionType.value == IdentityActionType.create - ? AppLocalizations.of(context).create - : AppLocalizations.of(context).save, - width: 128, - height: 44, - radius: 10, - onTap: () => controller.createNewIdentity(context)), - (success) { - if (success is GetAllIdentitiesLoading) { - return const Center( - key: Key('create_loading_icon'), - child: CircularProgressIndicator(color: AppColor.primaryColor)); - } else { - return buildTextButton( - controller.actionType.value == IdentityActionType.create - ? AppLocalizations.of(context).create - : AppLocalizations.of(context).save, - width: 128, - height: 44, - radius: 10, - onTap: () => controller.createNewIdentity(context)); - } - } - )), - ), - ] - ), - ), - const SizedBox(height: 35), - ] else ...[ - _buildActionBottomDesktop(context) - ] + if (_isMobile(context)) + _buildActionButtonMobile(context) + else + _buildActionButtonDesktop(context) ]), ), ); @@ -478,20 +412,10 @@ class IdentityCreatorView extends GetWidget { ); } - Widget _buildActionBottomDesktop(BuildContext context) { + Widget _buildActionButtonDesktop(BuildContext context) { return Row( children: [ - Obx(() { - if (controller.isDefaultIdentitySupported.isTrue) { - return SetDefaultIdentityCheckboxBuilder( - imagePaths: _imagePaths, - isCheck: controller.isDefaultIdentity.value, - onCheckboxChanged: controller.onCheckboxChanged - ); - } else { - return const SizedBox.shrink(); - } - }), + _buildCheckboxIdentityDefault(context), Expanded( child: Padding( padding: EdgeInsets.only( @@ -508,28 +432,9 @@ class IdentityCreatorView extends GetWidget { right: AppUtils.isDirectionRTL(context) ? 0 : 12, left: AppUtils.isDirectionRTL(context) ? 12 : 0 ), - child: buildTextButton( - AppLocalizations.of(context).cancel, - textStyle: const TextStyle( - fontWeight: FontWeight.w500, - fontSize: 17, - color: AppColor.colorTextButton, - ), - backgroundColor: AppColor.emailAddressChipColor, - width: 156, - height: 44, - radius: 10, - onTap: () => controller.closeView(context), - ), + child: _buildCancelButton(context, width: 156), ), - buildTextButton( - controller.actionType.value == IdentityActionType.create - ? AppLocalizations.of(context).create - : AppLocalizations.of(context).save, - width: 156, - height: 44, - radius: 10, - onTap: () => controller.createNewIdentity(context)), + _buildSaveButton(context, width: 156), ], ), ), @@ -537,4 +442,80 @@ class IdentityCreatorView extends GetWidget { ], ); } + + Widget _buildActionButtonMobile(BuildContext context) { + return Column(children: [ + _buildCheckboxIdentityDefault(context), + Container( + alignment: Alignment.center, + color: Colors.white, + padding: const EdgeInsets.only(top: 24, bottom: 35), + child: Row(children: [ + Expanded(child: _buildCancelButton(context)), + const SizedBox(width: 12), + Expanded(child: _buildSaveButton(context)) + ]), + ) + ]); + } + + Widget _buildCheckboxIdentityDefault(BuildContext context) { + return Obx(() { + if (controller.isDefaultIdentitySupported.isTrue) { + return SetDefaultIdentityCheckboxBuilder( + imagePaths: _imagePaths, + isCheck: controller.isDefaultIdentity.value, + onCheckboxChanged: controller.onCheckboxChanged); + } else { + return const SizedBox.shrink(); + } + }); + } + + Widget _buildCancelButton(BuildContext context, {double? width}) { + return buildTextButton( + AppLocalizations.of(context).cancel, + textStyle: const TextStyle( + fontWeight: FontWeight.w500, + fontSize: 17, + color: AppColor.colorTextButton, + ), + backgroundColor: AppColor.emailAddressChipColor, + width: width ?? 128, + height: 44, + radius: 10, + onTap: () => controller.closeView(context), + ); + } + + Widget _buildSaveButton(BuildContext context, {double? width}) { + return Obx(() => controller.viewState.value.fold( + (failure) => buildTextButton( + controller.actionType.value == IdentityActionType.create + ? AppLocalizations.of(context).create + : AppLocalizations.of(context).save, + width: width ?? 128, + height: 44, + radius: 10, + onTap: () => controller.createNewIdentity(context)), + (success) { + if (success is GetAllIdentitiesLoading) { + return const Center( + key: Key('create_loading_icon'), + child: CircularProgressIndicator(color: AppColor.primaryColor)); + } else { + return buildTextButton( + controller.actionType.value == IdentityActionType.create + ? AppLocalizations.of(context).create + : AppLocalizations.of(context).save, + width: width ?? 128, + height: 44, + radius: 10, + onTap: () => controller.createNewIdentity(context)); + } + } + )); + } + + bool _isMobile(BuildContext context) => _responsiveUtils.isPortraitMobile(context) || _responsiveUtils.isLandscapeMobile(context); } \ No newline at end of file diff --git a/lib/features/identity_creator/presentation/widgets/identity_drop_list_field_builder.dart b/lib/features/identity_creator/presentation/widgets/identity_drop_list_field_builder.dart index 0464a8dd3..eecc334b9 100644 --- a/lib/features/identity_creator/presentation/widgets/identity_drop_list_field_builder.dart +++ b/lib/features/identity_creator/presentation/widgets/identity_drop_list_field_builder.dart @@ -1,47 +1,50 @@ -import 'package:core/core.dart'; +import 'package:core/presentation/extensions/color_extension.dart'; +import 'package:core/presentation/resources/image_paths.dart'; +import 'package:core/presentation/utils/style_utils.dart'; import 'package:dropdown_button2/dropdown_button2.dart'; import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:jmap_dart_client/jmap/mail/email/email_address.dart'; +import 'package:model/extensions/email_address_extension.dart'; typedef OnSelectEmailAddressDropListAction = Function(EmailAddress? emailAddress); -class IdentityDropListFieldBuilder { +class IdentityDropListFieldBuilder extends StatelessWidget { final ImagePaths _imagePaths; final String _label; final EmailAddress? _emailAddressSelected; final List _listEmailAddress; + final OnSelectEmailAddressDropListAction? onSelectItemDropList; - OnSelectEmailAddressDropListAction? onSelectItemDropList; - - IdentityDropListFieldBuilder( + const IdentityDropListFieldBuilder( this._imagePaths, this._label, this._emailAddressSelected, - this._listEmailAddress, - ); + this._listEmailAddress, { + super.key, + this.onSelectItemDropList + }); - void addOnSelectEmailAddressDropListAction(OnSelectEmailAddressDropListAction action) { - onSelectItemDropList = action; - } - - Widget build() { + @override + Widget build(BuildContext context) { return Column(crossAxisAlignment: CrossAxisAlignment.start, children: [ - Text(_label, style: const TextStyle( - fontSize: 14, - fontWeight: FontWeight.normal, - color: AppColor.colorContentEmail)), + Text( + _label, + style: const TextStyle( + fontSize: 14, + fontWeight: FontWeight.normal, + color: AppColor.colorContentEmail)), const SizedBox(height: 8), DropdownButtonHideUnderline( child: DropdownButton2( isExpanded: true, hint: Row( - children: [ + children: const [ Expanded(child: Text( - _emailAddressSelected?.email ?? '', - style: const TextStyle(fontSize: 16, fontWeight: FontWeight.normal, color: Colors.black), + '', + style: TextStyle(fontSize: 16, fontWeight: FontWeight.normal, color: Colors.black), maxLines: 1, overflow: CommonTextStyle.defaultTextOverFlow, softWrap: CommonTextStyle.defaultSoftWrap, @@ -51,7 +54,7 @@ class IdentityDropListFieldBuilder { items: _listEmailAddress.map((item) => DropdownMenuItem( value: item, child: Text( - item.email ?? '', + item.emailAddress, style: const TextStyle(fontSize: 16, fontWeight: FontWeight.normal, color: Colors.black), maxLines: 1, overflow: CommonTextStyle.defaultTextOverFlow, @@ -59,24 +62,35 @@ class IdentityDropListFieldBuilder { ), )).toList(), value: _emailAddressSelected, - onChanged: (newEmailAddress) => onSelectItemDropList?.call(newEmailAddress), - icon: SvgPicture.asset(_imagePaths.icDropDown), - buttonPadding: const EdgeInsets.symmetric(horizontal: 12), - buttonDecoration: BoxDecoration( + onChanged: onSelectItemDropList, + buttonStyleData: ButtonStyleData( + height: 44, + padding: const EdgeInsets.only(right: 8), + decoration: BoxDecoration( borderRadius: BorderRadius.circular(10), border: Border.all(color: AppColor.colorInputBorderCreateMailbox, width: 0.5), color: AppColor.colorInputBackgroundCreateMailbox), - itemHeight: 44, - buttonHeight: 44, - selectedItemHighlightColor: Colors.black12, - itemPadding: const EdgeInsets.symmetric(horizontal: 12), - dropdownMaxHeight: 200, - dropdownDecoration: BoxDecoration( + ), + dropdownStyleData: DropdownStyleData( + maxHeight: 200, + decoration: BoxDecoration( borderRadius: BorderRadius.circular(10), color: Colors.white), - dropdownElevation: 4, - scrollbarRadius: const Radius.circular(40), - scrollbarThickness: 6, + elevation: 4, + scrollbarTheme: ScrollbarThemeData( + radius: const Radius.circular(40), + thickness: MaterialStateProperty.all(6), + thumbVisibility: MaterialStateProperty.all(true), + ), + ), + iconStyleData: IconStyleData( + icon: SvgPicture.asset(_imagePaths.icDropDown), + iconSize: 14, + ), + menuItemStyleData: const MenuItemStyleData( + height: 44, + padding: EdgeInsets.symmetric(horizontal: 12), + ), ), ) ]); diff --git a/lib/features/identity_creator/presentation/widgets/identity_field_no_editable_builder.dart b/lib/features/identity_creator/presentation/widgets/identity_field_no_editable_builder.dart index 9bd004f05..7feac9e2d 100644 --- a/lib/features/identity_creator/presentation/widgets/identity_field_no_editable_builder.dart +++ b/lib/features/identity_creator/presentation/widgets/identity_field_no_editable_builder.dart @@ -1,40 +1,49 @@ -import 'package:core/core.dart'; +import 'package:core/presentation/extensions/color_extension.dart'; +import 'package:core/presentation/utils/style_utils.dart'; import 'package:flutter/material.dart'; import 'package:jmap_dart_client/jmap/mail/email/email_address.dart'; -class IdentityFieldNoEditableBuilder { +class IdentityFieldNoEditableBuilder extends StatelessWidget { final String _label; final EmailAddress? _emailAddressSelected; - IdentityFieldNoEditableBuilder(this._label, this._emailAddressSelected); + const IdentityFieldNoEditableBuilder( + this._label, + this._emailAddressSelected, + {super.key} + ); - Widget build() { + @override + Widget build(BuildContext context) { return Column(crossAxisAlignment: CrossAxisAlignment.start, children: [ - Text(_label, style: const TextStyle( - fontSize: 14, - fontWeight: FontWeight.normal, - color: AppColor.colorContentEmail)), + Text( + _label, + style: const TextStyle( + fontSize: 14, + fontWeight: FontWeight.normal, + color: AppColor.colorContentEmail)), const SizedBox(height: 8), Container( - height: 44, - alignment: Alignment.centerLeft, - width: double.infinity, - padding: const EdgeInsets.symmetric(horizontal: 12), - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(10), - border: Border.all(color: AppColor.colorInputBorderCreateMailbox, width: 0.5), - color: AppColor.colorInputBackgroundCreateMailbox), - child: Text( - _emailAddressSelected?.email ?? '', - style: const TextStyle( - fontSize: 16, - fontWeight: FontWeight.normal, - color: AppColor.colorInputBorderCreateMailbox), - maxLines: 1, - overflow: BuildUtils.isWeb ? null : TextOverflow.ellipsis, - ) + height: 44, + alignment: Alignment.centerLeft, + width: double.infinity, + padding: const EdgeInsets.symmetric(horizontal: 12), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(10), + border: Border.all(color: AppColor.colorInputBorderCreateMailbox, width: 0.5), + color: AppColor.colorInputBackgroundCreateMailbox), + child: Text( + _emailAddressSelected?.email ?? '', + style: const TextStyle( + fontSize: 16, + fontWeight: FontWeight.normal, + color: AppColor.colorInputBorderCreateMailbox), + maxLines: 1, + overflow: CommonTextStyle.defaultTextOverFlow, + softWrap: CommonTextStyle.defaultSoftWrap + ) ), ]); } diff --git a/lib/features/identity_creator/presentation/widgets/identity_input_field_builder.dart b/lib/features/identity_creator/presentation/widgets/identity_input_field_builder.dart index 873045cf3..db313e9c7 100644 --- a/lib/features/identity_creator/presentation/widgets/identity_input_field_builder.dart +++ b/lib/features/identity_creator/presentation/widgets/identity_input_field_builder.dart @@ -1,11 +1,13 @@ -import 'package:core/core.dart'; +import 'package:core/presentation/extensions/color_extension.dart'; +import 'package:core/presentation/views/text/text_field_builder.dart'; +import 'package:core/utils/build_utils.dart'; import 'package:flutter/material.dart'; import 'package:tmail_ui_user/features/identity_creator/presentation/widgets/identity_input_decoration_builder.dart'; typedef OnChangeInputNameAction = Function(String? value); -class IdentityInputFieldBuilder { +class IdentityInputFieldBuilder extends StatelessWidget { final String _label; final String? _error; @@ -14,24 +16,22 @@ class IdentityInputFieldBuilder { final FocusNode? focusNode; final TextInputType? inputType; final bool isMandatory; + final OnChangeInputNameAction? onChangeInputNameAction; - OnChangeInputNameAction? onChangeInputNameAction; - - IdentityInputFieldBuilder( + const IdentityInputFieldBuilder( this._label, this._error, this.requiredIndicator, { + super.key, this.isMandatory = false, this.editingController, this.focusNode, - this.inputType + this.inputType, + this.onChangeInputNameAction }); - void addOnChangeInputNameAction(OnChangeInputNameAction action) { - onChangeInputNameAction = action; - } - - Widget build() { + @override + Widget build(BuildContext context) { return Column(crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( isMandatory diff --git a/lib/features/identity_creator/presentation/widgets/identity_input_with_drop_list_field_builder.dart b/lib/features/identity_creator/presentation/widgets/identity_input_with_drop_list_field_builder.dart index a0abbe175..e44e81ea1 100644 --- a/lib/features/identity_creator/presentation/widgets/identity_input_with_drop_list_field_builder.dart +++ b/lib/features/identity_creator/presentation/widgets/identity_input_with_drop_list_field_builder.dart @@ -9,44 +9,36 @@ typedef OnSelectedSuggestionAction = Function(EmailAddress? emailAddress); typedef OnSuggestionCallbackAction = Function(String? pattern); typedef OnChangeInputSuggestionAction = Function(String? pattern); -class IdentityInputWithDropListFieldBuilder { +class IdentityInputWithDropListFieldBuilder extends StatelessWidget { final String _label; final String? _error; final TextEditingController? editingController; final FocusNode? focusNode; + final OnSelectedSuggestionAction? onSelectedSuggestionAction; + final OnSuggestionCallbackAction? onSuggestionCallbackAction; + final OnChangeInputSuggestionAction? onChangeInputSuggestionAction; - OnSelectedSuggestionAction? _onSelectedSuggestionAction; - OnSuggestionCallbackAction? _onSuggestionCallbackAction; - OnChangeInputSuggestionAction? _onChangeInputSuggestionAction; - - IdentityInputWithDropListFieldBuilder( + const IdentityInputWithDropListFieldBuilder( this._label, this._error, - this.editingController, - { - this.focusNode, - } - ); + this.editingController, { + super.key, + this.focusNode, + this.onSelectedSuggestionAction, + this.onSuggestionCallbackAction, + this.onChangeInputSuggestionAction, + }); - void addOnSelectedSuggestionAction(OnSelectedSuggestionAction action) { - _onSelectedSuggestionAction = action; - } - - void addOnSuggestionCallbackAction(OnSuggestionCallbackAction action) { - _onSuggestionCallbackAction = action; - } - - void addOnChangeInputSuggestionAction(OnChangeInputSuggestionAction action) { - _onChangeInputSuggestionAction = action; - } - - Widget build() { + @override + Widget build(BuildContext context) { return Column(crossAxisAlignment: CrossAxisAlignment.start, children: [ - Text(_label, style: const TextStyle( - fontSize: 14, - fontWeight: FontWeight.normal, - color: AppColor.colorContentEmail)), + Text( + _label, + style: const TextStyle( + fontSize: 14, + fontWeight: FontWeight.normal, + color: AppColor.colorContentEmail)), const SizedBox(height: 8), TypeAheadFormField( textFieldConfiguration: TextFieldConfiguration( @@ -55,18 +47,18 @@ class IdentityInputWithDropListFieldBuilder { textInputAction: TextInputAction.done, decoration: (IdentityInputDecorationBuilder() ..setContentPadding(const EdgeInsets.symmetric( - vertical: BuildUtils.isWeb ? 16 : 12, - horizontal: 12)) + vertical: BuildUtils.isWeb ? 16 : 12, + horizontal: 12)) ..setErrorText(_error)) - .build() + .build() ), debounceDuration: const Duration(milliseconds: 500), suggestionsCallback: (pattern) async { - if (_onChangeInputSuggestionAction != null) { - _onChangeInputSuggestionAction!(pattern); + if (onChangeInputSuggestionAction != null) { + onChangeInputSuggestionAction!(pattern); } - if (_onSuggestionCallbackAction != null) { - return _onSuggestionCallbackAction!(pattern); + if (onSuggestionCallbackAction != null) { + return onSuggestionCallbackAction!(pattern); } else { return []; } @@ -74,16 +66,16 @@ class IdentityInputWithDropListFieldBuilder { itemBuilder: (BuildContext context, emailAddress) { return Padding( padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14), - child: Text(emailAddress.email ?? '', + child: Text( + emailAddress.email ?? '', style: const TextStyle( - fontSize: 14, - fontWeight: FontWeight.normal, - color: Colors.black)), - ); + fontSize: 14, + fontWeight: FontWeight.normal, + color: Colors.black))); }, onSuggestionSelected: (emailSelected) { - if (_onSelectedSuggestionAction != null) { - _onSelectedSuggestionAction!(emailSelected); + if (onSelectedSuggestionAction != null) { + onSelectedSuggestionAction!(emailSelected); } }, suggestionsBoxDecoration: SuggestionsBoxDecoration( diff --git a/lib/features/mailbox_dashboard/presentation/widgets/advanced_search/date_drop_down_button.dart b/lib/features/mailbox_dashboard/presentation/widgets/advanced_search/date_drop_down_button.dart index f711b23e8..6dfde2fa2 100644 --- a/lib/features/mailbox_dashboard/presentation/widgets/advanced_search/date_drop_down_button.dart +++ b/lib/features/mailbox_dashboard/presentation/widgets/advanced_search/date_drop_down_button.dart @@ -65,29 +65,36 @@ class DateDropDownButton extends StatelessWidget { onReceiveTimeSelected?.call(value); } }, - icon: SvgPicture.asset(imagePaths.icDropDown), - buttonPadding: const EdgeInsets.symmetric(horizontal: 12), - buttonDecoration: BoxDecoration( - borderRadius: BorderRadius.circular(10), - border: Border.all( - color: AppColor.colorInputBorderCreateMailbox, - width: 1, + buttonStyleData: ButtonStyleData( + height: 44, + padding: const EdgeInsets.symmetric(horizontal: 12), + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(10), + border: Border.all( + color: AppColor.colorInputBorderCreateMailbox, + width: 1), + color: AppColor.colorInputBackgroundCreateMailbox) + ), + dropdownStyleData: DropdownStyleData( + maxHeight: 200, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(10), + color: Colors.white), + elevation: 4, + offset: const Offset(0.0, -8.0), + scrollbarTheme: ScrollbarThemeData( + radius: const Radius.circular(40), + thickness: MaterialStateProperty.all(6), + thumbVisibility: MaterialStateProperty.all(true), ), - color: AppColor.colorInputBackgroundCreateMailbox, ), - itemHeight: 44, - buttonHeight: 44, - selectedItemHighlightColor: Colors.white, - itemPadding: const EdgeInsets.symmetric(horizontal: 12), - dropdownMaxHeight: 200, - dropdownDecoration: BoxDecoration( - borderRadius: BorderRadius.circular(10), - color: Colors.white, + iconStyleData: IconStyleData( + icon: SvgPicture.asset(imagePaths.icDropDown), ), - offset: const Offset(0.0, -8.0), - dropdownElevation: 4, - scrollbarRadius: const Radius.circular(40), - scrollbarThickness: 6 + menuItemStyleData: const MenuItemStyleData( + height: 44, + padding: EdgeInsets.symmetric(horizontal: 12), + ) ), ), ); diff --git a/pubspec.lock b/pubspec.lock index 87bb90f00..3f36a4c13 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -356,10 +356,10 @@ packages: dependency: "direct main" description: name: dropdown_button2 - sha256: "604b87283e251e0e4a0cb1d0fdfa91fd527702b06e80999c4054cecc603e10e7" + sha256: "4458d81bfd24207f3d58f66f78097064e02f810f94cf1bc80bf20fe7685ebc80" url: "https://pub.dev" source: hosted - version: "1.9.4" + version: "2.0.0" enough_html_editor: dependency: transitive description: @@ -616,7 +616,7 @@ packages: source: hosted version: "1.1.0" flutter_keyboard_visibility: - dependency: transitive + dependency: "direct main" description: name: flutter_keyboard_visibility sha256: "86b71bbaffa38e885f5c21b1182408b9be6951fd125432cf6652c636254cef2d" diff --git a/pubspec.yaml b/pubspec.yaml index f9ef36c47..aed3fdd76 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -141,7 +141,7 @@ dependencies: package_info_plus: 3.0.3 - dropdown_button2: 1.9.4 + dropdown_button2: 2.0.0 flutter_staggered_grid_view: 0.6.2 @@ -195,6 +195,8 @@ dependencies: super_tag_editor: 0.1.1 + flutter_keyboard_visibility: 5.4.0 + dev_dependencies: flutter_test: sdk: flutter