diff --git a/lib/pangea/activity_sessions/activity_summary_widget.dart b/lib/pangea/activity_sessions/activity_summary_widget.dart index 5781c955d..614c76057 100644 --- a/lib/pangea/activity_sessions/activity_summary_widget.dart +++ b/lib/pangea/activity_sessions/activity_summary_widget.dart @@ -9,6 +9,7 @@ import 'package:material_symbols_icons/symbols.dart'; import 'package:matrix/matrix.dart'; import 'package:matrix/src/utils/markdown.dart'; +import 'package:fluffychat/config/app_config.dart'; import 'package:fluffychat/config/themes.dart'; import 'package:fluffychat/l10n/l10n.dart'; import 'package:fluffychat/pangea/activity_planner/activity_plan_model.dart'; @@ -16,8 +17,14 @@ import 'package:fluffychat/pangea/activity_sessions/activity_participant_list.da import 'package:fluffychat/pangea/activity_sessions/activity_role_model.dart'; import 'package:fluffychat/pangea/activity_sessions/activity_room_extension.dart'; import 'package:fluffychat/pangea/activity_sessions/activity_session_details_row.dart'; +import 'package:fluffychat/pangea/analytics_misc/construct_type_enum.dart'; +import 'package:fluffychat/pangea/common/utils/overlay.dart'; import 'package:fluffychat/pangea/common/widgets/url_image_widget.dart'; +import 'package:fluffychat/pangea/constructs/construct_identifier.dart'; +import 'package:fluffychat/pangea/events/models/pangea_token_text_model.dart'; import 'package:fluffychat/pangea/learning_settings/enums/language_level_type_enum.dart'; +import 'package:fluffychat/pangea/toolbar/widgets/word_zoom/word_zoom_widget.dart'; +import 'package:fluffychat/widgets/matrix.dart'; class ActivitySummary extends StatelessWidget { final ActivityPlanModel activity; @@ -174,28 +181,91 @@ class ActivitySummary extends StatelessWidget { child: Wrap( spacing: 4.0, runSpacing: 4.0, - children: activity.vocab - .map( - (vocab) => Container( + children: activity.vocab.map((vocab) { + return CompositedTransformTarget( + link: MatrixState.pAnyState + .layerLinkAndKey( + "activity-summary-vocab-${vocab.lemma}", + ) + .link, + child: InkWell( + key: MatrixState.pAnyState + .layerLinkAndKey( + "activity-summary-vocab-${vocab.lemma}", + ) + .key, + borderRadius: BorderRadius.circular( + 24.0, + ), + onTap: () { + OverlayUtil.showPositionedCard( + overlayKey: + "activity-summary-vocab-${vocab.lemma}", + context: context, + cardToShow: Material( + type: MaterialType.transparency, + child: Container( + decoration: BoxDecoration( + color: Theme.of(context).cardColor, + border: Border.all( + color: Theme.of(context) + .colorScheme + .primary, + width: 4.0, + ), + borderRadius: const BorderRadius.all( + Radius.circular( + AppConfig.borderRadius, + ), + ), + ), + child: WordZoomWidget( + token: PangeaTokenText( + content: vocab.lemma, + length: vocab.lemma.characters.length, + offset: 0, + ), + construct: ConstructIdentifier( + lemma: vocab.lemma, + type: ConstructTypeEnum.vocab, + category: vocab.pos, + ), + langCode: activity.req.targetLanguage, + onClose: () { + MatrixState.pAnyState.closeOverlay( + "activity-summary-vocab-${vocab.lemma}", + ); + }, + ), + ), + ), + transformTargetId: + "activity-summary-vocab-${vocab.lemma}", + closePrevOverlay: false, + addBorder: false, + maxWidth: AppConfig.toolbarMinWidth, + maxHeight: AppConfig.toolbarMaxHeight, + ); + }, + child: Container( padding: const EdgeInsets.symmetric( - vertical: 4.0, horizontal: 8.0, + vertical: 4.0, ), decoration: BoxDecoration( color: theme.colorScheme.primary.withAlpha( 20, ), - borderRadius: BorderRadius.circular( - 24.0, - ), + borderRadius: BorderRadius.circular(20), ), child: Text( vocab.lemma, style: theme.textTheme.bodyMedium, ), ), - ) - .toList(), + ), + ); + }).toList(), ), ), ],