Merge pull request #3318 from pangeachat/3313-punctuation-vertical-misalignment

chore: fix vertical misalignment of non-token text

lib/pages/chat/events/html_message.dart

@@ -15,7 +15,6 @@ import 'package:fluffychat/pangea/common/utils/any_state_holder.dart';
 import 'package:fluffychat/pangea/events/event_wrappers/pangea_message_event.dart';
 import 'package:fluffychat/pangea/events/models/pangea_token_model.dart';
 import 'package:fluffychat/pangea/message_token_text/message_token_button.dart';
-import 'package:fluffychat/pangea/toolbar/enums/message_mode_enum.dart';
 import 'package:fluffychat/pangea/toolbar/enums/reading_assistance_mode_enum.dart';
 import 'package:fluffychat/pangea/toolbar/utils/token_rendering_util.dart';
 import 'package:fluffychat/pangea/toolbar/widgets/message_selection_overlay.dart';
@@ -395,6 +394,9 @@ class HtmlMessage extends StatelessWidget {
         );
 
         return WidgetSpan(
+          alignment: readingAssistanceMode == ReadingAssistanceMode.practiceMode
+              ? PlaceholderAlignment.bottom
+              : PlaceholderAlignment.middle,
           child: CompositedTransformTarget(
             link: token != null && renderer.assignTokenKey
                 ? MatrixState.pAnyState
@@ -421,18 +423,6 @@ class HtmlMessage extends StatelessWidget {
                     ),
                     width: tokenWidth,
                     animateIn: isTransitionAnimation,
-                    practiceTargetForToken:
-                        overlayController?.toolbarMode.associatedActivityType !=
-                                null
-                            ? overlayController?.practiceSelection
-                                ?.activities(
-                                  overlayController!
-                                      .toolbarMode.associatedActivityType!,
-                                )
-                                .firstWhereOrNull(
-                                  (a) => a.tokens.contains(token),
-                                )
-                            : null,
                   ),
                 MouseRegion(
                   cursor: SystemMouseCursors.click,

lib/pangea/message_token_text/message_token_button.dart

@@ -31,7 +31,6 @@ class MessageTokenButton extends StatefulWidget {
   final TextStyle textStyle;
   final double width;
   final bool animateIn;
-  final PracticeTarget? practiceTargetForToken;
 
   const MessageTokenButton({
     super.key,
@@ -39,7 +38,6 @@ class MessageTokenButton extends StatefulWidget {
     required this.token,
     required this.textStyle,
     required this.width,
-    required this.practiceTargetForToken,
     this.animateIn = false,
   });
 
@@ -124,9 +122,10 @@ class MessageTokenButtonState extends State<MessageTokenButton>
     super.dispose();
   }
 
-  bool get _animate => widget.animateIn || _finishedInitialAnimation;
+  PracticeTarget? get _activity =>
+      widget.overlayController?.practiceTargetForToken(widget.token);
 
-  PracticeTarget? get _activity => widget.practiceTargetForToken;
+  bool get _animate => widget.animateIn || _finishedInitialAnimation;
 
   bool get _isActivityCompleteOrNullForToken =>
       _activity?.isCompleteByToken(

lib/pangea/toolbar/widgets/message_selection_overlay.dart

@@ -24,6 +24,7 @@ import 'package:fluffychat/pangea/practice_activities/practice_activity_model.da
 import 'package:fluffychat/pangea/practice_activities/practice_choice.dart';
 import 'package:fluffychat/pangea/practice_activities/practice_selection.dart';
 import 'package:fluffychat/pangea/practice_activities/practice_selection_repo.dart';
+import 'package:fluffychat/pangea/practice_activities/practice_target.dart';
 import 'package:fluffychat/pangea/toolbar/controllers/text_to_speech_controller.dart';
 import 'package:fluffychat/pangea/toolbar/controllers/tts_controller.dart';
 import 'package:fluffychat/pangea/toolbar/enums/message_mode_enum.dart';
@@ -558,6 +559,13 @@ class MessageOverlayController extends State<MessageSelectionOverlay>
     updateSelectedSpan(token.text);
   }
 
+  PracticeTarget? practiceTargetForToken(PangeaToken token) {
+    if (toolbarMode.associatedActivityType == null) return null;
+    return practiceSelection
+        ?.activities(toolbarMode.associatedActivityType!)
+        .firstWhereOrNull((a) => a.tokens.contains(token));
+  }
+
   /// Whether the given token is currently selected or highlighted
   bool isTokenSelected(PangeaToken token) {
     final isSelected = _selectedSpan?.offset == token.text.offset &&