Merge pull request #134 from canopas/Mayank/show-match-group-tag

Show match group tag
canopas · Nov 12, 2024 · 0b1ad7a · 0b1ad7a
2 parents 1a2c36b + 00525ab
commit 0b1ad7a
Show file tree

Hide file tree

Showing 7 changed files with 69 additions and 12 deletions.
diff --git a/khelo/assets/locales/app_en.arb b/khelo/assets/locales/app_en.arb
@@ -249,6 +249,8 @@
 
   "tournament_detail_matches_empty_title": "Schedule Your Matches!",
   "tournament_detail_matches_empty_description": "Create matches to kick off your tournament and get the games started!",
+  "tournament_detail_matches_filter_empty_title": "No Results Found",
+  "tournament_detail_matches_filter_empty_description": "No matches match the selected filters. Try adjusting them.",
   "tournament_detail_matches_add_btn": "Add matches",
   "tournament_detail_matches_filter_by_teams_title": "Filter by teams",
   "tournament_detail_matches_filter_all_teams_option": "All Teams",

diff --git a/khelo/lib/components/match_detail_cell.dart b/khelo/lib/components/match_detail_cell.dart
@@ -17,6 +17,7 @@ class MatchDetailCell extends StatelessWidget {
   final MatchModel match;
   final VoidCallback onTap;
   final bool showStatusTag;
+  final bool showTournamentBadge;
   final bool showActionButtons;
   final VoidCallback? onActionTap;
   final Color? backgroundColor;
@@ -27,6 +28,7 @@ class MatchDetailCell extends StatelessWidget {
     required this.onTap,
     this.showStatusTag = true,
     this.showActionButtons = false,
+    this.showTournamentBadge = true,
     this.backgroundColor,
     this.onActionTap,
   });
