From be42203febbe8b0e2aa24c4e1ceb1ffbaee1c930 Mon Sep 17 00:00:00 2001
From: ggurdin <46800240+ggurdin@users.noreply.github.com>
Date: Wed, 23 Jul 2025 14:01:19 -0400
Subject: [PATCH] chore: position message overlay relative to bottom of the
 screen instead of the top (#3544)

---
 .../widgets/message_selection_positioner.dart | 27 ++++++++++++------
 .../toolbar/widgets/over_message_overlay.dart | 28 +++++++++++++------
 2 files changed, 37 insertions(+), 18 deletions(-)

diff --git a/lib/pangea/toolbar/widgets/message_selection_positioner.dart b/lib/pangea/toolbar/widgets/message_selection_positioner.dart
index fba0314dd..ab3ec0448 100644
--- a/lib/pangea/toolbar/widgets/message_selection_positioner.dart
+++ b/lib/pangea/toolbar/widgets/message_selection_positioner.dart
@@ -267,7 +267,7 @@ class MessageSelectionPositionerState extends State<MessageSelectionPositioner>
     return messageHeight + reactionsHeight + AppConfig.toolbarMenuHeight + 4.0;
   }
 
-  double get _overheadContentHeight {
+  double get overheadContentHeight {
     return (widget.pangeaMessageEvent != null &&
                 widget.overlayController.selectedToken != null
             ? AppConfig.toolbarMaxHeight
@@ -287,7 +287,7 @@ class MessageSelectionPositionerState extends State<MessageSelectionPositioner>
   }
 
   double get _fullContentHeight {
-    return _contentHeight + _overheadContentHeight;
+    return _contentHeight + overheadContentHeight;
   }
 
   double? get _screenHeight {
@@ -308,15 +308,24 @@ class MessageSelectionPositionerState extends State<MessageSelectionPositioner>
     return bottomOffset > _screenHeight!;
   }
 
-  double get spaceAboveContent {
-    if (shouldScroll) return _overheadContentHeight;
-    if (_hasFooterOverflow) {
-      return _screenHeight! - _fullContentHeight;
+  double get spaceBelowContent {
+    if (shouldScroll) return 0;
+    if (_hasFooterOverflow) return 0;
+
+    final messageHeight = originalMessageSize.height;
+    final originalContentHeight =
+        messageHeight + reactionsHeight + AppConfig.toolbarMenuHeight + 4.0;
+
+    final screenHeight = mediaQuery!.size.height - mediaQuery!.padding.bottom;
+
+    final boxHeight =
+        screenHeight - _originalMessageOffset.dy - originalContentHeight;
+
+    if (boxHeight + _fullContentHeight > screenHeight) {
+      return screenHeight - _fullContentHeight;
     }
 
-    return _originalMessageOffset.dy -
-        mediaQuery!.padding.top -
-        _overheadContentHeight;
+    return screenHeight - _originalMessageOffset.dy - originalContentHeight;
   }
 
   void _onContentSizeChanged(_) {
diff --git a/lib/pangea/toolbar/widgets/over_message_overlay.dart b/lib/pangea/toolbar/widgets/over_message_overlay.dart
index f500d4e6c..f61152096 100644
--- a/lib/pangea/toolbar/widgets/over_message_overlay.dart
+++ b/lib/pangea/toolbar/widgets/over_message_overlay.dart
@@ -17,7 +17,8 @@ class OverMessageOverlay extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Align(
-      alignment: controller.ownMessage ? Alignment.topRight : Alignment.topLeft,
+      alignment:
+          controller.ownMessage ? Alignment.bottomRight : Alignment.bottomLeft,
       child: Padding(
         padding: EdgeInsets.only(
           left: controller.messageLeftOffset ?? 0.0,
@@ -33,17 +34,14 @@ class OverMessageOverlay extends StatelessWidget {
                   : CrossAxisAlignment.start,
               mainAxisSize: MainAxisSize.min,
               children: [
-                AnimatedContainer(
-                  duration: FluffyThemes.animationDuration,
-                  height: max(0, controller.spaceAboveContent),
-                  width: controller.mediaQuery!.size.width -
-                      controller.columnWidth -
-                      (controller.showDetails ? FluffyThemes.columnWidth : 0),
-                ),
                 if (!controller.shouldScroll) ...[
                   WordCardSwitcher(controller: controller),
                   const SizedBox(height: 4.0),
-                ],
+                ] else
+                  AnimatedContainer(
+                    duration: FluffyThemes.animationDuration,
+                    height: controller.overheadContentHeight,
+                  ),
                 CompositedTransformTarget(
                   link: MatrixState.pAnyState
                       .layerLinkAndKey(
@@ -79,6 +77,18 @@ class OverMessageOverlay extends StatelessWidget {
                     ReadingAssistanceMode.practiceMode,
                   ),
                 ),
+                AnimatedContainer(
+                  duration: FluffyThemes.animationDuration,
+                  height: max(0, controller.spaceBelowContent),
+                  width: controller.mediaQuery!.size.width -
+                      controller.columnWidth -
+                      (controller.showDetails ? FluffyThemes.columnWidth : 0),
+                  decoration: BoxDecoration(
+                    border: Border.all(
+                      color: Colors.green,
+                    ),
+                  ),
+                ),
               ],
             ),
           ),