From acbd3356c53899e49d9d84dd463bb0637adcd603 Mon Sep 17 00:00:00 2001 From: Owais Jamil Date: Sat, 16 May 2026 20:06:52 -0500 Subject: [PATCH] feat: show displayed fonts in selector --- .../presentation/settings_screen.dart | 21 +++++++++++ .../presentation/widgets/settings_tiles.dart | 19 +++++++++- .../presentation/settings_screen_test.dart | 35 +++++++++++++++---- 3 files changed, 68 insertions(+), 7 deletions(-) diff --git a/lib/features/settings/presentation/settings_screen.dart b/lib/features/settings/presentation/settings_screen.dart index a73e106..df15a4f 100644 --- a/lib/features/settings/presentation/settings_screen.dart +++ b/lib/features/settings/presentation/settings_screen.dart @@ -273,6 +273,7 @@ class SettingsScreen extends StatelessWidget { value: state.headingFontFamily, options: AppHeadingFontFamily.values, labelBuilder: (fontFamily) => fontFamily.label, + optionBuilder: _headingFontOption, onChanged: (value) { if (value != null) { settingsCubit.setHeadingFontFamily(value); @@ -285,6 +286,7 @@ class SettingsScreen extends StatelessWidget { value: state.contentFontFamily, options: AppContentFontFamily.values, labelBuilder: (fontFamily) => fontFamily.label, + optionBuilder: _contentFontOption, onChanged: (value) { if (value != null) { settingsCubit.setContentFontFamily(value); @@ -297,6 +299,7 @@ class SettingsScreen extends StatelessWidget { value: state.codeFontFamily, options: AppCodeFontFamily.values, labelBuilder: (fontFamily) => fontFamily.label, + optionBuilder: _codeFontOption, onChanged: (value) { if (value != null) { settingsCubit.setCodeFontFamily(value); @@ -311,6 +314,24 @@ class SettingsScreen extends StatelessWidget { ); } + Widget _headingFontOption(BuildContext context, AppHeadingFontFamily fontFamily) => Text( + fontFamily.label, + textAlign: TextAlign.right, + style: AppTypography.heading(fontFamily, color: context.colorScheme.onSurface), + ); + + Widget _contentFontOption(BuildContext context, AppContentFontFamily fontFamily) => Text( + fontFamily.label, + textAlign: TextAlign.right, + style: AppTypography.content(fontFamily, color: context.colorScheme.onSurface), + ); + + Widget _codeFontOption(BuildContext context, AppCodeFontFamily fontFamily) => Text( + fontFamily.label, + textAlign: TextAlign.right, + style: AppTypography.code(fontFamily, color: context.colorScheme.onSurface), + ); + Widget _buildLayoutSettings(BuildContext context) { final settingsCubit = context.read(); final theme = Theme.of(context); diff --git a/lib/features/settings/presentation/widgets/settings_tiles.dart b/lib/features/settings/presentation/widgets/settings_tiles.dart index a403a5e..9ec8bc6 100644 --- a/lib/features/settings/presentation/widgets/settings_tiles.dart +++ b/lib/features/settings/presentation/widgets/settings_tiles.dart @@ -55,6 +55,7 @@ class SettingsDropdownTile extends StatelessWidget { required this.labelBuilder, required this.onChanged, this.subtitle, + this.optionBuilder, }); final String title; @@ -63,6 +64,7 @@ class SettingsDropdownTile extends StatelessWidget { final List options; final String Function(T value) labelBuilder; final ValueChanged onChanged; + final Widget Function(BuildContext context, T value)? optionBuilder; @override Widget build(BuildContext context) => ListTile( @@ -70,10 +72,25 @@ class SettingsDropdownTile extends StatelessWidget { subtitle: subtitle != null ? Text(subtitle!) : null, trailing: DropdownButtonHideUnderline( child: DropdownButton( + alignment: AlignmentDirectional.centerEnd, value: value, onChanged: onChanged, - items: [for (final option in options) DropdownMenuItem(value: option, child: Text(labelBuilder(option)))], + selectedItemBuilder: (context) => [ + for (final option in options) + Align(alignment: AlignmentDirectional.centerEnd, child: _buildOption(context, option)), + ], + items: [ + for (final option in options) + DropdownMenuItem( + value: option, + alignment: AlignmentDirectional.centerEnd, + child: Align(alignment: AlignmentDirectional.centerEnd, child: _buildOption(context, option)), + ), + ], ), ), ); + + Widget _buildOption(BuildContext context, T option) => + optionBuilder?.call(context, option) ?? Text(labelBuilder(option), textAlign: TextAlign.right); } diff --git a/test/features/settings/presentation/settings_screen_test.dart b/test/features/settings/presentation/settings_screen_test.dart index 6a1c434..e869fda 100644 --- a/test/features/settings/presentation/settings_screen_test.dart +++ b/test/features/settings/presentation/settings_screen_test.dart @@ -237,18 +237,30 @@ void main() { await tester.pumpWidget(buildSubject()); await tester.pumpAndSettle(); - final headingDropdown = tester.widget>( - find.byType(DropdownButton), + final headingFinder = find.byType(DropdownButton); + final contentFinder = find.byType(DropdownButton); + final codeFinder = find.byType(DropdownButton); + final headingDropdown = tester.widget>(headingFinder); + expect(headingDropdown.alignment, AlignmentDirectional.centerEnd); + _expectRightAlignedSelectedFontLabel( + headingDropdown.selectedItemBuilder!(tester.element(headingFinder)).first, + 'Lora', ); headingDropdown.onChanged?.call(AppHeadingFontFamily.merriweather); - final contentDropdown = tester.widget>( - find.byType(DropdownButton), + final contentDropdown = tester.widget>(contentFinder); + expect(contentDropdown.alignment, AlignmentDirectional.centerEnd); + _expectRightAlignedSelectedFontLabel( + contentDropdown.selectedItemBuilder!(tester.element(contentFinder)).first, + 'Google Sans', ); contentDropdown.onChanged?.call(AppContentFontFamily.openSans); - final codeDropdown = tester.widget>( - find.byType(DropdownButton), + final codeDropdown = tester.widget>(codeFinder); + expect(codeDropdown.alignment, AlignmentDirectional.centerEnd); + _expectRightAlignedSelectedFontLabel( + codeDropdown.selectedItemBuilder!(tester.element(codeFinder)).first, + 'Google Sans Code', ); codeDropdown.onChanged?.call(AppCodeFontFamily.sourceCodePro); @@ -802,6 +814,17 @@ String _buildJwt({required String aud, required String sub, required String clie return '$header.$payload.signature'; } +void _expectRightAlignedSelectedFontLabel(Widget widget, String label) { + expect(widget, isA()); + final align = widget as Align; + expect(align.alignment, AlignmentDirectional.centerEnd); + expect(align.child, isA()); + final text = align.child! as Text; + expect(text.data, label); + expect(text.textAlign, TextAlign.right); + expect(text.style, isNotNull); +} + String _base64UrlEncode(Map value) { return base64Url.encode(utf8.encode(jsonEncode(value))).replaceAll('=', ''); } -- 2.51.2