lib/presentation/views/main_menu/custom_navigation_bar.dart

@@ -5,6 +5,7 @@ import 'package:game_tracker/presentation/views/main_menu/groups_view.dart';
 import 'package:game_tracker/presentation/views/main_menu/home_view.dart';
 import 'package:game_tracker/presentation/views/main_menu/settings_view.dart';
 import 'package:game_tracker/presentation/views/main_menu/statistics_view.dart';
+import 'package:game_tracker/presentation/widgets/navbar_item.dart';
 
 class CustomNavigationBar extends StatefulWidget {
   const CustomNavigationBar({super.key});
@@ -66,10 +67,10 @@ class _CustomNavigationBarState extends State<CustomNavigationBar>
               child: Row(
                 mainAxisAlignment: MainAxisAlignment.spaceAround,
                 children: <Widget>[
-                  _buildNavItem(Icons.home, 'Home', 0),
+                  NavbarItem(currentIndex: currentIndex, index: 0, icon: Icons.home_rounded, label: 'Home', onTabTapped: onTabTapped),
-                  _buildNavItem(Icons.history, 'Games', 1),
+                  NavbarItem(currentIndex: currentIndex, index: 1, icon: Icons.gamepad_rounded, label: 'Games', onTabTapped: onTabTapped),
-                  _buildNavItem(Icons.groups, 'Groups', 2),
+                  NavbarItem(currentIndex: currentIndex, index: 2, icon: Icons.group_rounded, label: 'Groups', onTabTapped: onTabTapped),
-                  _buildNavItem(Icons.bar_chart, 'Stats', 3),
+                  NavbarItem(currentIndex: currentIndex, index: 3, icon: Icons.bar_chart_rounded, label: 'Stats', onTabTapped: onTabTapped),
                 ],
               ),
             ),
@@ -79,39 +80,6 @@ class _CustomNavigationBarState extends State<CustomNavigationBar>
     );
   }
 
-  Widget _buildNavItem(IconData icon, String label, int index) {
-  final isSelected = currentIndex == index;
-
-  return Expanded(
-    child: GestureDetector(
-      onTap: () => onTabTapped(index),
-      behavior: HitTestBehavior.opaque,
-      child: Padding(
-        padding: const EdgeInsets.symmetric(vertical: 5.0),
-        child: Column(
-          mainAxisSize: MainAxisSize.min,
-          mainAxisAlignment: MainAxisAlignment.center,
-          children: [
-            Icon(
-              icon,
-              color: isSelected ? Colors.white : Colors.black,
-            ),
-            const SizedBox(height: 4),
-            Text(
-              label,
-              style: TextStyle(
-                color: isSelected ? Colors.white : Colors.black,
-                fontSize: 12,
-                fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
-              ),
-            ),
-          ],
-        ),
-      ),
-    ),
-  );
-}
-
   void onTabTapped(int index) {
     setState(() {
       currentIndex = index;

lib/presentation/widgets/navbar_item.dart

@@ -1,7 +1,18 @@
-import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
 
 class NavbarItem extends StatefulWidget {
-  const NavbarItem({super.key});
+
+  final int currentIndex;
+  final int index;
+  final IconData icon;
+  final String label;
+  final Function(int) onTabTapped;
+
+  const NavbarItem(
+        {super.key, required this.currentIndex, required this.index,
+          required this.icon, required this.label, required this.onTabTapped
+        }
+      );
 
   @override
   State<NavbarItem> createState() => _NavbarItemState();
@@ -10,6 +21,36 @@ class NavbarItem extends StatefulWidget {
 class _NavbarItemState extends State<NavbarItem> {
   @override
   Widget build(BuildContext context) {
-    return const Placeholder();
+
+    bool isSelected = widget.currentIndex == widget.index;
+
+    return Expanded(
+      child: GestureDetector(
+        onTap: () => widget.onTabTapped(widget.index),
+        behavior: HitTestBehavior.opaque,
+        child: Padding(
+          padding: const EdgeInsets.symmetric(vertical: 5.0),
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            mainAxisAlignment: MainAxisAlignment.center,
+            children: [
+              Icon(
+                widget.icon,
+                color: isSelected ? Colors.white : Colors.black,
+              ),
+              const SizedBox(height: 4),
+              Text(
+                widget.label,
+                style: TextStyle(
+                  color: isSelected ? Colors.white : Colors.black,
+                  fontSize: 12,
+                  fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
+                ),
+              ),
+            ],
+          ),
+        ),
+      ),
+    );
   }
 }