TF-2179 Add MobileAppBarThread widget/style

(cherry picked from commit 2c66cbf2063471ecea7452ba5d5956de769a3b26)
2023-09-29 09:21:32 +07:00
parent 119f5826c9
commit 7ffcf1366a
2 changed files with 135 additions and 0 deletions
@@ -0,0 +1,30 @@
+
+import 'package:core/presentation/extensions/color_extension.dart';
+import 'package:flutter/material.dart';
+import 'package:tmail_ui_user/features/thread/domain/model/filter_message_option.dart';
+
+class MobileAppBarThreadWidgetStyle {
+  static const double buttonMaxWidth = 80;
+  static const double titleOffset = 180;
+  static const double minHeight = 56;
+
+  static const Color backgroundColor = Colors.white;
+  static const Color backButtonColor = AppColor.primaryColor;
+
+  static const EdgeInsetsGeometry padding = EdgeInsets.symmetric(vertical: 8, horizontal: 16);
+
+  static const TextStyle editButtonStyle = TextStyle(
+    fontSize: 17,
+    color: AppColor.primaryColor
+  );
+  static const TextStyle emailCounterTitleStyle = TextStyle(
+    fontSize: 17,
+    color: AppColor.primaryColor
+  );
+
+  static Color getFilterButtonColor(FilterMessageOption option) {
+    return option == FilterMessageOption.all
+      ? AppColor.colorFilterMessageDisabled
+      : AppColor.colorFilterMessageEnabled;
+  }
+}
@@ -0,0 +1,105 @@
+
+import 'package:core/presentation/resources/image_paths.dart';
+import 'package:core/presentation/views/button/tmail_button_widget.dart';
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+import 'package:model/email/presentation_email.dart';
+import 'package:model/mailbox/presentation_mailbox.dart';
+import 'package:model/mailbox/select_mode.dart';
+import 'package:tmail_ui_user/features/thread/domain/model/filter_message_option.dart';
+import 'package:tmail_ui_user/features/thread/presentation/styles/app_bar/mobile_app_bar_thread_widget_style.dart';
+import 'package:tmail_ui_user/features/thread/presentation/widgets/app_bar/app_bar_thread_widget.dart';
+import 'package:tmail_ui_user/features/thread/presentation/widgets/app_bar/title_app_bar_thread_widget.dart';
+import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
+
+class MobileAppBarThreadWidget extends StatelessWidget {
+  final _imagePaths = Get.find<ImagePaths>();
+
+  final PresentationMailbox? mailboxSelected;
+  final List<PresentationEmail> listEmailSelected;
+  final SelectMode selectMode;
+  final FilterMessageOption filterOption;
+  final OnOpenMailboxMenuActionClick openMailboxAction;
+  final OnEditThreadAction editThreadAction;
+  final OnPopupMenuFilterEmailAction? onPopupMenuFilterEmailAction;
+  final OnContextMenuFilterEmailAction? onContextMenuFilterEmailAction;
+  final OnCancelEditThreadAction cancelEditThreadAction;
+
+  MobileAppBarThreadWidget({
+    super.key,
+    required this.listEmailSelected,
+    required this.mailboxSelected,
+    required this.selectMode,
+    required this.filterOption,
+    required this.openMailboxAction,
+    required this.editThreadAction,
+    required this.cancelEditThreadAction,
+    this.onPopupMenuFilterEmailAction,
+    this.onContextMenuFilterEmailAction,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return LayoutBuilder(builder: (context, constraints) {
+      return Container(
+        color: MobileAppBarThreadWidgetStyle.backgroundColor,
+        padding: MobileAppBarThreadWidgetStyle.padding,
+        constraints: const BoxConstraints(minHeight: MobileAppBarThreadWidgetStyle.minHeight),
+        child: Stack(
+          alignment: AlignmentDirectional.center,
+          children: [
+            if (selectMode == SelectMode.INACTIVE)
+              PositionedDirectional(
+                start: 0,
+                child: TMailButtonWidget.fromText(
+                  key: const Key('selection_thread_button'),
+                  text: AppLocalizations.of(context).edit,
+                  textStyle: MobileAppBarThreadWidgetStyle.editButtonStyle,
+                  backgroundColor: Colors.transparent,
+                  maxWidth: MobileAppBarThreadWidgetStyle.buttonMaxWidth,
+                  maxLines: 1,
+                  tooltipMessage: AppLocalizations.of(context).edit,
+                  onTapActionCallback: editThreadAction,
+                ),
+              )
+            else
+              PositionedDirectional(
+                start: 0,
+                child: TMailButtonWidget(
+                  key: const Key('cancel_selection_thread_button'),
+                  text: '${listEmailSelected.length}',
+                  icon: _imagePaths.icBack,
+                  iconColor: MobileAppBarThreadWidgetStyle.backButtonColor,
+                  textStyle: MobileAppBarThreadWidgetStyle.emailCounterTitleStyle,
+                  backgroundColor: Colors.transparent,
+                  onTapActionCallback: cancelEditThreadAction,
+                ),
+              ),
+            Center(
+              child: TitleAppBarThreadWidget(
+                key: const Key('title_app_bar_thread'),
+                mailboxSelected: mailboxSelected,
+                filterOption: filterOption,
+                maxWidth: constraints.maxWidth - MobileAppBarThreadWidgetStyle.titleOffset,
+                openMailboxAction: openMailboxAction,
+              ),
+            ),
+            PositionedDirectional(
+              end: 0,
+              child: TMailButtonWidget.fromIcon(
+                key: const Key('filter_message_button'),
+                icon: _imagePaths.icFilter,
+                iconColor: MobileAppBarThreadWidgetStyle.getFilterButtonColor(filterOption),
+                backgroundColor: Colors.transparent,
+                maxWidth: MobileAppBarThreadWidgetStyle.buttonMaxWidth,
+                tooltipMessage: AppLocalizations.of(context).filter_messages,
+                onTapActionCallback: () => onContextMenuFilterEmailAction?.call(filterOption),
+                onTapActionAtPositionCallback: (position) => onPopupMenuFilterEmailAction?.call(filterOption, position),
+              ),
+            ),
+          ]
+        ),
+      );
+    });
+  }
+}