Fixed text overflow

lib/presentation/views/main_menu/create_game/choose_game_view.dart

@@ -38,9 +38,7 @@ class _ChooseGameViewState extends State<ChooseGameView> {
         leading: IconButton(
           icon: const Icon(Icons.arrow_back_ios),
           onPressed: () {
-            Navigator.of(
+            Navigator.of(context).pop(selectedGameIndex);
-              context,
-            ).pop(selectedGameIndex == -1 ? null : selectedGameIndex);
           },
         ),
         title: const Text(
@@ -70,7 +68,11 @@ class _ChooseGameViewState extends State<ChooseGameView> {
                   isHighlighted: selectedGameIndex == index,
                   onPressed: () async {
                     setState(() {
+                      if (selectedGameIndex == index) {
+                        selectedGameIndex = -1;
+                      } else {
                         selectedGameIndex = index;
+                      }
                     });
                   },
                 );

lib/presentation/views/main_menu/create_game/choose_group_view.dart

@@ -1,16 +1,17 @@
 import 'package:flutter/material.dart';
 import 'package:game_tracker/core/custom_theme.dart';
 import 'package:game_tracker/data/dto/group.dart';
+import 'package:game_tracker/presentation/widgets/text_input/custom_search_bar.dart';
 import 'package:game_tracker/presentation/widgets/tiles/group_tile.dart';
 
 class ChooseGroupView extends StatefulWidget {
   final List<Group> groups;
-  final int initialGroupIndex;
+  final String initialGroupId;
 
   const ChooseGroupView({
     super.key,
     required this.groups,
-    required this.initialGroupIndex,
+    required this.initialGroupId,
   });
 
   @override
@@ -18,11 +19,15 @@ class ChooseGroupView extends StatefulWidget {
 }
 
 class _ChooseGroupViewState extends State<ChooseGroupView> {
-  late int selectedGroupIndex;
+  late String selectedGroupId;
+  final TextEditingController controller = TextEditingController();
+  final String hintText = 'Group Name';
+  late final List<Group> filteredGroups;
 
   @override
   void initState() {
-    selectedGroupIndex = widget.initialGroupIndex;
+    selectedGroupId = widget.initialGroupId;
+    filteredGroups = [...widget.groups];
     super.initState();
   }
 
@@ -37,9 +42,11 @@ class _ChooseGroupViewState extends State<ChooseGroupView> {
           icon: const Icon(Icons.arrow_back_ios),
           onPressed: () {
             Navigator.of(context).pop(
-              selectedGroupIndex == -1
+              selectedGroupId == ''
                   ? null
-                  : widget.groups[selectedGroupIndex],
+                  : widget.groups.firstWhere(
+                      (group) => group.id == selectedGroupId,
+                    ),
             );
           },
         ),
@@ -49,27 +56,63 @@ class _ChooseGroupViewState extends State<ChooseGroupView> {
         ),
         centerTitle: true,
       ),
-      body: ListView.builder(
+      body: Column(
+        children: [
+          Padding(
+            padding: const EdgeInsets.symmetric(horizontal: 10),
+            child: CustomSearchBar(
+              controller: controller,
+              hintText: hintText,
+              onChanged: (value) {
+                setState(() {
+                  filterGroups(value);
+                });
+              },
+            ),
+          ),
+          Expanded(
+            child: ListView.builder(
               padding: const EdgeInsets.only(bottom: 85),
-        itemCount: widget.groups.length,
+              itemCount: filteredGroups.length,
               itemBuilder: (BuildContext context, int index) {
                 return GestureDetector(
                   onTap: () {
                     setState(() {
-                if (selectedGroupIndex == index) {
+                      if (selectedGroupId != filteredGroups[index].id) {
-                  selectedGroupIndex = -1;
+                        selectedGroupId = filteredGroups[index].id;
                       } else {
-                  selectedGroupIndex = index;
+                        selectedGroupId = '';
                       }
                     });
                   },
                   child: GroupTile(
-              group: widget.groups[index],
+                    group: filteredGroups[index],
-              isHighlighted: selectedGroupIndex == index,
+                    isHighlighted: selectedGroupId == filteredGroups[index].id,
                   ),
                 );
               },
             ),
+          ),
+        ],
+      ),
     );
   }
+
+  /// Filters the groups based on the search query.
+  /// TODO: Maybe implement also targetting player names?
+  void filterGroups(String query) {
+    setState(() {
+      if (query.isEmpty) {
+        filteredGroups.clear();
+        filteredGroups.addAll(widget.groups);
+      } else {
+        filteredGroups.clear();
+        filteredGroups.addAll(
+          widget.groups.where(
+            (group) => group.name.toLowerCase().contains(query.toLowerCase()),
+          ),
+        );
+      }
+    });
+  }
 }

lib/presentation/views/main_menu/create_game/choose_ruleset_view.dart

@@ -4,7 +4,7 @@ import 'package:game_tracker/core/enums.dart';
 import 'package:game_tracker/presentation/widgets/tiles/title_description_list_tile.dart';
 
 class ChooseRulesetView extends StatefulWidget {
-  final List<(Ruleset, String, String)> rulesets;
+  final List<(Ruleset, String)> rulesets;
   final int initialRulesetIndex;
 
   const ChooseRulesetView({
@@ -66,8 +66,8 @@ class _ChooseRulesetViewState extends State<ChooseRulesetView> {
                   }
                 });
               },
-              title: widget.rulesets[index].$2,
+              title: translateRulesetToString(widget.rulesets[index].$1),
-              description: widget.rulesets[index].$3,
+              description: widget.rulesets[index].$2,
               isHighlighted: selectedRulesetIndex == index,
             );
           },

