diff --git a/lib/bottom_bar/view/bottom_bar.dart b/lib/bottom_bar/view/bottom_bar.dart index f8501cc67..647594c7f 100644 --- a/lib/bottom_bar/view/bottom_bar.dart +++ b/lib/bottom_bar/view/bottom_bar.dart @@ -45,38 +45,56 @@ class BottomBarContent extends StatelessWidget { alignment: Alignment.bottomCenter, child: Container( width: double.infinity, + height: 104, padding: const EdgeInsets.symmetric(vertical: 24), color: IoCrosswordColors.darkGray, child: Row( mainAxisAlignment: MainAxisAlignment.center, + crossAxisAlignment: CrossAxisAlignment.stretch, children: [ - OutlinedButton( + FilledButton( onPressed: () { context .read() .playSfx(Assets.music.startButton1); EndGameCheck.openDialog(context); }, - child: Text( - l10n.endGame, - ), + child: Text(l10n.endGame), ), const SizedBox(width: 16), - OutlinedButton.icon( - onPressed: () { - context - .read() - .playSfx(Assets.music.startButton1); - context - .read() - .add(const RandomWordRequested()); - }, - icon: const Icon(Icons.location_searching), - label: Text(l10n.findNewWord), - ), + const FindWordButton(), ], ), ), ); } } + +class FindWordButton extends StatelessWidget { + const FindWordButton({super.key}); + + void _onPressed(BuildContext context) { + context.read().playSfx(Assets.music.startButton1); + context.read().add(const RandomWordRequested()); + } + + @override + Widget build(BuildContext context) { + final layout = IoLayout.of(context); + final l10n = context.l10n; + + switch (layout) { + case IoLayoutData.large: + return OutlinedButton.icon( + onPressed: () => _onPressed(context), + icon: const Icon(Icons.location_searching), + label: Text(l10n.findNewWord), + ); + case IoLayoutData.small: + return OutlinedButton.icon( + onPressed: () => _onPressed(context), + label: Text(l10n.findWord), + ); + } + } +} diff --git a/lib/l10n/arb/app_en.arb b/lib/l10n/arb/app_en.arb index a7fc1e85a..bdd741102 100644 --- a/lib/l10n/arb/app_en.arb +++ b/lib/l10n/arb/app_en.arb @@ -305,7 +305,11 @@ }, "findNewWord": "Find a new word", "@findNewWord": { - "description": "Find new word label" + "description": "Longer label for Find new word button" + }, + "findWord": "Find a word", + "@findWord": { + "description": "Shorter label for Find word button" }, "totalScore": "Total score", "@totalScore": { diff --git a/packages/io_crossword_ui/lib/src/widgets/io_app_bar.dart b/packages/io_crossword_ui/lib/src/widgets/io_app_bar.dart index cef53806d..b2c265972 100644 --- a/packages/io_crossword_ui/lib/src/widgets/io_app_bar.dart +++ b/packages/io_crossword_ui/lib/src/widgets/io_app_bar.dart @@ -63,7 +63,7 @@ class IoAppBar extends StatelessWidget implements PreferredSizeWidget { height: 40, child: switch (layout) { IoLayoutData.small => Padding( - padding: const EdgeInsets.symmetric(horizontal: 32), + padding: const EdgeInsets.symmetric(horizontal: 16), child: CustomMultiChildLayout( delegate: AppBarLayout(), children: [ diff --git a/test/bottom_bar/view/bottom_bar_test.dart b/test/bottom_bar/view/bottom_bar_test.dart index e2c72b9bb..1ef62c3dd 100644 --- a/test/bottom_bar/view/bottom_bar_test.dart +++ b/test/bottom_bar/view/bottom_bar_test.dart @@ -12,6 +12,7 @@ import 'package:io_crossword/end_game/end_game.dart'; import 'package:io_crossword/l10n/l10n.dart'; import 'package:io_crossword/random_word_selection/bloc/random_word_selection_bloc.dart'; import 'package:io_crossword/word_selection/word_selection.dart'; +import 'package:io_crossword_ui/io_crossword_ui.dart'; import 'package:mocktail/mocktail.dart'; import '../../helpers/helpers.dart'; @@ -95,47 +96,6 @@ void main() { }, ); - testWidgets( - 'adds $RandomWordRequested event when find new word button is tapped', - (tester) async { - when(() => wordSelectionBloc.state).thenReturn( - const WordSelectionState.initial(), - ); - - when(() => crosswordBloc.state).thenReturn( - const CrosswordState(mascotVisible: false), - ); - - await tester.pumpApp(widget); - - await tester.tap(find.text(l10n.findNewWord)); - - await tester.pumpAndSettle(); - - verify( - () => randomWordSelectionBloc.add(RandomWordRequested()), - ).called(1); - }, - ); - - testWidgets( - 'plays ${Assets.music.startButton1} when find new word button is tapped', - (tester) async { - when(() => wordSelectionBloc.state).thenReturn( - const WordSelectionState.initial(), - ); - await tester.pumpApp(widget, audioController: audioController); - - await tester.tap(find.text(l10n.findNewWord)); - - await tester.pumpAndSettle(); - - verify( - () => audioController.playSfx(Assets.music.startButton1), - ).called(1); - }, - ); - group('$BottomBarContent', () { testWidgets( 'displays endGame', @@ -179,5 +139,94 @@ void main() { }, ); }); + + group('$FindWordButton', () { + setUp(() { + widget = MultiBlocProvider( + providers: [ + BlocProvider( + create: (_) => randomWordSelectionBloc, + ), + ], + child: FindWordButton(), + ); + }); + + group('for large layout', () { + testWidgets( + 'adds $RandomWordRequested event when find new word button is tapped', + (tester) async { + await tester.pumpApp( + widget, + layout: IoLayoutData.large, + ); + + await tester.tap(find.text(l10n.findNewWord)); + await tester.pumpAndSettle(); + + verify( + () => randomWordSelectionBloc.add(RandomWordRequested()), + ).called(1); + }, + ); + + testWidgets( + 'plays ${Assets.music.startButton1} when find new word button is ' + 'tapped', + (tester) async { + await tester.pumpApp( + widget, + layout: IoLayoutData.large, + audioController: audioController, + ); + + await tester.tap(find.text(l10n.findNewWord)); + await tester.pumpAndSettle(); + + verify( + () => audioController.playSfx(Assets.music.startButton1), + ).called(1); + }, + ); + }); + + group('for small layout', () { + testWidgets( + 'adds $RandomWordRequested event when find new word button is tapped', + (tester) async { + await tester.pumpApp( + widget, + layout: IoLayoutData.small, + ); + + await tester.tap(find.text(l10n.findWord)); + await tester.pumpAndSettle(); + + verify( + () => randomWordSelectionBloc.add(RandomWordRequested()), + ).called(1); + }, + ); + + testWidgets( + 'plays ${Assets.music.startButton1} when find new word button is ' + 'tapped', + (tester) async { + await tester.pumpApp( + widget, + layout: IoLayoutData.small, + audioController: audioController, + ); + + await tester.tap(find.text(l10n.findWord)); + await tester.pumpAndSettle(); + + verify( + () => audioController.playSfx(Assets.music.startButton1), + ).called(1); + }, + ); + }); + }); }); }