From e9752bf3639f4d430e9a29d635977196494383bc Mon Sep 17 00:00:00 2001 From: Tamara Slosarek Date: Fri, 22 Mar 2024 15:13:38 +0100 Subject: [PATCH] feat(app): structure guideline card --- .../widgets/annotation_cards/disclaimer.dart | 33 ++++--- .../widgets/annotation_cards/guideline.dart | 92 ++++++++++++------- app/lib/l10n/app_en.arb | 5 +- 3 files changed, 82 insertions(+), 48 deletions(-) diff --git a/app/lib/drug/widgets/annotation_cards/disclaimer.dart b/app/lib/drug/widgets/annotation_cards/disclaimer.dart index c463fb26..ab66e91f 100644 --- a/app/lib/drug/widgets/annotation_cards/disclaimer.dart +++ b/app/lib/drug/widgets/annotation_cards/disclaimer.dart @@ -1,8 +1,9 @@ import '../../../common/module.dart'; class Disclaimer extends StatelessWidget { - const Disclaimer({this.text}); + const Disclaimer({ this.description, this.text }); + final String? description; final String? text; @override @@ -16,22 +17,26 @@ class Disclaimer extends StatelessWidget { color: PharMeTheme.surfaceColor, border: Border.all(color: PharMeTheme.errorColor, width: 1.2), ), - child: Row(children: [ - Icon( - Icons.warning_rounded, - size: PharMeTheme.largeSpace, - color: PharMeTheme.errorColor, - ), - SizedBox(width: PharMeTheme.smallSpace), - Flexible( - child: Text( - text ?? context.l10n.drugs_page_disclaimer, - style: PharMeTheme.textTheme.labelMedium!.copyWith( - fontWeight: FontWeight.w300, + child: Text.rich( + TextSpan(children: [ + WidgetSpan( + child: Icon( + Icons.warning_rounded, + size: PharMeTheme.mediumSpace, + color: PharMeTheme.errorColor, ), ), + TextSpan(text: ' '), + TextSpan( + text: description ?? context.l10n.drugs_page_disclaimer_description, + style: TextStyle(fontWeight: FontWeight.bold), + ), + TextSpan(text: text ?? context.l10n.drugs_page_disclaimer_text), + ]), + style: PharMeTheme.textTheme.labelMedium!.copyWith( + fontWeight: FontWeight.w300, ), - ]), + ), ); } } diff --git a/app/lib/drug/widgets/annotation_cards/guideline.dart b/app/lib/drug/widgets/annotation_cards/guideline.dart index 1657da1d..24581335 100644 --- a/app/lib/drug/widgets/annotation_cards/guideline.dart +++ b/app/lib/drug/widgets/annotation_cards/guideline.dart @@ -9,6 +9,7 @@ enum WarfarinContent { recommendation, color, icon, + heading, } final warfarinProperties = { @@ -20,6 +21,7 @@ final warfarinProperties = { context.l10n.drugs_page_recommendation_warfarin, WarfarinContent.color: (_) => WarningLevel.none.color, WarfarinContent.icon: (_) => WarningLevel.none.icon, + WarfarinContent.heading: (context) => WarningLevel.none.getLabel(context), }; class GuidelineAnnotationCard extends StatelessWidget { @@ -60,32 +62,32 @@ class GuidelineAnnotationCard extends StatelessWidget { } dynamic actualOrWarfarinContent(String drugName, BuildContext context, { - required dynamic actual, - required WarfarinContent content, + required dynamic actualContent, + required WarfarinContent warfarinContent, }) { if (drugName.toLowerCase() == 'warfarin') { - final getWarfarinContent = warfarinProperties[content]!; + final getWarfarinContent = warfarinProperties[warfarinContent]!; return getWarfarinContent(context); } - return actual; + return actualContent; } Widget _buildCard(BuildContext context) { - final upperCardText = actualOrWarfarinContent( + final implicationText = actualOrWarfarinContent( drug.name, context, - actual: drug.userGuideline?.annotations.implication ?? + actualContent: drug.userGuideline?.annotations.implication ?? context.l10n.drugs_page_no_guidelines_for_phenotype_implication( drug.name ), - content: WarfarinContent.implication, + warfarinContent: WarfarinContent.implication, ); - final lowerCardText = actualOrWarfarinContent( + final recommendationText = actualOrWarfarinContent( drug.name, context, - actual: drug.userGuideline?.annotations.recommendation ?? + actualContent: drug.userGuideline?.annotations.recommendation ?? context.l10n.drugs_page_no_guidelines_for_phenotype_recommendation, - content: WarfarinContent.recommendation, + warfarinContent: WarfarinContent.recommendation, ); return RoundedCard( key: Key('annotationCard'), @@ -95,35 +97,59 @@ class GuidelineAnnotationCard extends StatelessWidget { color: actualOrWarfarinContent( drug.name, context, - actual: drug.warningLevel.color, - content: WarfarinContent.color + actualContent: drug.warningLevel.color, + warfarinContent: WarfarinContent.color, ), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - Row(children: [ - Icon( - actualOrWarfarinContent( - drug.name, - context, - actual: drug.warningLevel.icon, - content: WarfarinContent.icon + Text.rich( + TextSpan(children: [ + WidgetSpan( + alignment: PlaceholderAlignment.middle, + child: Icon( + actualOrWarfarinContent( + drug.name, + context, + actualContent: drug.warningLevel.icon, + warfarinContent: WarfarinContent.icon, + ), + color: PharMeTheme.onSurfaceText, + size: PharMeTheme.mediumToLargeSpace, + ), ), - color: PharMeTheme.onSurfaceText, - size: PharMeTheme.largeSpace, + TextSpan( + text: ' ${actualOrWarfarinContent( + drug.name, + context, + actualContent: drug.warningLevel.getLabel(context), + warfarinContent: WarfarinContent.heading, + )}', + ), + ]), + style: PharMeTheme.textTheme.titleMedium!.copyWith( + fontWeight: FontWeight.bold, ), - SizedBox(width: PharMeTheme.smallToMediumSpace), - Flexible( - child: Text( - upperCardText, - style: PharMeTheme.textTheme.bodyMedium, + ), + SizedBox(height: PharMeTheme.smallToMediumSpace), + Text.rich( + TextSpan(children: [ + TextSpan( + text: context.l10n.drugs_page_implication_description, + style: TextStyle(fontWeight: FontWeight.bold), ), - ) - ]), + TextSpan(text: implicationText), + ]), + ), SizedBox(height: PharMeTheme.smallToMediumSpace), - Text( - lowerCardText, - style: PharMeTheme.textTheme.bodyMedium, + Text.rich( + TextSpan(children: [ + TextSpan( + text: context.l10n.drugs_page_recommendation_description, + style: TextStyle(fontWeight: FontWeight.bold), + ), + TextSpan(text: recommendationText), + ]), ), if (drug.userGuideline != null) ...[ SizedBox(height: PharMeTheme.smallToMediumSpace), @@ -156,8 +182,8 @@ class GuidelineAnnotationCard extends StatelessWidget { return actualOrWarfarinContent( drug.name, context, - actual: actualTooltip, - content: WarfarinContent.tooltip, + actualContent: actualTooltip, + warfarinContent: WarfarinContent.tooltip, ); } diff --git a/app/lib/l10n/app_en.arb b/app/lib/l10n/app_en.arb index 979834b1..10301fb3 100644 --- a/app/lib/l10n/app_en.arb +++ b/app/lib/l10n/app_en.arb @@ -83,7 +83,8 @@ } } }, - "drugs_page_disclaimer": "Please note that the information shown on this page is ONLY based on your DNA and certain medications you are currently taking. Other important factors like weight, age, pre-existing conditions, and further medication interactions are not considered.", + "drugs_page_disclaimer_description": "Please note: ", + "drugs_page_disclaimer_text": "The information shown on this page is ONLY based on your DNA and certain medications you are currently taking. Other important factors like weight, age, pre-existing conditions, and further medication interactions are not considered.", "drugs_page_is_inhibitor": "Taking {drugName} can influence your results for the following gene(s): {genes}", "@drugs_page_is_inhibitor": { "placeholders": { @@ -206,6 +207,8 @@ "drugs_page_tooltip_missing_guideline_not_tested": "Guidelines provide recommendations on which medications to use based on your DNA. However, your genetic test result does not include the information needed to make such a recommendation for this medication.", "drugs_page_tooltip_warfarin": "CPIC guidelines provide recommendations on which medications to use based on your DNA. However, to calculate your warfarin dose, more information is needed.", + "drugs_page_implication_description": "Why: ", + "drugs_page_recommendation_description": "What to do: ", "drugs_page_implication_warfarin": "More information is needed to calculate your warfarin dose.", "drugs_page_recommendation_warfarin": "Consult your pharmacist or doctor for more information.",