@@ -80,8 +82,10 @@ class MatchDetailCell extends StatelessWidget {
 
   Widget _matchTimeAndGroundView(BuildContext context) {
     return Row(children: [
-      if (match.tournament_id != null) TournamentBadge(),
-      const SizedBox(width: 8),
+      if (showTournamentBadge && match.tournament_id != null) ...[
+        TournamentBadge(),
+        const SizedBox(width: 8),
+      ],
       Expanded(
         flex: 2,
         child: Text(

diff --git a/khelo/lib/ui/flow/tournament/detail/components/flexible_space.dart b/khelo/lib/ui/flow/tournament/detail/components/flexible_space.dart
@@ -8,7 +8,6 @@ import 'package:khelo/domain/formatter/date_formatter.dart';
 import 'package:palette_generator/palette_generator.dart';
 import 'package:style/extensions/context_extensions.dart';
 import 'package:style/text/app_text_style.dart';
-import 'package:style/theme/colors.dart';
 
 import '../../../../../components/image_avatar.dart';
 import '../../../../../gen/assets.gen.dart';
@@ -104,8 +103,8 @@ class _FlexibleSpaceState extends State<FlexibleSpace> {
                   end: Alignment.bottomCenter,
                   colors: [
                     dominant.withOpacity(0),
-                    dominant.withOpacity(0.5),
-                    dominant,
+                    dominant.withOpacity(0.2),
+                    dominant.withOpacity(0.86),
                   ],
                 ),
               ),
@@ -135,10 +134,10 @@ class _FlexibleSpaceState extends State<FlexibleSpace> {
           size: 80,
           imageUrl: tournament.profile_img_url,
           border: Border.all(
-            color: surfaceLightColor,
+            color: context.colorScheme.outline,
             width: 1.5,
           ),
-          backgroundColor: context.colorScheme.primary,
+          backgroundColor: context.colorScheme.onPrimary,
         ),
         const SizedBox(height: 16),
         SizedBox(

diff --git a/khelo/lib/ui/flow/tournament/detail/components/match_group_tag.dart b/khelo/lib/ui/flow/tournament/detail/components/match_group_tag.dart
@@ -0,0 +1,35 @@
+import 'package:data/api/match/match_model.dart';
+import 'package:flutter/material.dart';
+import 'package:khelo/domain/extensions/enum_extensions.dart';
+import 'package:style/extensions/context_extensions.dart';
+import 'package:style/text/app_text_style.dart';
+
+class MatchGroupTag extends StatelessWidget {
+  final MatchGroup tag;
+
+  const MatchGroupTag({
+    super.key,
+    required this.tag,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return RotatedBox(
+      quarterTurns: 3,
+      child: Container(
+        padding: EdgeInsets.symmetric(horizontal: 12, vertical: 2),
+        decoration: BoxDecoration(
+          color: context.colorScheme.primary.withOpacity(0.2),
+          borderRadius: BorderRadius.circular(30),
+        ),
+        child: Text(
+          tag.getString(context),
+          style: TextStyle(
+            fontFamily: AppTextStyle.poppinsFontFamily,
+            fontSize: 10,
+          ),
+        ),
+      ),
+    );
+  }
+}
diff --git a/khelo/lib/ui/flow/tournament/detail/tabs/tournament_detail_matches_tab.dart b/khelo/lib/ui/flow/tournament/detail/tabs/tournament_detail_matches_tab.dart
@@ -26,7 +26,7 @@ class TournamentDetailMatchesTab extends ConsumerWidget {
   Widget build(BuildContext context, WidgetRef ref) {
     final state = ref.watch(tournamentDetailStateProvider);
 
-    if (state.filteredMatches.isEmpty) {
+    if (state.filteredMatches.isEmpty && state.tournament!.matches.isEmpty) {
       return EmptyScreen(
         title: context.l10n.tournament_detail_matches_empty_title,
         description: context.l10n.tournament_detail_matches_empty_description,
@@ -53,11 +53,22 @@ class TournamentDetailMatchesTab extends ConsumerWidget {
           filterValue: state.matchFilter ??
               context.l10n.tournament_detail_matches_filter_all_teams_option,
         ),
+        if (state.filteredMatches.isEmpty)
+          SizedBox(
+            height: context.mediaQuerySize.height / 2.5,
+            child: EmptyScreen(
+              title: context.l10n.tournament_detail_matches_filter_empty_title,
+              description: context
+                  .l10n.tournament_detail_matches_filter_empty_description,
+              isShowButton: false,
+            ),
+          ),
         ...state.filteredMatches.map(
           (match) {
             return Padding(
               padding: const EdgeInsets.symmetric(vertical: 8.0),
               child: MatchDetailCell(
+                showTournamentBadge: false,
                 backgroundColor: context.colorScheme.surface,
                 match: match,
                 onTap: () =>

diff --git a/khelo/lib/ui/flow/tournament/detail/tabs/tournament_detail_overview_tab.dart b/khelo/lib/ui/flow/tournament/detail/tabs/tournament_detail_overview_tab.dart
@@ -9,6 +9,7 @@ import 'package:khelo/domain/extensions/enum_extensions.dart';
 import 'package:khelo/domain/extensions/string_extensions.dart';
 import 'package:khelo/domain/formatter/date_formatter.dart';
 import 'package:khelo/ui/app_route.dart';
+import 'package:khelo/ui/flow/tournament/detail/components/match_group_tag.dart';
 import 'package:style/animations/on_tap_scale.dart';
 import 'package:style/extensions/context_extensions.dart';
 import 'package:style/text/app_text_style.dart';
@@ -63,17 +64,22 @@ class TournamentDetailOverviewTab extends ConsumerWidget {
   }
 
   Widget _matchCellView(BuildContext context, MatchModel match) {
+    final showMatchGroup =
+        match.match_group != null && match.match_group != MatchGroup.round;
     return OnTapScale(
       onTap: () => AppRoute.matchDetailTab(matchId: match.id).push(context),
       child: Container(
-        padding: EdgeInsets.symmetric(horizontal: 16, vertical: 24),
+        padding: showMatchGroup
+            ? EdgeInsets.only(top: 8, bottom: 8, right: 16)
+            : EdgeInsets.symmetric(horizontal: 16, vertical: 24),
         margin: EdgeInsets.symmetric(vertical: 8),
         decoration: BoxDecoration(
           color: context.colorScheme.surface,
           borderRadius: BorderRadius.circular(16),
         ),
         child: Row(
           children: [
+            if (showMatchGroup) MatchGroupTag(tag: match.match_group!),
             _buildTeamInfo(context, team: match.teams.first.team),
             const Spacer(),
             if (match.matchResult != null) ...[

diff --git a/khelo/lib/ui/flow/tournament/detail/tournament_detail_screen.dart b/khelo/lib/ui/flow/tournament/detail/tournament_detail_screen.dart
@@ -249,8 +249,9 @@ class _TournamentDetailScreenState
             shape: BoxShape.circle,
             color: context.colorScheme.containerHighOnSurface.withOpacity(0.4),
           ),
+          alignment: Alignment.center,
           child: Icon(
-            Platform.isIOS ? Icons.arrow_back_ios : Icons.arrow_back,
+            Platform.isIOS ? Icons.arrow_back_ios_new : Icons.arrow_back,
             size: 20,
             color: context.colorScheme.textPrimary,
           ),
@@ -262,8 +263,7 @@ class _TournamentDetailScreenState
     if (state.tournament == null) {
       return;
     }
-    if (state.tournament!.teams.length >=
-        state.tournament!.type.minTeamReq) {
+    if (state.tournament!.teams.length >= state.tournament!.type.minTeamReq) {
       await AppRoute.matchSelection(tournamentId: state.tournament!.id)
           .push(context);
     } else {