Initial commit: Flutter app + PHP/MySQL backend on Hostinger
Replaces Firebase with a self-hosted PHP/MySQL API served from winded.prymsolutions.com. Includes full backend (schema, auth, events, teams, brackets, suggestions, stats, media, file upload) and updated Flutter repositories and domain models. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,351 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
|
||||
import '../application/events_notifier.dart';
|
||||
import '../domain/event.dart';
|
||||
import '../infrastructure/events_repository.dart';
|
||||
import 'widgets/countdown_timer.dart';
|
||||
import 'widgets/registration_button.dart';
|
||||
|
||||
class EventDetailScreen extends ConsumerWidget {
|
||||
const EventDetailScreen({super.key, required this.eventId});
|
||||
|
||||
final String eventId;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final eventsAsync = ref.watch(eventsStreamProvider);
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
leading: IconButton(
|
||||
icon: const Icon(Icons.arrow_back),
|
||||
onPressed: () {
|
||||
if (context.canPop()) {
|
||||
context.pop();
|
||||
} else {
|
||||
context.go('/events');
|
||||
}
|
||||
},
|
||||
),
|
||||
title: const Text('Event details'),
|
||||
),
|
||||
body: eventsAsync.when(
|
||||
loading: () => const Center(child: CircularProgressIndicator()),
|
||||
error: (error, _) => _NotFound(
|
||||
message: 'Could not load event: $error',
|
||||
),
|
||||
data: (_) {
|
||||
final event = ref.watch(eventByIdProvider(eventId));
|
||||
if (event == null) {
|
||||
return const _NotFound(message: 'Event not found.');
|
||||
}
|
||||
return _EventDetailBody(event: event);
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _EventDetailBody extends StatelessWidget {
|
||||
const _EventDetailBody({required this.event});
|
||||
|
||||
final Event event;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
final scheme = theme.colorScheme;
|
||||
|
||||
final dateLabel =
|
||||
DateFormat('EEEE, MMMM d, y · h:mm a').format(event.date);
|
||||
final deadlineLabel =
|
||||
DateFormat('EEE, MMM d · h:mm a').format(event.registrationDeadline);
|
||||
|
||||
return LayoutBuilder(
|
||||
builder: (context, constraints) {
|
||||
final isWide = constraints.maxWidth > 720;
|
||||
final horizontalPadding = isWide ? 32.0 : 16.0;
|
||||
|
||||
return SingleChildScrollView(
|
||||
padding: EdgeInsets.symmetric(
|
||||
horizontal: horizontalPadding,
|
||||
vertical: 16,
|
||||
),
|
||||
child: Center(
|
||||
child: ConstrainedBox(
|
||||
constraints: const BoxConstraints(maxWidth: 760),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
_Header(
|
||||
event: event,
|
||||
dateLabel: dateLabel,
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
Align(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: CountdownTimer(
|
||||
target: event.date,
|
||||
compact: false,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
Text(
|
||||
'About this event',
|
||||
style: theme.textTheme.titleMedium?.copyWith(
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
event.description,
|
||||
style: theme.textTheme.bodyLarge?.copyWith(
|
||||
height: 1.45,
|
||||
color: scheme.onSurface,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
_RegistrationSection(
|
||||
event: event,
|
||||
deadlineLabel: deadlineLabel,
|
||||
),
|
||||
const SizedBox(height: 32),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _Header extends StatelessWidget {
|
||||
const _Header({required this.event, required this.dateLabel});
|
||||
|
||||
final Event event;
|
||||
final String dateLabel;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
final scheme = theme.colorScheme;
|
||||
|
||||
return Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: scheme.primaryContainer,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
if (event.isCancelled)
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(bottom: 8),
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 10,
|
||||
vertical: 4,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
color: scheme.error,
|
||||
borderRadius: BorderRadius.circular(999),
|
||||
),
|
||||
child: Text(
|
||||
'Cancelled',
|
||||
style: theme.textTheme.labelMedium?.copyWith(
|
||||
color: scheme.onError,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
Text(
|
||||
event.title,
|
||||
style: theme.textTheme.headlineSmall?.copyWith(
|
||||
color: scheme.onPrimaryContainer,
|
||||
fontWeight: FontWeight.w800,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.calendar_today_outlined,
|
||||
size: 18,
|
||||
color: scheme.onPrimaryContainer,
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: Text(
|
||||
dateLabel,
|
||||
style: theme.textTheme.bodyLarge?.copyWith(
|
||||
color: scheme.onPrimaryContainer,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 6),
|
||||
Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.place_outlined,
|
||||
size: 18,
|
||||
color: scheme.onPrimaryContainer,
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: Text(
|
||||
event.location,
|
||||
style: theme.textTheme.bodyLarge?.copyWith(
|
||||
color: scheme.onPrimaryContainer,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _RegistrationSection extends StatelessWidget {
|
||||
const _RegistrationSection({
|
||||
required this.event,
|
||||
required this.deadlineLabel,
|
||||
});
|
||||
|
||||
final Event event;
|
||||
final String deadlineLabel;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
final scheme = theme.colorScheme;
|
||||
final ratio = event.maxTeams == 0
|
||||
? 0.0
|
||||
: (event.teamsRegistered / event.maxTeams).clamp(0.0, 1.0).toDouble();
|
||||
final deadlinePassed =
|
||||
DateTime.now().isAfter(event.registrationDeadline);
|
||||
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: scheme.surfaceContainerHighest,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'Registration',
|
||||
style: theme.textTheme.titleMedium?.copyWith(
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Row(
|
||||
children: [
|
||||
Icon(Icons.groups_outlined, color: scheme.primary),
|
||||
const SizedBox(width: 8),
|
||||
Text(
|
||||
'${event.teamsRegistered} / ${event.maxTeams} teams',
|
||||
style: theme.textTheme.titleLarge?.copyWith(
|
||||
color: scheme.primary,
|
||||
fontWeight: FontWeight.w800,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
ClipRRect(
|
||||
borderRadius: BorderRadius.circular(999),
|
||||
child: LinearProgressIndicator(
|
||||
value: ratio,
|
||||
minHeight: 8,
|
||||
backgroundColor: scheme.surfaceContainer,
|
||||
valueColor: AlwaysStoppedAnimation<Color>(scheme.primary),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.timer_off_outlined,
|
||||
size: 16,
|
||||
color: scheme.onSurfaceVariant,
|
||||
),
|
||||
const SizedBox(width: 6),
|
||||
Expanded(
|
||||
child: Text(
|
||||
deadlinePassed
|
||||
? 'Registration closed $deadlineLabel'
|
||||
: 'Registration closes $deadlineLabel',
|
||||
style: theme.textTheme.bodySmall?.copyWith(
|
||||
color: scheme.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
RegistrationButton(
|
||||
fullWidth: true,
|
||||
enabled: !deadlinePassed && !event.isCancelled,
|
||||
),
|
||||
if (event.maxTeams > 0 &&
|
||||
event.teamsRegistered >= event.maxTeams) ...[
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
'Preferred headcount reached — extras are still welcome to drop in.',
|
||||
style: theme.textTheme.bodySmall?.copyWith(
|
||||
color: scheme.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _NotFound extends StatelessWidget {
|
||||
const _NotFound({required this.message});
|
||||
|
||||
final String message;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
return Center(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(32),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Icon(
|
||||
Icons.search_off,
|
||||
size: 64,
|
||||
color: theme.colorScheme.onSurfaceVariant,
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Text(message, style: theme.textTheme.titleMedium),
|
||||
const SizedBox(height: 16),
|
||||
FilledButton.tonalIcon(
|
||||
onPressed: () => context.go('/events'),
|
||||
icon: const Icon(Icons.arrow_back),
|
||||
label: const Text('Back to events'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,160 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
|
||||
import '../domain/event.dart';
|
||||
import '../infrastructure/events_repository.dart';
|
||||
import 'widgets/event_card.dart';
|
||||
|
||||
class EventsScreen extends ConsumerWidget {
|
||||
const EventsScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final eventsAsync = ref.watch(eventsStreamProvider);
|
||||
|
||||
return DefaultTabController(
|
||||
length: 3,
|
||||
child: Scaffold(
|
||||
appBar: AppBar(
|
||||
title: const Text('Events'),
|
||||
actions: [
|
||||
IconButton(
|
||||
icon: const Icon(Icons.search),
|
||||
tooltip: 'Search & filter',
|
||||
onPressed: () {},
|
||||
),
|
||||
],
|
||||
bottom: const TabBar(
|
||||
tabs: <Tab>[
|
||||
Tab(text: 'ALL'),
|
||||
Tab(text: 'TOURNAMENTS'),
|
||||
Tab(text: 'PICK-UP'),
|
||||
],
|
||||
),
|
||||
),
|
||||
body: eventsAsync.when(
|
||||
loading: () => const Center(child: CircularProgressIndicator()),
|
||||
error: (error, _) => _ErrorState(
|
||||
message: error.toString(),
|
||||
onRetry: () => ref.invalidate(eventsStreamProvider),
|
||||
),
|
||||
data: (events) {
|
||||
return TabBarView(
|
||||
children: <Widget>[
|
||||
_EventsList(
|
||||
events: events,
|
||||
onRefresh: () => ref.invalidate(eventsStreamProvider),
|
||||
),
|
||||
_EventsList(
|
||||
events: events
|
||||
.where((e) => e.category == EventCategory.tournament)
|
||||
.toList(growable: false),
|
||||
onRefresh: () => ref.invalidate(eventsStreamProvider),
|
||||
),
|
||||
_EventsList(
|
||||
events: events
|
||||
.where((e) => e.category == EventCategory.pickup)
|
||||
.toList(growable: false),
|
||||
onRefresh: () => ref.invalidate(eventsStreamProvider),
|
||||
),
|
||||
],
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _EventsList extends StatelessWidget {
|
||||
const _EventsList({required this.events, required this.onRefresh});
|
||||
|
||||
final List<Event> events;
|
||||
final VoidCallback onRefresh;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
if (events.isEmpty) return const _EmptyState();
|
||||
return RefreshIndicator(
|
||||
onRefresh: () async => onRefresh(),
|
||||
child: ListView.builder(
|
||||
padding: const EdgeInsets.symmetric(vertical: 8),
|
||||
itemCount: events.length,
|
||||
itemBuilder: (context, index) => EventCard(event: events[index]),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _EmptyState extends StatelessWidget {
|
||||
const _EmptyState();
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
return Center(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(32),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Icon(
|
||||
Icons.sports_soccer,
|
||||
size: 64,
|
||||
color: theme.colorScheme.onSurfaceVariant,
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Text('No events scheduled', style: theme.textTheme.titleMedium),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
'Check back soon — new pick-up games and tournaments are posted regularly.',
|
||||
textAlign: TextAlign.center,
|
||||
style: theme.textTheme.bodyMedium?.copyWith(
|
||||
color: theme.colorScheme.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _ErrorState extends StatelessWidget {
|
||||
const _ErrorState({required this.message, required this.onRetry});
|
||||
|
||||
final String message;
|
||||
final VoidCallback onRetry;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
return Center(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(32),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Icon(Icons.error_outline, size: 64, color: theme.colorScheme.error),
|
||||
const SizedBox(height: 16),
|
||||
Text('Could not load events', style: theme.textTheme.titleMedium),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
message,
|
||||
textAlign: TextAlign.center,
|
||||
style: theme.textTheme.bodySmall?.copyWith(
|
||||
color: theme.colorScheme.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
FilledButton.tonalIcon(
|
||||
onPressed: onRetry,
|
||||
icon: const Icon(Icons.refresh),
|
||||
label: const Text('Try again'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,147 @@
|
||||
import 'dart:async';
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// Live-updating countdown to a target [DateTime].
|
||||
///
|
||||
/// Rebuilds once per second and renders one of:
|
||||
/// * "in 3d 4h" — when more than a day out
|
||||
/// * "in 4h 12m" — when same-day
|
||||
/// * "in 12m 30s" — within the hour
|
||||
/// * "Starting now!" — within the final minute window
|
||||
/// * "Ended" — once the target has passed by more than the [grace] window
|
||||
///
|
||||
/// Pass [compact] true to render only the duration text (used in cards);
|
||||
/// false renders a labelled card-friendly block (used on the detail screen).
|
||||
class CountdownTimer extends StatefulWidget {
|
||||
const CountdownTimer({
|
||||
super.key,
|
||||
required this.target,
|
||||
this.compact = true,
|
||||
this.grace = const Duration(minutes: 60),
|
||||
});
|
||||
|
||||
final DateTime target;
|
||||
final bool compact;
|
||||
|
||||
/// How long after [target] we still show "Starting now!" before flipping
|
||||
/// to "Ended". Defaults to an hour so an in-progress match stays visible.
|
||||
final Duration grace;
|
||||
|
||||
@override
|
||||
State<CountdownTimer> createState() => _CountdownTimerState();
|
||||
}
|
||||
|
||||
class _CountdownTimerState extends State<CountdownTimer> {
|
||||
Timer? _timer;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_timer = Timer.periodic(const Duration(seconds: 1), (_) {
|
||||
if (mounted) setState(() {});
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_timer?.cancel();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
final scheme = theme.colorScheme;
|
||||
final now = DateTime.now();
|
||||
final diff = widget.target.difference(now);
|
||||
|
||||
final label = _formatLabel(diff);
|
||||
final isLive = diff.isNegative && diff.abs() < widget.grace;
|
||||
final isEnded = diff.isNegative && diff.abs() >= widget.grace;
|
||||
|
||||
final Color bg;
|
||||
final Color fg;
|
||||
if (isEnded) {
|
||||
bg = scheme.surfaceContainerHighest;
|
||||
fg = scheme.onSurfaceVariant;
|
||||
} else if (isLive) {
|
||||
bg = scheme.tertiaryContainer;
|
||||
fg = scheme.onTertiaryContainer;
|
||||
} else {
|
||||
bg = scheme.primaryContainer;
|
||||
fg = scheme.onPrimaryContainer;
|
||||
}
|
||||
|
||||
if (widget.compact) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
|
||||
decoration: BoxDecoration(
|
||||
color: bg,
|
||||
borderRadius: BorderRadius.circular(999),
|
||||
),
|
||||
child: Text(
|
||||
label,
|
||||
style: theme.textTheme.labelSmall?.copyWith(
|
||||
color: fg,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
||||
decoration: BoxDecoration(
|
||||
color: bg,
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Icon(
|
||||
isEnded
|
||||
? Icons.event_busy
|
||||
: isLive
|
||||
? Icons.sports_soccer
|
||||
: Icons.timer_outlined,
|
||||
color: fg,
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Text(
|
||||
label,
|
||||
style: theme.textTheme.titleMedium?.copyWith(
|
||||
color: fg,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
String _formatLabel(Duration diff) {
|
||||
if (diff.isNegative) {
|
||||
if (diff.abs() < widget.grace) return 'Starting now!';
|
||||
return 'Ended';
|
||||
}
|
||||
if (diff.inSeconds <= 60) return 'Starting now!';
|
||||
|
||||
if (diff.inDays >= 1) {
|
||||
final days = diff.inDays;
|
||||
final hours = diff.inHours - days * 24;
|
||||
if (hours == 0) {
|
||||
return 'in ${days}d';
|
||||
}
|
||||
return 'in ${days}d ${hours}h';
|
||||
}
|
||||
if (diff.inHours >= 1) {
|
||||
final hours = diff.inHours;
|
||||
final minutes = diff.inMinutes - hours * 60;
|
||||
return 'in ${hours}h ${minutes}m';
|
||||
}
|
||||
final minutes = diff.inMinutes;
|
||||
final seconds = diff.inSeconds - minutes * 60;
|
||||
return 'in ${minutes}m ${seconds}s';
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,204 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
|
||||
import '../../domain/event.dart';
|
||||
import 'countdown_timer.dart';
|
||||
|
||||
/// Material 3 card representing a single [Event] in the events list.
|
||||
///
|
||||
/// Tap navigates to `/events/:id`. Visual emphasis is given to the title,
|
||||
/// the countdown chip, and the registration headcount.
|
||||
class EventCard extends StatelessWidget {
|
||||
const EventCard({super.key, required this.event});
|
||||
|
||||
final Event event;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
final scheme = theme.colorScheme;
|
||||
|
||||
final dateLabel = DateFormat('EEE, MMM d · h:mm a').format(event.date);
|
||||
final isFull =
|
||||
event.teamsRegistered >= event.maxTeams && event.maxTeams > 0;
|
||||
|
||||
return Card(
|
||||
clipBehavior: Clip.antiAlias,
|
||||
margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
|
||||
child: InkWell(
|
||||
onTap: () => context.go('/events/${event.id}'),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Expanded(
|
||||
child: Text(
|
||||
event.title,
|
||||
style: theme.textTheme.titleLarge?.copyWith(
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
CountdownTimer(target: event.date),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Row(
|
||||
children: <Widget>[
|
||||
_CategoryChip(category: event.category),
|
||||
if (event.isCancelled) ...<Widget>[
|
||||
const SizedBox(width: 8),
|
||||
_CancelledChip(scheme: scheme),
|
||||
],
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
_IconRow(
|
||||
icon: Icons.calendar_today_outlined,
|
||||
color: scheme.onSurfaceVariant,
|
||||
child: Text(
|
||||
dateLabel,
|
||||
style: theme.textTheme.bodyMedium?.copyWith(
|
||||
color: scheme.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 6),
|
||||
_IconRow(
|
||||
icon: Icons.place_outlined,
|
||||
color: scheme.onSurfaceVariant,
|
||||
child: Text(
|
||||
event.location,
|
||||
style: theme.textTheme.bodyMedium?.copyWith(
|
||||
color: scheme.onSurfaceVariant,
|
||||
),
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Row(
|
||||
children: [
|
||||
Icon(Icons.groups_outlined, size: 18, color: scheme.primary),
|
||||
const SizedBox(width: 6),
|
||||
Text(
|
||||
'${event.teamsRegistered} / ${event.maxTeams} teams',
|
||||
style: theme.textTheme.titleSmall?.copyWith(
|
||||
color: scheme.primary,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
const Spacer(),
|
||||
if (isFull)
|
||||
Text(
|
||||
'Preferred count reached',
|
||||
style: theme.textTheme.labelSmall?.copyWith(
|
||||
color: scheme.tertiary,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _IconRow extends StatelessWidget {
|
||||
const _IconRow({
|
||||
required this.icon,
|
||||
required this.color,
|
||||
required this.child,
|
||||
});
|
||||
|
||||
final IconData icon;
|
||||
final Color color;
|
||||
final Widget child;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
Icon(icon, size: 16, color: color),
|
||||
const SizedBox(width: 6),
|
||||
Expanded(child: child),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _CancelledChip extends StatelessWidget {
|
||||
const _CancelledChip({required this.scheme});
|
||||
|
||||
final ColorScheme scheme;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
|
||||
decoration: BoxDecoration(
|
||||
color: scheme.errorContainer,
|
||||
borderRadius: BorderRadius.circular(999),
|
||||
),
|
||||
child: Text(
|
||||
'Cancelled',
|
||||
style: Theme.of(context).textTheme.labelSmall?.copyWith(
|
||||
color: scheme.onErrorContainer,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _CategoryChip extends StatelessWidget {
|
||||
const _CategoryChip({required this.category});
|
||||
|
||||
final EventCategory category;
|
||||
|
||||
static const Color _tournamentColor = Color(0xFF8B30C8);
|
||||
static const Color _pickupColor = Color(0xFF26A69A);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final isTournament = category == EventCategory.tournament;
|
||||
final color = isTournament ? _tournamentColor : _pickupColor;
|
||||
final label = isTournament ? 'TOURNAMENT' : 'PICK-UP';
|
||||
final icon = isTournament
|
||||
? Icons.emoji_events_outlined
|
||||
: Icons.sports_soccer;
|
||||
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
|
||||
decoration: BoxDecoration(
|
||||
color: color.withValues(alpha: 0.18),
|
||||
borderRadius: BorderRadius.circular(999),
|
||||
border: Border.all(color: color.withValues(alpha: 0.55)),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: <Widget>[
|
||||
Icon(icon, size: 13, color: color),
|
||||
const SizedBox(width: 4),
|
||||
Text(
|
||||
label,
|
||||
style: Theme.of(context).textTheme.labelSmall?.copyWith(
|
||||
color: color,
|
||||
fontWeight: FontWeight.w800,
|
||||
letterSpacing: 0.8,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,73 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// Toggle button representing the current user's registration state for an
|
||||
/// event. Local-state only for now — a future revision will wire this to
|
||||
/// Firestore via the events repository.
|
||||
class RegistrationButton extends StatefulWidget {
|
||||
const RegistrationButton({
|
||||
super.key,
|
||||
this.initiallyRegistered = false,
|
||||
this.enabled = true,
|
||||
this.fullWidth = false,
|
||||
this.onChanged,
|
||||
});
|
||||
|
||||
final bool initiallyRegistered;
|
||||
final bool enabled;
|
||||
final bool fullWidth;
|
||||
final ValueChanged<bool>? onChanged;
|
||||
|
||||
@override
|
||||
State<RegistrationButton> createState() => _RegistrationButtonState();
|
||||
}
|
||||
|
||||
class _RegistrationButtonState extends State<RegistrationButton> {
|
||||
late bool _registered;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_registered = widget.initiallyRegistered;
|
||||
}
|
||||
|
||||
void _toggle() {
|
||||
setState(() => _registered = !_registered);
|
||||
widget.onChanged?.call(_registered);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final scheme = Theme.of(context).colorScheme;
|
||||
|
||||
final child = _registered
|
||||
? OutlinedButton.icon(
|
||||
onPressed: widget.enabled ? _toggle : null,
|
||||
icon: Icon(Icons.check_circle, color: scheme.primary),
|
||||
label: const Text('Registered'),
|
||||
style: OutlinedButton.styleFrom(
|
||||
foregroundColor: scheme.primary,
|
||||
side: BorderSide(color: scheme.primary),
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 20,
|
||||
vertical: 14,
|
||||
),
|
||||
),
|
||||
)
|
||||
: FilledButton.icon(
|
||||
onPressed: widget.enabled ? _toggle : null,
|
||||
icon: const Icon(Icons.how_to_reg),
|
||||
label: const Text('Register'),
|
||||
style: FilledButton.styleFrom(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 20,
|
||||
vertical: 14,
|
||||
),
|
||||
),
|
||||
);
|
||||
|
||||
if (widget.fullWidth) {
|
||||
return SizedBox(width: double.infinity, child: child);
|
||||
}
|
||||
return child;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user