From cd2f43c00c36bf9929602d40ab9a2d1eb40c0926 Mon Sep 17 00:00:00 2001
From: avashilling <165050625+avashilling@users.noreply.github.com>
Date: Tue, 14 Oct 2025 14:18:04 -0400
Subject: [PATCH] add XP animation on match activity tokens (#4373)

---
 lib/pages/chat/events/html_message.dart       | 62 +++++++++++--------
 .../practice_activity_model.dart              |  2 +-
 2 files changed, 37 insertions(+), 27 deletions(-)

diff --git a/lib/pages/chat/events/html_message.dart b/lib/pages/chat/events/html_message.dart
index 1e273b3d5..33ba9f4b6 100644
--- a/lib/pages/chat/events/html_message.dart
+++ b/lib/pages/chat/events/html_message.dart
@@ -23,6 +23,7 @@ import 'package:fluffychat/pangea/toolbar/widgets/select_mode_buttons.dart';
 import 'package:fluffychat/utils/event_checkbox_extension.dart';
 import 'package:fluffychat/widgets/avatar.dart';
 import 'package:fluffychat/widgets/future_loading_dialog.dart';
+import 'package:fluffychat/widgets/matrix.dart';
 import 'package:fluffychat/widgets/mxc_image.dart';
 import '../../../utils/url_launcher.dart';
 
@@ -468,35 +469,44 @@ class HtmlMessage extends StatelessWidget {
                       animateIn: isTransitionAnimation,
                       textColor: textColor,
                     ),
-                  MouseRegion(
-                    cursor: SystemMouseCursors.click,
-                    child: GestureDetector(
-                      behavior: HitTestBehavior.translucent,
-                      onTap: onClick != null && token != null
-                          ? () => onClick?.call(token)
-                          : null,
-                      child: RichText(
-                        textDirection: pangeaMessageEvent?.textDirection,
-                        text: TextSpan(
-                          children: [
-                            LinkifySpan(
-                              text: node.text.trim(),
-                              style: renderer.style(
-                                context,
-                                color: renderer.backgroundColor(
+                  CompositedTransformTarget(
+                    link: token != null
+                        ? MatrixState.pAnyState
+                            .layerLinkAndKey(
+                              "message-token-${token.text.uniqueKey}-${event.eventId}",
+                            )
+                            .link
+                        : LayerLink(),
+                    child: MouseRegion(
+                      cursor: SystemMouseCursors.click,
+                      child: GestureDetector(
+                        behavior: HitTestBehavior.translucent,
+                        onTap: onClick != null && token != null
+                            ? () => onClick?.call(token)
+                            : null,
+                        child: RichText(
+                          textDirection: pangeaMessageEvent?.textDirection,
+                          text: TextSpan(
+                            children: [
+                              LinkifySpan(
+                                text: node.text.trim(),
+                                style: renderer.style(
                                   context,
-                                  selected,
-                                  highlighted,
-                                  isNew,
-                                  readingAssistanceMode ==
-                                      ReadingAssistanceMode.practiceMode,
+                                  color: renderer.backgroundColor(
+                                    context,
+                                    selected,
+                                    highlighted,
+                                    isNew,
+                                    readingAssistanceMode ==
+                                        ReadingAssistanceMode.practiceMode,
+                                  ),
                                 ),
+                                linkStyle: linkStyle,
+                                onOpen: (url) =>
+                                    UrlLauncher(context, url.url).launchUrl(),
                               ),
-                              linkStyle: linkStyle,
-                              onOpen: (url) =>
-                                  UrlLauncher(context, url.url).launchUrl(),
-                            ),
-                          ],
+                            ],
+                          ),
                         ),
                       ),
                     ),
diff --git a/lib/pangea/practice_activities/practice_activity_model.dart b/lib/pangea/practice_activities/practice_activity_model.dart
index 2b39d3a21..5844f60f9 100644
--- a/lib/pangea/practice_activities/practice_activity_model.dart
+++ b/lib/pangea/practice_activities/practice_activity_model.dart
@@ -205,7 +205,7 @@ class PracticeActivityModel {
               xp: constructUseType.pointValue,
             ),
           ],
-          targetID: token.text.uniqueKey,
+          targetID: "message-token-${token.text.uniqueKey}-${event?.eventId}",
         ),
       );
     }