diff --git a/lib/presentation/views/main_menu/game_history_view.dart b/lib/presentation/views/main_menu/game_history_view.dart index 8cd7882..e3b2aeb 100644 --- a/lib/presentation/views/main_menu/game_history_view.dart +++ b/lib/presentation/views/main_menu/game_history_view.dart @@ -1,7 +1,11 @@ import 'package:flutter/material.dart'; -import 'package:game_tracker/core/custom_theme.dart'; +import 'package:game_tracker/data/db/database.dart'; +import 'package:game_tracker/data/dto/game.dart'; +import 'package:game_tracker/data/dto/group.dart'; +import 'package:game_tracker/data/dto/player.dart'; import 'package:game_tracker/presentation/widgets/tiles/game_history_tile.dart'; -import 'package:game_tracker/presentation/widgets/top_centered_message.dart'; +import 'package:provider/provider.dart'; +import 'package:skeletonizer/skeletonizer.dart'; class GameHistoryView extends StatefulWidget { const GameHistoryView({super.key}); @@ -11,194 +15,92 @@ class GameHistoryView extends StatefulWidget { } class _GameHistoryViewState extends State { - final allGameData = [ - { - 'game': 'Schach', - 'title': 'Abendpartie', - 'players': 2, - 'group': 'Familie', - 'date': '01.06.2024', - }, - { - 'game': 'Monopoly', - 'title': 'Wochenendspaß mit Gras du Saas', - 'players': 4, - 'group': 'Freunde', - 'date': '28.05.2024', - }, - { - 'game': 'Catan', - 'title': 'Strategieabend', - 'players': 3, - 'group': 'Brettspieler', - 'date': '25.05.2024', - }, - { - 'game': 'Uno', - 'title': 'Schnelle Runde', - 'players': 5, - 'group': 'Kollegen', - 'date': '22.05.2024', - }, - { - 'game': 'Poker', - 'title': 'Freitagspoker', - 'players': 6, - 'group': 'Pokerclub', - 'date': '20.05.2024', - }, - { - 'game': 'Scrabble', - 'title': 'Wortschlacht', - 'players': 4, - 'group': 'Familie', - 'date': '18.05.2024', - }, - { - 'game': 'Risiko', - 'title': 'Weltherrschaft', - 'players': 5, - 'group': 'Strategiegruppe', - 'date': '15.05.2024', - }, - { - 'game': 'Zug um Zug', - 'title': 'Zug-Abenteuer', - 'players': 4, - 'group': 'Reisende', - 'date': '12.05.2024', - }, - { - 'game': 'Carcassonne', - 'title': 'Plättchenlegen', - 'players': 3, - 'group': 'Brettspieler', - 'date': '10.05.2024', - }, - { - 'game': 'Pandemie', - 'title': 'Welt retten', - 'players': 4, - 'group': 'Koop-Team', - 'date': '08.05.2024', - }, - { - 'game': 'Cluedo', - 'title': 'Krimiabend', - 'players': 6, - 'group': 'Detektive', - 'date': '05.05.2024', - }, - { - 'game': 'Dixit', - 'title': 'Fantasiespiel', - 'players': 5, - 'group': 'Künstler', - 'date': '02.05.2024', - }, - { - 'game': 'Azul', - 'title': 'Plättchenmeister', - 'players': 4, - 'group': 'Familie', - 'date': '30.04.2024', - }, - { - 'game': 'Splendor', - 'title': 'Edelsteinhändler', - 'players': 3, - 'group': 'Freunde', - 'date': '28.04.2024', - }, - { - 'game': '7 Wonders', - 'title': 'Antike Reiche', - 'players': 7, - 'group': 'Geschichtsfreunde', - 'date': '25.04.2024', - }, - ]; - late List> suggestedGameData; + late Future> _gameListFuture; + late final AppDatabase db; + + late final List skeletonData = List.filled( + 2, + Game( + name: 'Skeleton Game', + group: Group( + name: 'Skeleton Group', + members: [ + Player(name: 'Skeleton Player 1'), + Player(name: 'Skeleton Player 2'), + ], + ), + winner: Player(name: 'Skeleton Player 1'), + ), + ); @override void initState() { super.initState(); - suggestedGameData = List.from(allGameData); + db = Provider.of(context, listen: false); + _gameListFuture = Future.delayed( + const Duration(milliseconds: 250), + () => db.gameDao.getAllGames(), + ); } @override Widget build(BuildContext context) { - return Scaffold( - backgroundColor: CustomTheme.backgroundColor, - body: Stack( - children: [ - Column( - children: [ - Container(margin: const EdgeInsets.only(bottom: 75)), - Expanded( - child: gameHistoryListView(allGameData, suggestedGameData), - ), - ], - ), - Container( - margin: const EdgeInsets.only(top: 10, bottom: 10, left: 10, right: 10), - child: SearchBar( - leading: const Icon(Icons.search), - onChanged: (value) { - if (value.isEmpty) { - setState(() { - suggestedGameData.clear(); - suggestedGameData.addAll(allGameData); - }); - return; - } - final suggestions = allGameData.where((currentGame) { - return currentGame['game'].toString().toLowerCase().contains( - value.toLowerCase(), - ) || - currentGame['title'].toString().toLowerCase().contains( - value.toLowerCase(), - ) || - currentGame['group'].toString().toLowerCase().contains( - value.toLowerCase(), - ); - }); - setState(() { - suggestedGameData.clear(); - suggestedGameData.addAll(suggestions); - }); - }, + return FutureBuilder>( + future: _gameListFuture, + builder: (BuildContext context, AsyncSnapshot> snapshot) { + if (snapshot.hasError) { + return const Center( + heightFactor: 4, + child: Text( + 'Error while loading recent games.', ), + ); + } + if (snapshot.connectionState == ConnectionState.done && + (!snapshot.hasData || snapshot.data!.isEmpty)) { + return const Center( + heightFactor: 4, + child: Text('No recent games available.'), + ); + } + + final bool isLoading = snapshot.connectionState == ConnectionState.waiting; + final List games = (isLoading + ? skeletonData + : (snapshot.data ?? []) + ..sort((a, b) => b.createdAt.compareTo(a.createdAt))) + .take(2) + .toList(); + + return Skeletonizer( + effect: PulseEffect( + from: Colors.grey[800]!, + to: Colors.grey[600]!, + duration: const Duration(milliseconds: 800), ), - ], - ), + enabled: isLoading, + enableSwitchAnimation: true, + switchAnimationConfig: const SwitchAnimationConfig( + duration: Duration(milliseconds: 200), + switchInCurve: Curves.linear, + switchOutCurve: Curves.linear, + transitionBuilder: AnimatedSwitcher.defaultTransitionBuilder, + layoutBuilder: AnimatedSwitcher.defaultLayoutBuilder, + ), + child: ListView.builder( + padding: const EdgeInsets.only(bottom: 85), + itemCount: games.length + 1, + itemBuilder: (BuildContext context, int index) { + if (index == games.length) { + return SizedBox( + height: MediaQuery.paddingOf(context).bottom - 20, + ); + } + return GameHistoryTile(game: games[index]); + }, + ), + ); + }, ); } -} - -Widget gameHistoryListView(allGameData, suggestedGameData) { - if (suggestedGameData.isEmpty && allGameData.isEmpty) { - return const TopCenteredMessage(icon: Icons.error, title: 'Keine Spiele erstellt', message: '',); - } else if (suggestedGameData.isEmpty) { - return const TopCenteredMessage(icon: Icons.error, title: 'Keine Spiele mit den Suchparametern gefunden', message: '',); - } - - return ListView.separated( - padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0), - itemCount: suggestedGameData.length, - separatorBuilder: (context, index) => const Padding( - padding: EdgeInsets.symmetric(vertical: 8.0), - child: Divider(), - ), - itemBuilder: (context, index) { - final currentGame = suggestedGameData[index]; - return GameHistoryTile( - gameTitle: currentGame['title'], - gameType: currentGame['game'], - date: currentGame['date'], - groupName: currentGame['group'], - winner: 'ich', - ); - }, - ); -} +} \ No newline at end of file