From 2d11627d0483123126e10ab40e54f754e131b8ba Mon Sep 17 00:00:00 2001
From: avashilling <165050625+avashilling@users.noreply.github.com>
Date: Thu, 31 Jul 2025 13:31:20 -0400
Subject: [PATCH] fix: row 2 of reactions add normally (#3598)

and loading symbol is always placed at the very end, not the end of the first row
---
 .../chat/events/pangea_message_reactions.dart | 74 +++++++++----------
 1 file changed, 34 insertions(+), 40 deletions(-)

diff --git a/lib/pages/chat/events/pangea_message_reactions.dart b/lib/pages/chat/events/pangea_message_reactions.dart
index 1e723fe6a..4e98bb569 100644
--- a/lib/pages/chat/events/pangea_message_reactions.dart
+++ b/lib/pages/chat/events/pangea_message_reactions.dart
@@ -120,49 +120,43 @@ class _PangeaMessageReactionsState extends State<PangeaMessageReactions> {
         .aggregatedEvents(widget.timeline, RelationshipTypes.reaction)
         .toList();
 
-    return AnimatedSize(
-      duration: FluffyThemes.animationDuration,
-      curve: FluffyThemes.animationCurve,
-      alignment: ownMessage ? Alignment.bottomRight : Alignment.bottomLeft,
-      clipBehavior: Clip.none,
-      child: Wrap(
-        crossAxisAlignment: WrapCrossAlignment.center,
-        runSpacing: 4.0,
-        alignment: ownMessage ? WrapAlignment.end : WrapAlignment.start,
-        children: [
-          if (allReactionEvents.any((e) => e.status.isSending) && ownMessage)
-            const SizedBox(
-              width: 24,
-              height: 24,
-              child: Padding(
-                padding: EdgeInsets.all(4.0),
-                child: CircularProgressIndicator.adaptive(strokeWidth: 1),
+    return Directionality(
+      textDirection: ownMessage ? TextDirection.rtl : TextDirection.ltr,
+      child: AnimatedSize(
+        duration: FluffyThemes.animationDuration,
+        curve: FluffyThemes.animationCurve,
+        alignment: ownMessage ? Alignment.bottomRight : Alignment.bottomLeft,
+        clipBehavior: Clip.none,
+        child: Wrap(
+          crossAxisAlignment: WrapCrossAlignment.center,
+          runSpacing: 4.0,
+          alignment: WrapAlignment.start,
+          children: [
+            ...reactionList.map(
+              (r) => _Reaction(
+                key: ValueKey(r.key),
+                firstReact: _newlyAddedReactions.contains(r.key),
+                reactionKey: r.key,
+                count: r.count,
+                reacted: r.reacted,
+                onTap: () => _handleReactionTap(r, allReactionEvents),
+                onLongPress: () async => await _AdaptableReactorsDialog(
+                  client: client,
+                  reactionEntry: r,
+                ).show(context),
               ),
             ),
-          ...reactionList.map(
-            (r) => _Reaction(
-              key: ValueKey(r.key),
-              firstReact: _newlyAddedReactions.contains(r.key),
-              reactionKey: r.key,
-              count: r.count,
-              reacted: r.reacted,
-              onTap: () => _handleReactionTap(r, allReactionEvents),
-              onLongPress: () async => await _AdaptableReactorsDialog(
-                client: client,
-                reactionEntry: r,
-              ).show(context),
-            ),
-          ),
-          if (allReactionEvents.any((e) => e.status.isSending) && !ownMessage)
-            const SizedBox(
-              width: 24,
-              height: 24,
-              child: Padding(
-                padding: EdgeInsets.all(4.0),
-                child: CircularProgressIndicator.adaptive(strokeWidth: 1),
+            if (allReactionEvents.any((e) => e.status.isSending))
+              const SizedBox(
+                width: 24,
+                height: 24,
+                child: Padding(
+                  padding: EdgeInsets.all(4.0),
+                  child: CircularProgressIndicator.adaptive(strokeWidth: 1),
+                ),
               ),
-            ),
-        ],
+          ],
+        ),
       ),
     );
   }