TF-3766 Change context menu style for mailbox on mobile

Signed-off-by: dab246 <tdvu@linagora.com>
2025-06-12 13:26:23 +07:00
parent 1378d40596
commit 0775a58fef
13 changed files with 370 additions and 249 deletions
@@ -0,0 +1,59 @@
+
+import 'package:core/presentation/extensions/color_extension.dart';
+import 'package:core/presentation/utils/theme_utils.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:tmail_ui_user/features/base/widget/context_menu/context_menu_item_action.dart';
+
+class ContextMenuDialogItem extends StatelessWidget {
+  final ContextMenuItemAction menuAction;
+  final OnContextMenuActionClick onContextMenuActionClick;
+
+  const ContextMenuDialogItem({
+    super.key,
+    required this.menuAction,
+    required this.onContextMenuActionClick,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Material(
+      type: MaterialType.transparency,
+      child: InkWell(
+        onTap: () => menuAction.onClick(onContextMenuActionClick),
+        child: SizedBox(
+          height: 48,
+          child: Row(
+            children: [
+              Padding(
+                padding: const EdgeInsets.symmetric(horizontal: 24),
+                child: Container(
+                  height: 32,
+                  width: 32,
+                  alignment: Alignment.center,
+                  child: SvgPicture.asset(
+                    menuAction.actionIcon,
+                    width: 20,
+                    height: 20,
+                    colorFilter: menuAction.actionIconColor.asFilter(),
+                    fit: BoxFit.fill,
+                  ),
+                ),
+              ),
+              Expanded(
+                child: Text(
+                  menuAction.actionName,
+                  style: ThemeUtils.textStyleInter400.copyWith(
+                    color: menuAction.actionNameColor,
+                  ),
+                  maxLines: 1,
+                  overflow: TextOverflow.ellipsis,
+                ),
+              ),
+            ],
+          ),
+        ),
+      ),
+    );
+  }
+}
@@ -0,0 +1,27 @@
+import 'package:flutter/material.dart';
+import 'package:tmail_ui_user/features/base/widget/context_menu/context_menu_dialog_item.dart';
+import 'package:tmail_ui_user/features/base/widget/context_menu/context_menu_item_action.dart';
+
+class ContextMenuDialogView extends StatelessWidget {
+  final List<ContextMenuItemAction> actions;
+  final OnContextMenuActionClick onContextMenuActionClick;
+
+  const ContextMenuDialogView({
+    super.key,
+    required this.actions,
+    required this.onContextMenuActionClick,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return SingleChildScrollView(
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        children: actions.map((menuAction) => ContextMenuDialogItem(
+          menuAction: menuAction,
+          onContextMenuActionClick: onContextMenuActionClick,
+        )).toList(),
+      ),
+    );
+  }
+}
@@ -0,0 +1,24 @@
+import 'package:core/presentation/extensions/color_extension.dart';
+import 'package:equatable/equatable.dart';
+import 'package:flutter/material.dart';
+
+typedef OnContextMenuActionClick = void Function(ContextMenuItemAction action);
+
+abstract class ContextMenuItemAction<T> with EquatableMixin {
+  final T action;
+
+  ContextMenuItemAction(this.action);
+
+  @override
+  List<Object?> get props => [action];
+
+  String get actionIcon;
+
+  Color get actionIconColor => AppColor.gray424244.withOpacity(0.72);
+
+  String get actionName;
+
+  Color get actionNameColor => AppColor.gray424244.withOpacity(0.9);
+
+  void onClick(OnContextMenuActionClick callback) => callback(this);
+}
@@ -1,19 +0,0 @@
-
-import 'package:equatable/equatable.dart';
-
-abstract class ContextMenuItemAction<T> with EquatableMixin {
-  final T action;
-  final ContextMenuItemState state;
-
-  ContextMenuItemAction(this.action, this.state);
-
-  @override
-  List<Object?> get props => [action, state];
-
-  bool get isActivated => state == ContextMenuItemState.activated;
-}
-
-enum ContextMenuItemState {
-  activated,
-  deactivated
-}