feat: adding game hud

lib/game/view/game_hud.dart

@@ -0,0 +1,40 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:pinball/game/game.dart';
+
+class GameHud extends StatelessWidget {
+  const GameHud({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    final state = context.watch<GameBloc>().state;
+
+    return Container(
+      color: Colors.redAccent,
+      width: 200,
+      height: 100,
+      padding: const EdgeInsets.all(16),
+      child: Row(
+        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+        children: [
+          Text(
+            '${state.score}',
+            style: Theme.of(context).textTheme.headline3,
+          ),
+          Column(
+            children: [
+              for (var i = 0; i < state.balls; i++)
+                const Padding(
+                  padding: EdgeInsets.only(top: 6),
+                  child: CircleAvatar(
+                    radius: 8,
+                    backgroundColor: Colors.black,
+                  ),
+                ),
+            ],
+          ),
+        ],
+      ),
+    );
+  }
+}

lib/game/view/pinball_game_page.dart

@@ -56,7 +56,18 @@ class _PinballGameViewState extends State<PinballGameView> {
           );
         }
       },
-      child: GameWidget<PinballGame>(game: _game),
+      child: Stack(
+        children: [
+          Positioned.fill(
+            child: GameWidget<PinballGame>(game: _game),
+          ),
+          const Positioned(
+            top: 8,
+            left: 8,
+            child: GameHud(),
+          ),
+        ],
+      ),
     );
   }
 }

lib/game/view/view.dart

@@ -1,2 +1,3 @@
+export 'game_hud.dart';
 export 'pinball_game_page.dart';
 export 'widgets/widgets.dart';

test/game/view/game_hud_test.dart

@@ -0,0 +1,32 @@
+// ignore_for_file: prefer_const_constructors
+
+import 'package:bloc_test/bloc_test.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:pinball/game/game.dart';
+import '../../helpers/helpers.dart';
+
+void main() {
+  group('GameHud', () {
+    testWidgets(
+      'renders the current score and balls',
+      (tester) async {
+        final state = GameState(score: 10, balls: 2);
+        final gameBloc = MockGameBloc();
+        whenListen(
+          gameBloc,
+          Stream.value(state),
+          initialState: state,
+        );
+
+        await tester.pumpApp(
+          GameHud(),
+          gameBloc: gameBloc,
+        );
+
+        expect(find.text('10'), findsOneWidget);
+        expect(find.byType(CircleAvatar), findsNWidgets(2));
+      },
+    );
+  });
+}

test/game/view/pinball_game_page_test.dart

@@ -48,7 +48,7 @@ void main() {
   });
 
   group('PinballGameView', () {
-    testWidgets('renders game', (tester) async {
+    testWidgets('renders game and a hud', (tester) async {
       final gameBloc = MockGameBloc();
       whenListen(
         gameBloc,
@@ -61,6 +61,10 @@ void main() {
         find.byWidgetPredicate((w) => w is GameWidget<PinballGame>),
         findsOneWidget,
       );
+      expect(
+        find.byType(GameHud),
+        findsOneWidget,
+      );
     });
 
     testWidgets(