lib/presentation/views/main_menu/create_game/create_game_view.dart

@@ -47,7 +47,7 @@ class _CreateGameViewState extends State<CreateGameView> {
 
   /// The index of the currently selected group in [groupsList] to mark it in
   /// the [ChooseGroupView]
-  int selectedGroupIndex = -1;
+  String selectedGroupId = '';
 
   /// The currently selected ruleset
   Ruleset? selectedRuleset;
@@ -61,28 +61,24 @@ class _CreateGameViewState extends State<CreateGameView> {
   /// The currently selected players
   List<Player>? selectedPlayers;
 
-  /// List of available rulesets with their display names and descriptions
+  /// List of available rulesets with their descriptions
-  /// as tuples of (Ruleset, String, String)
+  /// as tuples of (Ruleset, String)
   /// TODO: Replace when rulesets are implemented
-  List<(Ruleset, String, String)> rulesets = [
+  List<(Ruleset, String)> rulesets = [
     (
       Ruleset.singleWinner,
-      'Single Winner',
       'Exactly one winner is chosen; ties are resolved by a predefined tiebreaker.',
     ),
     (
       Ruleset.singleLoser,
-      'Single Loser',
       'Exactly one loser is determined; last place receives the penalty or consequence.',
     ),
     (
       Ruleset.mostPoints,
-      'Most Points',
       'Traditional ruleset: the player with the most points wins.',
     ),
     (
       Ruleset.leastPoints,
-      'Least Points',
       'Inverse scoring: the player with the fewest points wins.',
     ),
   ];
@@ -129,9 +125,6 @@ class _CreateGameViewState extends State<CreateGameView> {
               child: TextInputField(
                 controller: _gameNameController,
                 hintText: 'Game name',
-                onChanged: (value) {
-                  setState(() {});
-                },
               ),
             ),
             ChooseTile(
@@ -148,11 +141,14 @@ class _CreateGameViewState extends State<CreateGameView> {
                     ),
                   ),
                 );
+                if (selectedGameIndex != -1) {
+                  setState(() {
                     selectedRuleset = games[selectedGameIndex].$3;
                     selectedRulesetIndex = rulesets.indexWhere(
                       (r) => r.$1 == selectedRuleset,
                     );
-                setState(() {});
+                  });
+                }
               },
             ),
             ChooseTile(
@@ -186,13 +182,11 @@ class _CreateGameViewState extends State<CreateGameView> {
                   MaterialPageRoute(
                     builder: (context) => ChooseGroupView(
                       groups: groupsList,
-                      initialGroupIndex: selectedGroupIndex,
+                      initialGroupId: selectedGroupId,
                     ),
                   ),
                 );
-                selectedGroupIndex = groupsList.indexWhere(
+                selectedGroupId = selectedGroup?.id ?? '';
-                  (g) => g.id == selectedGroup?.id,
-                );
                 setState(() {});
               },
             ),
@@ -227,10 +221,6 @@ class _CreateGameViewState extends State<CreateGameView> {
                         group: selectedGroup!,
                         players: selectedPlayers,
                       );
-                      final db = Provider.of<AppDatabase>(
-                        context,
-                        listen: false,
-                      );
                       await db.gameDao.addGame(game: game);
                       if (context.mounted) {
                         Navigator.pushReplacement(
@@ -255,7 +245,7 @@ class _CreateGameViewState extends State<CreateGameView> {
   bool _enableCreateGameButton() {
     return _gameNameController.text.isNotEmpty &&
         (selectedGroup != null ||
-            (selectedPlayers != null && selectedPlayers!.isNotEmpty)) &&
+            (selectedPlayers != null && selectedPlayers!.length > 1)) &&
         selectedRuleset != null;
   }
 }

lib/presentation/widgets/tiles/title_description_list_tile.dart

@@ -38,17 +38,23 @@ class TitleDescriptionListTile extends StatelessWidget {
               mainAxisAlignment: MainAxisAlignment.start,
               crossAxisAlignment: CrossAxisAlignment.center,
               children: [
-                Text(
+                SizedBox(
+                  width: 230,
+                  child: Text(
                     title,
                     overflow: TextOverflow.ellipsis,
+                    maxLines: 1,
+                    softWrap: false,
                     style: const TextStyle(
                       fontWeight: FontWeight.bold,
                       fontSize: 18,
                     ),
                   ),
+                ),
                 if (badgeText != null) ...[
                   const Spacer(),
                   Container(
+                    constraints: const BoxConstraints(maxWidth: 100),
                     margin: const EdgeInsets.only(top: 4),
                     padding: const EdgeInsets.symmetric(
                       vertical: 2,
@@ -60,6 +66,9 @@ class TitleDescriptionListTile extends StatelessWidget {
                     ),
                     child: Text(
                       badgeText!,
+                      overflow: TextOverflow.ellipsis,
+                      maxLines: 1,
+                      softWrap: false,
                       style: const TextStyle(
                         color: Colors.white,
                         fontSize: 12,