Merge pull request #919 from pangeachat/audio-message-overlay

fixes audio message overlay warping

lib/pangea/widgets/chat/message_selection_overlay.dart

@@ -73,6 +73,8 @@ class MessageOverlayController extends State<MessageSelectionOverlay>
   final TtsController tts = TtsController();
   bool isPlayingAudio = false;
 
+  bool get showToolbarButtons => !widget._pangeaMessageEvent.isAudioMessage;
+
   @override
   void initState() {
     super.initState();
@@ -281,9 +283,10 @@ class MessageOverlayController extends State<MessageSelectionOverlay>
     return reactionsEvents.where((e) => !e.redacted).isNotEmpty;
   }
 
+  double get toolbarButtonsHeight =>
+      showToolbarButtons ? AppConfig.toolbarButtonsHeight : 0;
   double get reactionsHeight => hasReactions ? 28 : 0;
-  double get belowMessageHeight =>
-      AppConfig.toolbarButtonsHeight + reactionsHeight;
+  double get belowMessageHeight => toolbarButtonsHeight + reactionsHeight;
 
   void setIsPlayingAudio(bool isPlaying) {
     if (mounted) {

lib/pangea/widgets/chat/message_toolbar_buttons.dart

@@ -40,7 +40,7 @@ class ToolbarButtons extends StatelessWidget {
         overlayController.isPracticeComplete || !messageInUserL2;
     final double barWidth = width - iconWidth;
 
-    if (overlayController.pangeaMessageEvent.isAudioMessage) {
+    if (!overlayController.showToolbarButtons) {
       return const SizedBox();
     }
 

lib/pangea/widgets/chat/overlay_message.dart

@@ -82,6 +82,17 @@ class OverlayMessage extends StatelessWidget {
           : theme.colorScheme.primary;
     }
 
+    final noBubble = {
+          MessageTypes.Video,
+          MessageTypes.Image,
+          MessageTypes.Sticker,
+        }.contains(pangeaMessageEvent.event.messageType) &&
+        !pangeaMessageEvent.event.redacted;
+    final noPadding = {
+      MessageTypes.File,
+      MessageTypes.Audio,
+    }.contains(pangeaMessageEvent.event.messageType);
+
     return Material(
       color: color,
       clipBehavior: Clip.antiAlias,
@@ -95,10 +106,12 @@ class OverlayMessage extends StatelessWidget {
               AppConfig.borderRadius,
             ),
           ),
-          padding: const EdgeInsets.symmetric(
-            horizontal: 16,
-            vertical: 8,
-          ),
+          padding: noBubble || noPadding
+              ? EdgeInsets.zero
+              : const EdgeInsets.symmetric(
+                  horizontal: 16,
+                  vertical: 8,
+                ),
           width: messageWidth,
           height: messageHeight,
           child: MessageContent(