From badb2888f233636c107be2d4d429bcd63682c320 Mon Sep 17 00:00:00 2001 From: Kelrap Date: Thu, 1 Aug 2024 13:31:32 -0400 Subject: [PATCH] message info/report message menu work with overlay --- lib/pages/chat/chat.dart | 22 +++- lib/pangea/utils/overlay.dart | 21 +++- lib/pangea/widgets/chat/overlay_header.dart | 110 ++++++++++++++------ 3 files changed, 117 insertions(+), 36 deletions(-) diff --git a/lib/pages/chat/chat.dart b/lib/pages/chat/chat.dart index c4abcbac2..b26ba605b 100644 --- a/lib/pages/chat/chat.dart +++ b/lib/pages/chat/chat.dart @@ -115,6 +115,7 @@ class ChatController extends State late Choreographer choreographer = Choreographer(pangeaController, this); // Pangea# + Room get room => sendingClient.getRoomById(roomId) ?? widget.room; late Client sendingClient; @@ -896,7 +897,14 @@ class ChatController extends State } void reportEventAction() async { + // #Pangea + MatrixState.pAnyState.closeOverlay(); + MatrixState.pAnyState.closeOverlay(); + // Pangea# final event = selectedEvents.single; + // #Pangea + clearSelectedEvents(); + // Pangea# final score = await showConfirmationDialog( context: context, title: L10n.of(context)!.reportMessage, @@ -1476,8 +1484,18 @@ class ChatController extends State bool get isArchived => {Membership.leave, Membership.ban}.contains(room.membership); - void showEventInfo([Event? event]) => - (event ?? selectedEvents.single).showInfoDialog(context); + void showEventInfo([Event? event]) + // #Pangea + // => + { + MatrixState.pAnyState.closeOverlay(); + MatrixState.pAnyState.closeOverlay(); + // Pangea# + (event ?? selectedEvents.single).showInfoDialog(context); + // #Pangea + clearSelectedEvents(); + // Pangea# + } void onPhoneButtonTap() async { // VoIP required Android SDK 21 diff --git a/lib/pangea/utils/overlay.dart b/lib/pangea/utils/overlay.dart index 4add2e80a..cf1cd881e 100644 --- a/lib/pangea/utils/overlay.dart +++ b/lib/pangea/utils/overlay.dart @@ -28,13 +28,12 @@ class OverlayUtil { bool closePrevOverlay = true, bool targetScreen = false, Function? onDismiss, + bool centered = true, }) { try { if (closePrevOverlay) { MatrixState.pAnyState.closeOverlay(); } - final LayerLinkAndKey layerLinkAndKey = - MatrixState.pAnyState.layerLinkAndKey(transformTargetId); final OverlayEntry entry = OverlayEntry( builder: (context) => AnimatedContainer( @@ -48,14 +47,28 @@ class OverlayUtil { onDismiss: onDismiss, ), Positioned( + top: (targetScreen && !centered) + ? FluffyThemes.isColumnMode(context) + ? 20 + : 65 + : null, + right: (targetScreen && !centered) + ? FluffyThemes.isColumnMode(context) + ? 20 + : 15 + : null, width: width, height: height, child: targetScreen - ? Center(child: child) + ? centered + ? Center(child: child) + : child : CompositedTransformFollower( targetAnchor: targetAnchor ?? Alignment.topLeft, followerAnchor: followerAnchor ?? Alignment.topLeft, - link: layerLinkAndKey.link, + link: MatrixState.pAnyState + .layerLinkAndKey(transformTargetId) + .link, showWhenUnlinked: false, offset: offset ?? Offset.zero, child: child, diff --git a/lib/pangea/widgets/chat/overlay_header.dart b/lib/pangea/widgets/chat/overlay_header.dart index cc90f218b..d8c04b47c 100644 --- a/lib/pangea/widgets/chat/overlay_header.dart +++ b/lib/pangea/widgets/chat/overlay_header.dart @@ -1,5 +1,6 @@ import 'package:fluffychat/pages/chat/chat.dart'; import 'package:fluffychat/pages/chat/chat_app_bar_title.dart'; +import 'package:fluffychat/pangea/utils/overlay.dart'; import 'package:flutter/material.dart'; import 'package:flutter_gen/gen_l10n/l10n.dart'; import 'package:matrix/matrix.dart'; @@ -67,21 +68,67 @@ class OverlayHeader extends StatelessWidget { tooltip: L10n.of(context)!.redactMessage, onPressed: controller.redactEventsAction, ), - PopupMenuButton<_EventContextAction>( - onSelected: (action) { - switch (action) { - case _EventContextAction.info: - controller.showEventInfo(); - controller.clearSelectedEvents(); - break; - case _EventContextAction.report: - controller.reportEventAction(); - break; - } - }, - itemBuilder: (context) => [ - PopupMenuItem( - value: _EventContextAction.info, + IconButton( + padding: const EdgeInsets.only(bottom: 6), + icon: Icon( + Icons.more_horiz, + color: Theme.of(context).colorScheme.onSurface, + ), + onPressed: () => showPopup(context), + ), + ], + ); + } + + void showPopup(BuildContext context) { + OverlayUtil.showOverlay( + context: context, + child: SelectionPopup(controller: controller), + transformTargetId: "", + targetAnchor: Alignment.center, + followerAnchor: Alignment.center, + backgroundColor: Colors.transparent, + closePrevOverlay: false, + targetScreen: true, + onDismiss: closeToolbar, + centered: false, + ); + } +} + +class SelectionPopup extends StatelessWidget { + ChatController controller; + + SelectionPopup({ + required this.controller, + super.key, + }); + + @override + Widget build(BuildContext context) { + return Material( + type: MaterialType.transparency, + child: Container( + // padding: const EdgeInsets.all(5), + decoration: BoxDecoration( + color: Theme.of(context).colorScheme.surfaceContainer, + border: Border.all( + width: 3, + color: Theme.of(context).colorScheme.surfaceContainerHighest, + ), + borderRadius: const BorderRadius.all( + Radius.circular(20), + ), + ), + constraints: const BoxConstraints( + maxWidth: 200, + maxHeight: 200, + ), + child: Column( + mainAxisSize: MainAxisSize.min, + children: [ + TextButton( + onPressed: controller.showEventInfo, child: Row( mainAxisSize: MainAxisSize.min, children: [ @@ -91,24 +138,27 @@ class OverlayHeader extends StatelessWidget { ], ), ), - if (selectedEvent.status.isSent) - PopupMenuItem( - value: _EventContextAction.report, - child: Row( - mainAxisSize: MainAxisSize.min, - children: [ - const Icon( - Icons.shield_outlined, - color: Colors.red, - ), - const SizedBox(width: 12), - Text(L10n.of(context)!.reportMessage), - ], - ), + Divider( + color: Theme.of(context).colorScheme.surfaceContainerHighest, + height: 5, + ), + TextButton( + onPressed: controller.reportEventAction, + child: Row( + mainAxisSize: MainAxisSize.min, + children: [ + const Icon( + Icons.shield_outlined, + color: Colors.red, + ), + const SizedBox(width: 12), + Text(L10n.of(context)!.reportMessage), + ], ), + ), ], ), - ], + ), ); } }