From 9b97895a9d02e8b8471a70e893191e722aa56d0e Mon Sep 17 00:00:00 2001 From: ggurdin Date: Thu, 24 Oct 2024 08:50:41 -0400 Subject: [PATCH 1/3] merge main into toolbar-min-dimensions --- lib/config/app_config.dart | 2 ++ .../widgets/chat/message_audio_card.dart | 2 -- .../chat/message_selection_overlay.dart | 4 +-- lib/pangea/widgets/chat/message_toolbar.dart | 3 ++ .../chat/message_translation_card.dart | 7 +++- .../chat/message_unsubscribed_card.dart | 4 +-- .../toolbar_content_loading_indicator.dart | 32 +++++++++++-------- .../practice_activity_card.dart | 18 +++++------ 8 files changed, 40 insertions(+), 32 deletions(-) diff --git a/lib/config/app_config.dart b/lib/config/app_config.dart index 5a0706fe8..b044da3ee 100644 --- a/lib/config/app_config.dart +++ b/lib/config/app_config.dart @@ -23,6 +23,8 @@ abstract class AppConfig { static const bool allowOtherHomeservers = true; static const bool enableRegistration = true; static const double toolbarMaxHeight = 300.0; + static const double toolbarMinHeight = 70.0; + static const double toolbarMinWidth = 350.0; // #Pangea // static const Color primaryColor = Color(0xFF5625BA); // static const Color primaryColorLight = Color(0xFFCCBDEA); diff --git a/lib/pangea/widgets/chat/message_audio_card.dart b/lib/pangea/widgets/chat/message_audio_card.dart index 7a003a01c..133e16b1e 100644 --- a/lib/pangea/widgets/chat/message_audio_card.dart +++ b/lib/pangea/widgets/chat/message_audio_card.dart @@ -8,7 +8,6 @@ import 'package:fluffychat/pangea/matrix_event_wrappers/pangea_message_event.dar import 'package:fluffychat/pangea/models/pangea_token_model.dart'; import 'package:fluffychat/pangea/utils/error_handler.dart'; import 'package:fluffychat/pangea/widgets/chat/message_selection_overlay.dart'; -import 'package:fluffychat/pangea/widgets/chat/message_toolbar.dart'; import 'package:fluffychat/pangea/widgets/chat/toolbar_content_loading_indicator.dart'; import 'package:fluffychat/pangea/widgets/chat/tts_controller.dart'; import 'package:fluffychat/pangea/widgets/igc/card_error_widget.dart'; @@ -190,7 +189,6 @@ class MessageAudioCardState extends State { children: [ Container( padding: const EdgeInsets.all(8), - constraints: const BoxConstraints(minHeight: minCardHeight), alignment: Alignment.center, child: _isLoading ? const ToolbarContentLoadingIndicator() diff --git a/lib/pangea/widgets/chat/message_selection_overlay.dart b/lib/pangea/widgets/chat/message_selection_overlay.dart index 48cdfbd47..5cf9e70b5 100644 --- a/lib/pangea/widgets/chat/message_selection_overlay.dart +++ b/lib/pangea/widgets/chat/message_selection_overlay.dart @@ -443,9 +443,7 @@ class MessageOverlayController extends State } final overlayMessage = Container( - constraints: BoxConstraints( - maxWidth: maxWidth, - ), + constraints: BoxConstraints(maxWidth: maxWidth), child: Material( type: MaterialType.transparency, child: Column( diff --git a/lib/pangea/widgets/chat/message_toolbar.dart b/lib/pangea/widgets/chat/message_toolbar.dart index bcffbdf2a..cf4192691 100644 --- a/lib/pangea/widgets/chat/message_toolbar.dart +++ b/lib/pangea/widgets/chat/message_toolbar.dart @@ -114,6 +114,9 @@ class MessageToolbar extends StatelessWidget { ), constraints: const BoxConstraints( maxHeight: AppConfig.toolbarMaxHeight, + minWidth: AppConfig.toolbarMinWidth, + minHeight: AppConfig.toolbarMinHeight, + // maxWidth is set by MessageSelectionOverlay ), child: SingleChildScrollView( child: AnimatedSize( diff --git a/lib/pangea/widgets/chat/message_translation_card.dart b/lib/pangea/widgets/chat/message_translation_card.dart index 4d8bad28d..f37238a6b 100644 --- a/lib/pangea/widgets/chat/message_translation_card.dart +++ b/lib/pangea/widgets/chat/message_translation_card.dart @@ -134,26 +134,31 @@ class MessageTranslationCardState extends State { } return Padding( - padding: const EdgeInsets.all(8), + padding: const EdgeInsets.fromLTRB(16, 20, 16, 16), child: Row( mainAxisSize: MainAxisSize.min, + mainAxisAlignment: MainAxisAlignment.center, children: [ _fetchingTranslation ? const ToolbarContentLoadingIndicator() : Flexible( child: Column( + crossAxisAlignment: CrossAxisAlignment.center, + mainAxisAlignment: MainAxisAlignment.center, children: [ widget.selection != null ? selectionTranslation != null ? Text( selectionTranslation!, style: BotStyle.text(context), + textAlign: TextAlign.center, ) : const ToolbarContentLoadingIndicator() : repEvent != null ? Text( repEvent!.text, style: BotStyle.text(context), + textAlign: TextAlign.center, ) : const ToolbarContentLoadingIndicator(), if (notGoingToTranslate && widget.selection == null) diff --git a/lib/pangea/widgets/chat/message_unsubscribed_card.dart b/lib/pangea/widgets/chat/message_unsubscribed_card.dart index 5d91099b1..99a08456e 100644 --- a/lib/pangea/widgets/chat/message_unsubscribed_card.dart +++ b/lib/pangea/widgets/chat/message_unsubscribed_card.dart @@ -18,8 +18,8 @@ class MessageUnsubscribedCard extends StatelessWidget { final bool inTrialWindow = MatrixState.pangeaController.userController.inTrialWindow; - return Container( - padding: const EdgeInsets.all(8), + return Padding( + padding: const EdgeInsets.all(16), child: Column( children: [ Text( diff --git a/lib/pangea/widgets/chat/toolbar_content_loading_indicator.dart b/lib/pangea/widgets/chat/toolbar_content_loading_indicator.dart index f61496013..28f15c1a9 100644 --- a/lib/pangea/widgets/chat/toolbar_content_loading_indicator.dart +++ b/lib/pangea/widgets/chat/toolbar_content_loading_indicator.dart @@ -1,4 +1,3 @@ -import 'package:fluffychat/pangea/widgets/chat/message_toolbar.dart'; import 'package:flutter/material.dart'; class ToolbarContentLoadingIndicator extends StatelessWidget { @@ -8,20 +7,25 @@ class ToolbarContentLoadingIndicator extends StatelessWidget { @override Widget build(BuildContext context) { - return Container( - padding: const EdgeInsets.all(8), - constraints: const BoxConstraints(minHeight: minCardHeight), - alignment: Alignment.center, - child: Center( - child: SizedBox( - height: 14, - width: 14, - child: CircularProgressIndicator( - strokeWidth: 2.0, - color: Theme.of(context).colorScheme.primary, - ), + return Column( + // mainAxisSize: MainAxisSize.min, + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Row( + mainAxisSize: MainAxisSize.min, + mainAxisAlignment: MainAxisAlignment.center, + children: [ + SizedBox( + height: 14, + width: 14, + child: CircularProgressIndicator( + strokeWidth: 2.0, + color: Theme.of(context).colorScheme.primary, + ), + ), + ], ), - ), + ], ); } } diff --git a/lib/pangea/widgets/practice_activity/practice_activity_card.dart b/lib/pangea/widgets/practice_activity/practice_activity_card.dart index 7a2af7fc9..13d22890f 100644 --- a/lib/pangea/widgets/practice_activity/practice_activity_card.dart +++ b/lib/pangea/widgets/practice_activity/practice_activity_card.dart @@ -13,9 +13,9 @@ import 'package:fluffychat/pangea/utils/bot_style.dart'; import 'package:fluffychat/pangea/utils/error_handler.dart'; import 'package:fluffychat/pangea/widgets/animations/gain_points.dart'; import 'package:fluffychat/pangea/widgets/chat/message_selection_overlay.dart'; +import 'package:fluffychat/pangea/widgets/chat/toolbar_content_loading_indicator.dart'; import 'package:fluffychat/pangea/widgets/content_issue_button.dart'; import 'package:fluffychat/pangea/widgets/practice_activity/multiple_choice_activity.dart'; -import 'package:fluffychat/pangea/widgets/practice_activity/no_more_practice_card.dart'; import 'package:fluffychat/pangea/widgets/practice_activity/target_tokens_controller.dart'; import 'package:fluffychat/widgets/matrix.dart'; import 'package:flutter/foundation.dart'; @@ -321,11 +321,13 @@ class PracticeActivityCardState extends State { @override Widget build(BuildContext context) { - if (!fetchingActivity && currentActivity == null) { - return GamifiedTextWidget( - userMessage: L10n.of(context)!.noActivitiesFound, - ); - } + // if (!fetchingActivity && currentActivity == null) { + // return GamifiedTextWidget( + // userMessage: L10n.of(context)!.noActivitiesFound, + // ); + // } + + return const ToolbarContentLoadingIndicator(); return Stack( alignment: Alignment.center, @@ -340,10 +342,6 @@ class PracticeActivityCardState extends State { ), // Conditionally show the darkening and progress indicator based on the loading state if (!savoringTheJoy && fetchingActivity) ...[ - // Semi-transparent overlay - Container( - color: Colors.black.withOpacity(0.5), // Darkening effect - ), // Circular progress indicator in the center const Center( child: CircularProgressIndicator(), From cb566d06bced6a26dd3f57d653a995378b1b71e9 Mon Sep 17 00:00:00 2001 From: ggurdin Date: Thu, 24 Oct 2024 13:24:41 -0400 Subject: [PATCH 2/3] add minimum dimensions to toolbar contents --- lib/config/app_config.dart | 2 +- lib/pages/chat/events/audio_player.dart | 2 +- lib/pangea/utils/inline_tooltip.dart | 17 +- .../widgets/chat/message_audio_card.dart | 2 + .../chat/message_speech_to_text_card.dart | 8 +- .../chat/message_translation_card.dart | 73 ++--- .../toolbar_content_loading_indicator.dart | 31 +- .../common_widgets/overlay_container.dart | 2 + lib/pangea/widgets/igc/card_error_widget.dart | 39 ++- lib/pangea/widgets/igc/card_header.dart | 37 +-- lib/pangea/widgets/igc/word_data_card.dart | 295 ++++++++---------- .../no_more_practice_card.dart | 28 +- .../practice_activity_card.dart | 61 ++-- lib/pangea/widgets/select_to_define.dart | 17 +- pubspec.yaml | 2 +- 15 files changed, 287 insertions(+), 329 deletions(-) diff --git a/lib/config/app_config.dart b/lib/config/app_config.dart index b044da3ee..418244fb9 100644 --- a/lib/config/app_config.dart +++ b/lib/config/app_config.dart @@ -24,7 +24,7 @@ abstract class AppConfig { static const bool enableRegistration = true; static const double toolbarMaxHeight = 300.0; static const double toolbarMinHeight = 70.0; - static const double toolbarMinWidth = 350.0; + static const double toolbarMinWidth = 250.0; // #Pangea // static const Color primaryColor = Color(0xFF5625BA); // static const Color primaryColorLight = Color(0xFFCCBDEA); diff --git a/lib/pages/chat/events/audio_player.dart b/lib/pages/chat/events/audio_player.dart index 41e0dc388..4a4f6fac9 100644 --- a/lib/pages/chat/events/audio_player.dart +++ b/lib/pages/chat/events/audio_player.dart @@ -467,7 +467,7 @@ class AudioPlayerState extends State { borderRadius: BorderRadius.circular(2), ), height: 32 * (waveform[i] / 1024), - width: 1.5, + width: 3, ), ], ), diff --git a/lib/pangea/utils/inline_tooltip.dart b/lib/pangea/utils/inline_tooltip.dart index bef617b98..26ec05426 100644 --- a/lib/pangea/utils/inline_tooltip.dart +++ b/lib/pangea/utils/inline_tooltip.dart @@ -30,6 +30,7 @@ class InlineTooltip extends StatelessWidget { padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 8), child: Row( crossAxisAlignment: CrossAxisAlignment.center, + mainAxisSize: MainAxisSize.min, children: [ // Lightbulb icon on the left Icon( @@ -39,16 +40,14 @@ class InlineTooltip extends StatelessWidget { ), const SizedBox(width: 8), // Text in the middle - Expanded( - child: Center( - child: Text( - instructionsEnum.body(context), - style: TextStyle( - color: Theme.of(context).colorScheme.onSurface, - height: 1.5, - ), - textAlign: TextAlign.left, + Center( + child: Text( + instructionsEnum.body(context), + style: TextStyle( + color: Theme.of(context).colorScheme.onSurface, + height: 1.5, ), + textAlign: TextAlign.left, ), ), // Close button on the right diff --git a/lib/pangea/widgets/chat/message_audio_card.dart b/lib/pangea/widgets/chat/message_audio_card.dart index 133e16b1e..97ffe36d5 100644 --- a/lib/pangea/widgets/chat/message_audio_card.dart +++ b/lib/pangea/widgets/chat/message_audio_card.dart @@ -1,6 +1,7 @@ import 'dart:developer'; import 'dart:math'; +import 'package:fluffychat/config/app_config.dart'; import 'package:fluffychat/pages/chat/events/audio_player.dart'; import 'package:fluffychat/pangea/controllers/text_to_speech_controller.dart'; import 'package:fluffychat/pangea/extensions/pangea_event_extension.dart'; @@ -208,6 +209,7 @@ class MessageAudioCardState extends State { ) : const CardErrorWidget( error: "Null audio file in message_audio_card", + maxWidth: AppConfig.toolbarMinWidth, ), ), ], diff --git a/lib/pangea/widgets/chat/message_speech_to_text_card.dart b/lib/pangea/widgets/chat/message_speech_to_text_card.dart index 92489ce29..aae3b3eeb 100644 --- a/lib/pangea/widgets/chat/message_speech_to_text_card.dart +++ b/lib/pangea/widgets/chat/message_speech_to_text_card.dart @@ -1,5 +1,6 @@ import 'dart:developer'; +import 'package:fluffychat/config/app_config.dart'; import 'package:fluffychat/pangea/enum/instructions_enum.dart'; import 'package:fluffychat/pangea/matrix_event_wrappers/pangea_message_event.dart'; import 'package:fluffychat/pangea/models/speech_to_text_models.dart'; @@ -148,9 +149,12 @@ class MessageSpeechToTextCardState extends State { return const ToolbarContentLoadingIndicator(); } - //done fetchig but not results means some kind of error + // done fetchig but not results means some kind of error if (speechToTextResponse == null) { - return CardErrorWidget(error: error); + return CardErrorWidget( + error: error, + maxWidth: AppConfig.toolbarMinWidth, + ); } //TODO: find better icons diff --git a/lib/pangea/widgets/chat/message_translation_card.dart b/lib/pangea/widgets/chat/message_translation_card.dart index f37238a6b..3c0d750a3 100644 --- a/lib/pangea/widgets/chat/message_translation_card.dart +++ b/lib/pangea/widgets/chat/message_translation_card.dart @@ -1,3 +1,4 @@ +import 'package:fluffychat/config/app_config.dart'; import 'package:fluffychat/pangea/enum/instructions_enum.dart'; import 'package:fluffychat/pangea/matrix_event_wrappers/pangea_message_event.dart'; import 'package:fluffychat/pangea/models/pangea_token_model.dart'; @@ -130,7 +131,18 @@ class MessageTranslationCardState extends State { if (!_fetchingTranslation && repEvent == null && selectionTranslation == null) { - return const CardErrorWidget(error: "No translation found"); + return const CardErrorWidget( + error: "No translation found", + maxWidth: AppConfig.toolbarMinWidth, + ); + } + + final loadingTranslation = + (widget.selection != null && selectionTranslation == null) || + (widget.selection == null && repEvent == null); + + if (_fetchingTranslation || loadingTranslation) { + return const ToolbarContentLoadingIndicator(); } return Padding( @@ -139,42 +151,31 @@ class MessageTranslationCardState extends State { mainAxisSize: MainAxisSize.min, mainAxisAlignment: MainAxisAlignment.center, children: [ - _fetchingTranslation - ? const ToolbarContentLoadingIndicator() - : Flexible( - child: Column( - crossAxisAlignment: CrossAxisAlignment.center, - mainAxisAlignment: MainAxisAlignment.center, - children: [ - widget.selection != null - ? selectionTranslation != null - ? Text( - selectionTranslation!, - style: BotStyle.text(context), - textAlign: TextAlign.center, - ) - : const ToolbarContentLoadingIndicator() - : repEvent != null - ? Text( - repEvent!.text, - style: BotStyle.text(context), - textAlign: TextAlign.center, - ) - : const ToolbarContentLoadingIndicator(), - if (notGoingToTranslate && widget.selection == null) - InlineTooltip( - instructionsEnum: InstructionsEnum.l1Translation, - onClose: () => setState(() {}), - ), - if (widget.selection != null) - InlineTooltip( - instructionsEnum: - InstructionsEnum.clickAgainToDeselect, - onClose: () => setState(() {}), - ), - ], - ), + Flexible( + child: Column( + crossAxisAlignment: CrossAxisAlignment.center, + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Text( + widget.selection != null + ? selectionTranslation! + : repEvent!.text, + style: BotStyle.text(context), + textAlign: TextAlign.center, ), + if (notGoingToTranslate && widget.selection == null) + InlineTooltip( + instructionsEnum: InstructionsEnum.l1Translation, + onClose: () => setState(() {}), + ), + if (widget.selection != null) + InlineTooltip( + instructionsEnum: InstructionsEnum.clickAgainToDeselect, + onClose: () => setState(() {}), + ), + ], + ), + ), ], ), ); diff --git a/lib/pangea/widgets/chat/toolbar_content_loading_indicator.dart b/lib/pangea/widgets/chat/toolbar_content_loading_indicator.dart index 28f15c1a9..a497e121d 100644 --- a/lib/pangea/widgets/chat/toolbar_content_loading_indicator.dart +++ b/lib/pangea/widgets/chat/toolbar_content_loading_indicator.dart @@ -1,3 +1,4 @@ +import 'package:fluffychat/config/app_config.dart'; import 'package:flutter/material.dart'; class ToolbarContentLoadingIndicator extends StatelessWidget { @@ -7,25 +8,19 @@ class ToolbarContentLoadingIndicator extends StatelessWidget { @override Widget build(BuildContext context) { - return Column( - // mainAxisSize: MainAxisSize.min, - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Row( - mainAxisSize: MainAxisSize.min, - mainAxisAlignment: MainAxisAlignment.center, - children: [ - SizedBox( - height: 14, - width: 14, - child: CircularProgressIndicator( - strokeWidth: 2.0, - color: Theme.of(context).colorScheme.primary, - ), - ), - ], + return SizedBox( + width: AppConfig.toolbarMinWidth, + height: AppConfig.toolbarMinHeight, + child: Center( + child: SizedBox( + height: 14, + width: 14, + child: CircularProgressIndicator( + strokeWidth: 2.0, + color: Theme.of(context).colorScheme.primary, + ), ), - ], + ), ); } } diff --git a/lib/pangea/widgets/common_widgets/overlay_container.dart b/lib/pangea/widgets/common_widgets/overlay_container.dart index 5e2991be7..eae6c935f 100644 --- a/lib/pangea/widgets/common_widgets/overlay_container.dart +++ b/lib/pangea/widgets/common_widgets/overlay_container.dart @@ -32,6 +32,8 @@ class OverlayContainer extends StatelessWidget { constraints: BoxConstraints( maxWidth: maxWidth, maxHeight: maxHeight, + minHeight: 100, + minWidth: 100, ), //PTODO - position card above input/message // margin: const EdgeInsets.all(10), diff --git a/lib/pangea/widgets/igc/card_error_widget.dart b/lib/pangea/widgets/igc/card_error_widget.dart index 708fdd88f..52f66f5a0 100644 --- a/lib/pangea/widgets/igc/card_error_widget.dart +++ b/lib/pangea/widgets/igc/card_error_widget.dart @@ -9,37 +9,44 @@ class CardErrorWidget extends StatelessWidget { final Object? error; final Choreographer? choreographer; final int? offset; + final double? maxWidth; + const CardErrorWidget({ super.key, this.error, this.choreographer, this.offset, + this.maxWidth, }); @override Widget build(BuildContext context) { final ErrorCopy errorCopy = ErrorCopy(context, error); - return Padding( - padding: const EdgeInsets.all(8), - child: Column( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - CardHeader( - text: errorCopy.title, - botExpression: BotExpression.addled, - onClose: () => choreographer?.onMatchError( - cursorOffset: offset, + return ConstrainedBox( + constraints: maxWidth != null + ? BoxConstraints(maxWidth: maxWidth!) + : const BoxConstraints(), + child: Padding( + padding: const EdgeInsets.all(16), + child: Column( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + CardHeader( + text: errorCopy.title, + botExpression: BotExpression.addled, + onClose: () => choreographer?.onMatchError( + cursorOffset: offset, + ), ), - ), - const SizedBox(height: 10.0), - Center( - child: Text( + const SizedBox(height: 12.0), + Text( errorCopy.body, style: BotStyle.text(context), + textAlign: TextAlign.center, ), - ), - ], + ], + ), ), ); } diff --git a/lib/pangea/widgets/igc/card_header.dart b/lib/pangea/widgets/igc/card_header.dart index 671e58492..270314f72 100644 --- a/lib/pangea/widgets/igc/card_header.dart +++ b/lib/pangea/widgets/igc/card_header.dart @@ -1,8 +1,6 @@ -import 'package:fluffychat/config/app_config.dart'; import 'package:fluffychat/pangea/utils/bot_style.dart'; import 'package:flutter/material.dart'; -import '../../../widgets/matrix.dart'; import '../common/bot_face_svg.dart'; class CardHeader extends StatelessWidget { @@ -30,26 +28,25 @@ class CardHeader extends StatelessWidget { expression: botExpression, ), ), - const SizedBox(width: 5.0), - Text( - text, - style: BotStyle.text(context), - textAlign: TextAlign.left, - ), - const SizedBox(width: 5.0), - CircleAvatar( - backgroundColor: AppConfig.primaryColor.withOpacity(0.1), - child: IconButton( - icon: const Icon(Icons.close_outlined), - onPressed: () { - if (onClose != null) onClose!(); - MatrixState.pAnyState.closeOverlay(); - }, - color: Theme.of(context).brightness == Brightness.dark - ? AppConfig.primaryColorLight - : AppConfig.primaryColor, + const SizedBox(width: 12.0), + Flexible( + child: Text( + text, + style: BotStyle.text(context), + softWrap: true, ), ), + // const SizedBox(width: 5.0), + // IconButton( + // icon: const Icon(Icons.close_outlined), + // onPressed: () { + // if (onClose != null) onClose!(); + // MatrixState.pAnyState.closeOverlay(); + // }, + // color: Theme.of(context).brightness == Brightness.dark + // ? AppConfig.primaryColorLight + // : AppConfig.primaryColor, + // ), ], ), ); diff --git a/lib/pangea/widgets/igc/word_data_card.dart b/lib/pangea/widgets/igc/word_data_card.dart index 6f1492a75..ff494bb38 100644 --- a/lib/pangea/widgets/igc/word_data_card.dart +++ b/lib/pangea/widgets/igc/word_data_card.dart @@ -1,5 +1,6 @@ import 'dart:developer'; +import 'package:fluffychat/config/app_config.dart'; import 'package:fluffychat/pangea/constants/language_constants.dart'; import 'package:fluffychat/pangea/controllers/contextual_definition_controller.dart'; import 'package:fluffychat/pangea/controllers/pangea_controller.dart'; @@ -7,8 +8,7 @@ import 'package:fluffychat/pangea/models/language_model.dart'; import 'package:fluffychat/pangea/utils/bot_style.dart'; import 'package:fluffychat/pangea/utils/error_handler.dart'; import 'package:fluffychat/pangea/utils/firebase_analytics.dart'; -import 'package:fluffychat/pangea/widgets/chat/message_toolbar.dart'; -import 'package:fluffychat/pangea/widgets/common/p_circular_loader.dart'; +import 'package:fluffychat/pangea/widgets/chat/toolbar_content_loading_indicator.dart'; import 'package:fluffychat/widgets/matrix.dart'; import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; @@ -166,71 +166,68 @@ class WordDataCardView extends StatelessWidget { @override Widget build(BuildContext context) { if (controller.wordNetError != null) { - return CardErrorWidget(error: controller.wordNetError); + return CardErrorWidget( + error: controller.wordNetError, + maxWidth: AppConfig.toolbarMinWidth, + ); } if (controller.activeL1 == null || controller.activeL2 == null) { ErrorHandler.logError(m: "should not be here"); - return CardErrorWidget(error: controller.noLanguages); + return CardErrorWidget( + error: controller.noLanguages, + maxWidth: AppConfig.toolbarMinWidth, + ); } - final ScrollController scrollController = ScrollController(); - - return Container( - padding: const EdgeInsets.all(8), - constraints: const BoxConstraints(minHeight: minCardHeight), - alignment: Alignment.center, - child: Scrollbar( - thumbVisibility: true, - controller: scrollController, - child: SingleChildScrollView( - controller: scrollController, - child: Column( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - if (controller.widget.choiceFeedback != null) - Text( - controller.widget.choiceFeedback!, - style: BotStyle.text(context), - ), - const SizedBox(height: 5.0), - if (controller.wordData != null && - controller.wordNetError == null && - controller.activeL1 != null && - controller.activeL2 != null) - WordNetInfo( - wordData: controller.wordData!, - activeL1: controller.activeL1!, - activeL2: controller.activeL2!, - ), - if (controller.isLoadingWordNet) const PCircular(), - const SizedBox(height: 5.0), - // if (controller.widget.hasInfo && - // !controller.isLoadingContextualDefinition && - // controller.contextualDefinitionRes == null) - // Material( - // type: MaterialType.transparency, - // child: ListTile( - // leading: const BotFace( - // width: 40, expression: BotExpression.surprised), - // title: Text(L10n.of(context)!.askPangeaBot), - // onTap: controller.handleGetDefinitionButtonPress, - // ), - // ), - if (controller.isLoadingContextualDefinition) const PCircular(), - if (controller.contextualDefinitionRes != null) - Text( - controller.contextualDefinitionRes!.text, - style: BotStyle.text(context), - ), - if (controller.definitionError != null) - Text( - L10n.of(context)!.sorryNoResults, - style: BotStyle.text(context), - ), - ], - ), - ), + return Padding( + padding: const EdgeInsets.fromLTRB(16, 20, 16, 16), + child: Column( + children: [ + if (controller.widget.choiceFeedback != null) + Text( + controller.widget.choiceFeedback!, + style: BotStyle.text(context), + ), + const SizedBox(height: 5.0), + if (controller.wordData != null && + controller.wordNetError == null && + controller.activeL1 != null && + controller.activeL2 != null) + WordNetInfo( + wordData: controller.wordData!, + activeL1: controller.activeL1!, + activeL2: controller.activeL2!, + ), + if (controller.isLoadingWordNet) + const ToolbarContentLoadingIndicator(), + const SizedBox(height: 5.0), + // if (controller.widget.hasInfo && + // !controller.isLoadingContextualDefinition && + // controller.contextualDefinitionRes == null) + // Material( + // type: MaterialType.transparency, + // child: ListTile( + // leading: const BotFace( + // width: 40, expression: BotExpression.surprised), + // title: Text(L10n.of(context)!.askPangeaBot), + // onTap: controller.handleGetDefinitionButtonPress, + // ), + // ), + if (controller.isLoadingContextualDefinition) + const ToolbarContentLoadingIndicator(), + if (controller.contextualDefinitionRes != null) + Text( + controller.contextualDefinitionRes!.text, + style: BotStyle.text(context), + textAlign: TextAlign.center, + ), + if (controller.definitionError != null) + Text( + L10n.of(context)!.sorryNoResults, + style: BotStyle.text(context), + textAlign: TextAlign.center, + ), + ], ), ); } @@ -251,12 +248,14 @@ class WordNetInfo extends StatelessWidget { @override Widget build(BuildContext context) { return Column( + crossAxisAlignment: CrossAxisAlignment.start, children: [ SensesForLanguage( wordData: wordData, languageType: LanguageType.target, language: activeL2, ), + const SizedBox(height: 10), SensesForLanguage( wordData: wordData, languageType: LanguageType.base, @@ -273,52 +272,6 @@ enum LanguageType { } class SensesForLanguage extends StatelessWidget { - const SensesForLanguage({ - super.key, - required this.wordData, - required this.languageType, - required this.language, - }); - - final LanguageModel language; - final LanguageType languageType; - final WordData wordData; - - @override - Widget build(BuildContext context) { - return Padding( - padding: const EdgeInsets.symmetric(vertical: 5), - child: Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Padding( - padding: const EdgeInsets.fromLTRB(7, 0, 0, 0), - child: LanguageFlag( - language: language, - ), - ), - Expanded( - child: PartOfSpeechBlock( - wordData: wordData, - languageType: languageType, - ), - ), - ], - ), - ); - } -} - -class PartOfSpeechBlock extends StatelessWidget { - final WordData wordData; - final LanguageType languageType; - - const PartOfSpeechBlock({ - super.key, - required this.wordData, - required this.languageType, - }); - String get exampleSentence => languageType == LanguageType.target ? wordData.targetExampleSentence : wordData.baseExampleSentence; @@ -336,70 +289,76 @@ class PartOfSpeechBlock extends StatelessWidget { return "$word (${wordData.formattedPartOfSpeech(languageType)})"; } + const SensesForLanguage({ + super.key, + required this.wordData, + required this.languageType, + required this.language, + }); + + final LanguageModel language; + final LanguageType languageType; + final WordData wordData; + @override Widget build(BuildContext context) { - return Padding( - padding: const EdgeInsets.fromLTRB(10, 0, 10, 0), - child: Column( - mainAxisAlignment: MainAxisAlignment.start, - children: [ - Align( - alignment: Alignment.centerLeft, - child: Text( - formattedTitle(context), - style: BotStyle.text(context, italics: true, bold: false), - ), - ), - const SizedBox(height: 10), - Padding( - padding: const EdgeInsets.only(left: 14.0, bottom: 10.0), - child: Align( - alignment: Alignment.centerLeft, - child: Column( - children: [ - if (definition.isNotEmpty) - RichText( - text: TextSpan( - style: BotStyle.text( - context, - italics: false, - bold: false, - ), - children: [ - TextSpan( - text: "${L10n.of(context)!.definition}: ", - style: const TextStyle(fontWeight: FontWeight.bold), - ), - TextSpan(text: definition), - ], - ), - ), - const SizedBox(height: 10), - if (exampleSentence.isNotEmpty) - RichText( - text: TextSpan( - style: BotStyle.text( - context, - italics: false, - bold: false, - ), - children: [ - TextSpan( - text: "${L10n.of(context)!.exampleSentence}: ", - style: const TextStyle( - fontWeight: FontWeight.bold, - ), - ), - TextSpan(text: exampleSentence), - ], - ), - ), - ], + return Row( + mainAxisSize: MainAxisSize.min, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + LanguageFlag(language: language), + const SizedBox(width: 10), + Flexible( + child: Column( + mainAxisAlignment: MainAxisAlignment.start, + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + formattedTitle(context), + style: BotStyle.text(context, italics: true, bold: false), ), - ), + const SizedBox(height: 4), + if (definition.isNotEmpty) + RichText( + text: TextSpan( + style: BotStyle.text( + context, + italics: false, + bold: false, + ), + children: [ + TextSpan( + text: "${L10n.of(context)!.definition}: ", + style: const TextStyle(fontWeight: FontWeight.bold), + ), + TextSpan(text: definition), + ], + ), + ), + const SizedBox(height: 4), + if (exampleSentence.isNotEmpty) + RichText( + text: TextSpan( + style: BotStyle.text( + context, + italics: false, + bold: false, + ), + children: [ + TextSpan( + text: "${L10n.of(context)!.exampleSentence}: ", + style: const TextStyle( + fontWeight: FontWeight.bold, + ), + ), + TextSpan(text: exampleSentence), + ], + ), + ), + ], ), - ], - ), + ), + ], ); } } diff --git a/lib/pangea/widgets/practice_activity/no_more_practice_card.dart b/lib/pangea/widgets/practice_activity/no_more_practice_card.dart index d4844ac21..12a087d97 100644 --- a/lib/pangea/widgets/practice_activity/no_more_practice_card.dart +++ b/lib/pangea/widgets/practice_activity/no_more_practice_card.dart @@ -1,3 +1,4 @@ +import 'package:fluffychat/config/app_config.dart'; import 'package:fluffychat/pangea/utils/bot_style.dart'; import 'package:flutter/material.dart'; @@ -71,18 +72,21 @@ class GamifiedTextWidget extends StatelessWidget { @override Widget build(BuildContext context) { - return Padding( - padding: const EdgeInsets.all(8), - child: Column( - children: [ - const StarAnimationWidget(), - const SizedBox(height: 10), - Text( - userMessage, - style: BotStyle.text(context), - textAlign: TextAlign.center, - ), - ], + return SizedBox( + width: AppConfig.toolbarMinWidth, + child: Padding( + padding: const EdgeInsets.fromLTRB(16, 20, 16, 16), + child: Column( + children: [ + const StarAnimationWidget(), + const SizedBox(height: 10), + Text( + userMessage, + style: BotStyle.text(context), + textAlign: TextAlign.center, + ), + ], + ), ), ); } diff --git a/lib/pangea/widgets/practice_activity/practice_activity_card.dart b/lib/pangea/widgets/practice_activity/practice_activity_card.dart index 13d22890f..c9c42b85b 100644 --- a/lib/pangea/widgets/practice_activity/practice_activity_card.dart +++ b/lib/pangea/widgets/practice_activity/practice_activity_card.dart @@ -9,13 +9,13 @@ import 'package:fluffychat/pangea/models/analytics/constructs_model.dart'; import 'package:fluffychat/pangea/models/practice_activities.dart/message_activity_request.dart'; import 'package:fluffychat/pangea/models/practice_activities.dart/practice_activity_model.dart'; import 'package:fluffychat/pangea/models/practice_activities.dart/practice_activity_record_model.dart'; -import 'package:fluffychat/pangea/utils/bot_style.dart'; import 'package:fluffychat/pangea/utils/error_handler.dart'; import 'package:fluffychat/pangea/widgets/animations/gain_points.dart'; import 'package:fluffychat/pangea/widgets/chat/message_selection_overlay.dart'; import 'package:fluffychat/pangea/widgets/chat/toolbar_content_loading_indicator.dart'; import 'package:fluffychat/pangea/widgets/content_issue_button.dart'; import 'package:fluffychat/pangea/widgets/practice_activity/multiple_choice_activity.dart'; +import 'package:fluffychat/pangea/widgets/practice_activity/no_more_practice_card.dart'; import 'package:fluffychat/pangea/widgets/practice_activity/target_tokens_controller.dart'; import 'package:fluffychat/widgets/matrix.dart'; import 'package:flutter/foundation.dart'; @@ -286,12 +286,10 @@ class PracticeActivityCardState extends State { /// If there is no current activity, the widget returns a sizedbox with a height of 80. /// If the activity type is multiple choice, the widget returns a MultipleChoiceActivity. /// If the activity type is unknown, the widget logs an error and returns a text widget with an error message. - Widget get activityWidget { - if (currentActivity == null) { - // return sizedbox with height of 80 - return const SizedBox(height: 80); - } - switch (currentActivity!.activityType) { + Widget? get activityWidget { + switch (currentActivity?.activityType) { + case null: + return null; case ActivityTypeEnum.multipleChoice: return MultipleChoiceActivity( practiceCardController: this, @@ -304,30 +302,28 @@ class PracticeActivityCardState extends State { practiceCardController: this, currentActivity: currentActivity!, ); - default: - ErrorHandler.logError( - e: Exception('Unknown activity type'), - m: 'Unknown activity type', - data: { - 'activityType': currentActivity!.activityType, - }, - ); - return Text( - L10n.of(context)!.oopsSomethingWentWrong, - style: BotStyle.text(context), - ); + // default: + // ErrorHandler.logError( + // e: Exception('Unknown activity type'), + // m: 'Unknown activity type', + // data: { + // 'activityType': currentActivity!.activityType, + // }, + // ); + // return Text( + // L10n.of(context)!.oopsSomethingWentWrong, + // style: BotStyle.text(context), + // ); } } @override Widget build(BuildContext context) { - // if (!fetchingActivity && currentActivity == null) { - // return GamifiedTextWidget( - // userMessage: L10n.of(context)!.noActivitiesFound, - // ); - // } - - return const ToolbarContentLoadingIndicator(); + if (!fetchingActivity && currentActivity == null) { + return GamifiedTextWidget( + userMessage: L10n.of(context)!.noActivitiesFound, + ); + } return Stack( alignment: Alignment.center, @@ -336,16 +332,15 @@ class PracticeActivityCardState extends State { const Positioned( child: PointsGainedAnimation(), ), - Padding( - padding: const EdgeInsets.fromLTRB(8, 20, 8, 8), - child: activityWidget, - ), + if (activityWidget != null) + Padding( + padding: const EdgeInsets.fromLTRB(16, 20, 16, 16), + child: activityWidget, + ), // Conditionally show the darkening and progress indicator based on the loading state if (!savoringTheJoy && fetchingActivity) ...[ // Circular progress indicator in the center - const Center( - child: CircularProgressIndicator(), - ), + const ToolbarContentLoadingIndicator(), ], // Flag button in the top right corner Positioned( diff --git a/lib/pangea/widgets/select_to_define.dart b/lib/pangea/widgets/select_to_define.dart index 556cc7f94..968eaa147 100644 --- a/lib/pangea/widgets/select_to_define.dart +++ b/lib/pangea/widgets/select_to_define.dart @@ -10,18 +10,11 @@ class SelectToDefine extends StatelessWidget { @override Widget build(BuildContext context) { return Padding( - padding: const EdgeInsets.all(8), - child: Row( - mainAxisSize: MainAxisSize.min, - children: [ - Flexible( - child: Text( - L10n.of(context)!.selectToDefine, - style: BotStyle.text(context), - textAlign: TextAlign.center, - ), - ), - ], + padding: const EdgeInsets.fromLTRB(16, 20, 16, 16), + child: Text( + L10n.of(context)!.selectToDefine, + style: BotStyle.text(context), + textAlign: TextAlign.center, ), ); } diff --git a/pubspec.yaml b/pubspec.yaml index 076a0ed49..f8f00ee8f 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -6,7 +6,7 @@ description: Learn a language while texting your friends. # Pangea# publish_to: none # On version bump also increase the build number for F-Droid -version: 1.22.3+3553 +version: 1.22.4+3554 environment: sdk: ">=3.0.0 <4.0.0" From 4b5602b2374ad360a9e2f87e4189c5867b91ed5e Mon Sep 17 00:00:00 2001 From: ggurdin Date: Thu, 24 Oct 2024 13:42:22 -0400 Subject: [PATCH 3/3] added x button back to card error header --- lib/config/app_config.dart | 2 +- lib/pangea/widgets/igc/card_error_widget.dart | 30 ++++++++-------- lib/pangea/widgets/igc/card_header.dart | 35 ++++++++++--------- 3 files changed, 34 insertions(+), 33 deletions(-) diff --git a/lib/config/app_config.dart b/lib/config/app_config.dart index 418244fb9..ab05ffd99 100644 --- a/lib/config/app_config.dart +++ b/lib/config/app_config.dart @@ -24,7 +24,7 @@ abstract class AppConfig { static const bool enableRegistration = true; static const double toolbarMaxHeight = 300.0; static const double toolbarMinHeight = 70.0; - static const double toolbarMinWidth = 250.0; + static const double toolbarMinWidth = 270.0; // #Pangea // static const Color primaryColor = Color(0xFF5625BA); // static const Color primaryColorLight = Color(0xFFCCBDEA); diff --git a/lib/pangea/widgets/igc/card_error_widget.dart b/lib/pangea/widgets/igc/card_error_widget.dart index 52f66f5a0..8c810391b 100644 --- a/lib/pangea/widgets/igc/card_error_widget.dart +++ b/lib/pangea/widgets/igc/card_error_widget.dart @@ -27,26 +27,26 @@ class CardErrorWidget extends StatelessWidget { constraints: maxWidth != null ? BoxConstraints(maxWidth: maxWidth!) : const BoxConstraints(), - child: Padding( - padding: const EdgeInsets.all(16), - child: Column( - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - CardHeader( - text: errorCopy.title, - botExpression: BotExpression.addled, - onClose: () => choreographer?.onMatchError( - cursorOffset: offset, - ), + child: Column( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + CardHeader( + text: errorCopy.title, + botExpression: BotExpression.addled, + onClose: () => choreographer?.onMatchError( + cursorOffset: offset, ), - const SizedBox(height: 12.0), - Text( + ), + const SizedBox(height: 12.0), + Padding( + padding: const EdgeInsets.all(12), + child: Text( errorCopy.body, style: BotStyle.text(context), textAlign: TextAlign.center, ), - ], - ), + ), + ], ), ); } diff --git a/lib/pangea/widgets/igc/card_header.dart b/lib/pangea/widgets/igc/card_header.dart index 270314f72..1816cc214 100644 --- a/lib/pangea/widgets/igc/card_header.dart +++ b/lib/pangea/widgets/igc/card_header.dart @@ -1,4 +1,6 @@ +import 'package:fluffychat/config/app_config.dart'; import 'package:fluffychat/pangea/utils/bot_style.dart'; +import 'package:fluffychat/widgets/matrix.dart'; import 'package:flutter/material.dart'; import '../common/bot_face_svg.dart'; @@ -20,13 +22,12 @@ class CardHeader extends StatelessWidget { return Padding( padding: const EdgeInsets.only(bottom: 5.0), child: Row( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Padding( - padding: const EdgeInsets.only(top: 3.0), - child: BotFace( - width: 50.0, - expression: botExpression, - ), + BotFace( + width: 50.0, + expression: botExpression, ), const SizedBox(width: 12.0), Flexible( @@ -36,17 +37,17 @@ class CardHeader extends StatelessWidget { softWrap: true, ), ), - // const SizedBox(width: 5.0), - // IconButton( - // icon: const Icon(Icons.close_outlined), - // onPressed: () { - // if (onClose != null) onClose!(); - // MatrixState.pAnyState.closeOverlay(); - // }, - // color: Theme.of(context).brightness == Brightness.dark - // ? AppConfig.primaryColorLight - // : AppConfig.primaryColor, - // ), + const SizedBox(width: 5.0), + IconButton( + icon: const Icon(Icons.close_outlined), + onPressed: () { + if (onClose != null) onClose!(); + MatrixState.pAnyState.closeOverlay(); + }, + color: Theme.of(context).brightness == Brightness.dark + ? AppConfig.primaryColorLight + : AppConfig.primaryColor, + ), ], ), );