Sicherhaven/Eventify-frontend
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Phase 2 — 11 high-priority gaps implemented across home, auth, gamification, profile, and event detail

Browse Source 
Phase 2 gaps completed:
- HOME-001: Hero slider pause-on-touch (GestureDetector wraps PageView)
- HOME-003: Calendar bottom sheet with TableCalendar (replaces custom dialog)
- AUTH-004: District dropdown on signup (14 Kerala districts)
- EVT-003: Mobile sticky "Book Now" bar + desktop CTA wired to CheckoutScreen
- ACH-001: Real achievements from dashboard API with fallback defaults
- GAM-002: 3-card EP row (Lifetime EP / Liquid EP / Reward Points)
- GAM-005: Horizontal tier roadmap Bronze→Silver→Gold→Platinum→Diamond
- CTR-001: Submission status chips (PENDING/APPROVED/REJECTED)
- CTR-002: +EP badge on approved submissions
- PROF-003: Gamification cards on profile screen with Consumer<GamificationProvider>
- UX-001: Shimmer skeleton loaders (shimmer ^3.0.0) replacing CircularProgressIndicator

Already complete (verified, no changes needed):
- HOME-002: Category shelves already built in _buildTypeSection()
- LDR-002: Podium visualization already built (_buildPodium / _buildDesktopPodium)
- BOOK-004: UPI handled natively by Razorpay SDK

Deferred: LOC-001/002 (needs Django haversine endpoint)
Skipped: AUTH-002 (OTP needs SMS provider decision)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Sicherhaven
2026-04-04 16:51:30 +05:30
parent 29e326b8fc
commit fe8af7cfe6
12 changed files with 715 additions and 250 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
lib/features/auth/services/auth_service.dart
View File

@@ -78,15 +78,20 @@ class AuthService {
required String email,
required String phoneNumber,
required String password,
String? district,
}) async {
try {
final body = <String, dynamic>{
"email": email,
"phone_number": phoneNumber,
"password": password,
};
if (district != null && district.isNotEmpty) {
body["district"] = district;
}
final res = await _api.post(
ApiEndpoints.register,
body: {
"email": email,
"phone_number": phoneNumber,
"password": password,
},
body: body,
requiresAuth: false,
);

13
lib/features/gamification/models/gamification_models.dart
View File

@@ -243,10 +243,12 @@ class SubmissionModel {
class DashboardResponse {
final UserGamificationProfile profile;
final List<SubmissionModel> submissions;
final List<AchievementBadge> achievements;
const DashboardResponse({
required this.profile,
this.submissions = const [],
this.achievements = const [],
});
}
@@ -330,4 +332,15 @@ class AchievementBadge {
required this.isUnlocked,
required this.progress,
});
factory AchievementBadge.fromJson(Map<String, dynamic> json) {
return AchievementBadge(
id: (json['id'] ?? json['badge_id'] ?? '').toString(),
title: (json['title'] ?? json['name'] ?? '').toString(),
description: (json['description'] ?? '').toString(),
iconName: (json['icon_name'] ?? json['icon'] ?? 'star').toString(),
isUnlocked: json['is_unlocked'] == true || json['unlocked'] == true,
progress: (json['progress'] as num?)?.toDouble() ?? 0.0,
);
}
}

21
lib/features/gamification/providers/gamification_provider.dart
View File

@@ -24,10 +24,19 @@ class GamificationProvider extends ChangeNotifier {
bool isLoading = false;
String? error;
// TTL guard — prevents redundant API calls from multiple screens
DateTime? _lastLoadTime;
static const _loadTtl = Duration(minutes: 2);
// ---------------------------------------------------------------------------
// Load everything at once (called when ContributeScreen is mounted)
// Load everything at once (called when ContributeScreen or ProfileScreen mounts)
// ---------------------------------------------------------------------------
Future<void> loadAll() async {
Future<void> loadAll({bool force = false}) async {
// Skip if recently loaded (within 2 minutes) unless forced
if (!force && _lastLoadTime != null && DateTime.now().difference(_lastLoadTime!) < _loadTtl) {
return;
}
isLoading = true;
error = null;
notifyListeners();
@@ -50,7 +59,13 @@ class GamificationProvider extends ChangeNotifier {
totalParticipants = lbResponse.totalParticipants;
shopItems = results[2] as List<ShopItem>;
achievements = results[3] as List<AchievementBadge>;
// Prefer achievements from dashboard API; fall back to getAchievements()
final dashAchievements = dashboard.achievements;
final fetchedAchievements = results[3] as List<AchievementBadge>;
achievements = dashAchievements.isNotEmpty ? dashAchievements : fetchedAchievements;
_lastLoadTime = DateTime.now();
} catch (e) {
error = userFriendlyError(e);
} finally {

59
lib/features/gamification/services/gamification_service.dart
View File

@@ -28,14 +28,20 @@ class GamificationService {
final profileJson = res['profile'] as Map<String, dynamic>? ?? {};
final rawSubs = res['submissions'] as List? ?? [];
final rawAchievements = res['achievements'] as List? ?? [];
final submissions = rawSubs
.map((s) => SubmissionModel.fromJson(Map<String, dynamic>.from(s as Map)))
.toList();
final achievements = rawAchievements
.map((a) => AchievementBadge.fromJson(Map<String, dynamic>.from(a as Map)))
.toList();
return DashboardResponse(
profile: UserGamificationProfile.fromJson(profileJson),
submissions: submissions,
achievements: achievements,
);
}
@@ -132,42 +138,25 @@ class GamificationService {
}
// ---------------------------------------------------------------------------
// Achievements
// TODO: wire to achievements API when available on Node.js server
// Achievements — sourced from dashboard API `achievements` array.
// Falls back to default badges if API doesn't return achievements yet.
// ---------------------------------------------------------------------------
Future<List<AchievementBadge>> getAchievements() async {
await Future.delayed(const Duration(milliseconds: 300));
return const [
AchievementBadge(
id: 'badge-01', title: 'First Submission',
description: 'Submitted your first event.',
iconName: 'edit', isUnlocked: true, progress: 1.0,
),
AchievementBadge(
id: 'badge-02', title: 'Silver Streak',
description: 'Reached Silver tier.',
iconName: 'star', isUnlocked: true, progress: 1.0,
),
AchievementBadge(
id: 'badge-03', title: 'Gold Rush',
description: 'Reach Gold tier (500 EP).',
iconName: 'emoji_events', isUnlocked: false, progress: 0.64,
),
AchievementBadge(
id: 'badge-04', title: 'Top 10',
description: 'Appear in the district leaderboard top 10.',
iconName: 'leaderboard', isUnlocked: false, progress: 0.5,
),
AchievementBadge(
id: 'badge-05', title: 'Image Pro',
description: 'Submit 10 events with 3+ images.',
iconName: 'photo_library', isUnlocked: false, progress: 0.3,
),
AchievementBadge(
id: 'badge-06', title: 'Pioneer',
description: 'One of the first 100 contributors.',
iconName: 'verified', isUnlocked: true, progress: 1.0,
),
];
try {
final dashboard = await getDashboard();
if (dashboard.achievements.isNotEmpty) return dashboard.achievements;
} catch (_) {
// Fall through to defaults
}
return _defaultBadges;
}
static const _defaultBadges = [
AchievementBadge(id: 'badge-01', title: 'First Submission', description: 'Submitted your first event.', iconName: 'edit', isUnlocked: false, progress: 0.0),
AchievementBadge(id: 'badge-02', title: 'Silver Streak', description: 'Reached Silver tier.', iconName: 'star', isUnlocked: false, progress: 0.0),
AchievementBadge(id: 'badge-03', title: 'Gold Rush', description: 'Reach Gold tier (500 EP).', iconName: 'emoji_events', isUnlocked: false, progress: 0.0),
AchievementBadge(id: 'badge-04', title: 'Top 10', description: 'Appear in the district leaderboard top 10.', iconName: 'leaderboard', isUnlocked: false, progress: 0.0),
AchievementBadge(id: 'badge-05', title: 'Image Pro', description: 'Submit 10 events with 3+ images.', iconName: 'photo_library', isUnlocked: false, progress: 0.0),
AchievementBadge(id: 'badge-06', title: 'Pioneer', description: 'One of the first 100 contributors.', iconName: 'verified', isUnlocked: false, progress: 0.0),
];
}

216
lib/screens/contribute_screen.dart
View File

@@ -245,6 +245,27 @@ class _ContributeScreenState extends State<ContributeScreen>
),
),
),
const SizedBox(height: 16),
// GAM-002: 3-card EP stat row
Padding(
padding: const EdgeInsets.symmetric(horizontal: 20),
child: Row(
children: [
_epStatCard('Lifetime EP', '${profile?.lifetimeEp ?? 0}', Icons.star, const Color(0xFFF59E0B)),
const SizedBox(width: 8),
_epStatCard('Liquid EP', '${profile?.currentEp ?? 0}', Icons.bolt, const Color(0xFF3B82F6)),
const SizedBox(width: 8),
_epStatCard('Reward Pts', '${profile?.currentRp ?? 0}', Icons.redeem, const Color(0xFF10B981)),
],
),
),
const SizedBox(height: 16),
// GAM-005: Tier roadmap
_buildTierRoadmap(lifetimeEp, tier),
const SizedBox(height: 24),
// Vertical tab navigation
@@ -1587,12 +1608,82 @@ class _ContributeScreenState extends State<ContributeScreen>
style: theme.textTheme.bodySmall?.copyWith(color: Colors.grey[500], fontSize: 11),
),
),
// CTR-001/002: Your Submissions list
if (provider.submissions.isNotEmpty) ...[
const SizedBox(height: 28),
Text('Your Submissions', style: theme.textTheme.titleMedium?.copyWith(fontWeight: FontWeight.w700)),
const SizedBox(height: 12),
...provider.submissions.map((sub) => _buildSubmissionCard(sub, theme)),
],
],
),
),
);
}
Widget _buildSubmissionCard(SubmissionModel sub, ThemeData theme) {
return Container(
margin: const EdgeInsets.only(bottom: 10),
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: theme.cardColor,
borderRadius: BorderRadius.circular(12),
border: Border.all(color: theme.dividerColor.withOpacity(0.2)),
),
child: Row(
children: [
// Thumbnail or placeholder
Container(
width: 48,
height: 48,
decoration: BoxDecoration(
color: Colors.grey[200],
borderRadius: BorderRadius.circular(8),
),
child: sub.images.isNotEmpty
? ClipRRect(
borderRadius: BorderRadius.circular(8),
child: Image.network(sub.images.first, fit: BoxFit.cover, errorBuilder: (_, __, ___) => const Icon(Icons.event, color: Colors.grey)),
)
: const Icon(Icons.event, color: Colors.grey),
),
const SizedBox(width: 12),
// Info
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(sub.eventName, style: const TextStyle(fontWeight: FontWeight.w600, fontSize: 14), maxLines: 1, overflow: TextOverflow.ellipsis),
const SizedBox(height: 2),
Text('${sub.category} · ${sub.district}', style: TextStyle(color: Colors.grey[500], fontSize: 11)),
],
),
),
const SizedBox(width: 8),
// Status chip + EP badge
Column(
crossAxisAlignment: CrossAxisAlignment.end,
children: [
statusChip(sub.status),
if (sub.epAwarded > 0) ...[
const SizedBox(height: 4),
Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
decoration: BoxDecoration(
color: const Color(0xFFDBEAFE),
borderRadius: BorderRadius.circular(8),
),
child: Text('+${sub.epAwarded} EP', style: const TextStyle(color: Color(0xFF2563EB), fontWeight: FontWeight.w700, fontSize: 11)),
),
],
],
),
],
),
);
}
Widget _formCard(List<Widget> children) {
return RepaintBoundary(
child: Container(
@@ -2657,4 +2748,129 @@ class _ContributeScreenState extends State<ContributeScreen>
}
}
}
// ─────────────────────────────────────────────────────────────────────────
// GAM-002: EP stat card helper (used in left panel + profile)
// ─────────────────────────────────────────────────────────────────────────
Widget _epStatCard(String label, String value, IconData icon, Color color) {
return Expanded(
child: Container(
padding: const EdgeInsets.all(10),
decoration: BoxDecoration(
color: color.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
border: Border.all(color: color.withOpacity(0.3)),
),
child: Column(
children: [
Icon(icon, color: color, size: 20),
const SizedBox(height: 4),
Text(value, style: TextStyle(color: Colors.white, fontWeight: FontWeight.w800, fontSize: 16)),
const SizedBox(height: 2),
Text(label, style: const TextStyle(color: Colors.white60, fontSize: 10), textAlign: TextAlign.center),
],
),
),
);
}
// ─────────────────────────────────────────────────────────────────────────
// GAM-005: Horizontal tier roadmap (Bronze → Diamond)
// ─────────────────────────────────────────────────────────────────────────
Widget _buildTierRoadmap(int lifetimeEp, ContributorTier currentTier) {
const tiers = ContributorTier.values; // BRONZE, SILVER, GOLD, PLATINUM, DIAMOND
const thresholds = [0, 100, 500, 1500, 5000];
final overallProgress = (lifetimeEp / 5000).clamp(0.0, 1.0);
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 20),
child: Container(
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.06),
borderRadius: BorderRadius.circular(12),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text('Tier Roadmap', style: TextStyle(color: Colors.white70, fontSize: 11, fontWeight: FontWeight.w600)),
const SizedBox(height: 10),
Row(
children: List.generate(tiers.length, (i) {
final reached = currentTier.index >= i;
final color = _tierColors[tiers[i]] ?? Colors.grey;
return Expanded(
child: Column(
children: [
Container(
width: 16,
height: 16,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: reached ? color : Colors.white24,
border: Border.all(color: reached ? color : Colors.white30, width: 2),
),
),
const SizedBox(height: 4),
Text(
tierLabel(tiers[i]),
style: TextStyle(color: reached ? Colors.white : Colors.white38, fontSize: 9, fontWeight: FontWeight.w600),
textAlign: TextAlign.center,
),
Text(
'${thresholds[i]}',
style: TextStyle(color: reached ? Colors.white54 : Colors.white24, fontSize: 8),
),
],
),
);
}),
),
const SizedBox(height: 8),
ClipRRect(
borderRadius: BorderRadius.circular(4),
child: LinearProgressIndicator(
value: overallProgress,
minHeight: 4,
backgroundColor: Colors.white12,
valueColor: AlwaysStoppedAnimation<Color>(_tierColors[currentTier] ?? Colors.white),
),
),
],
),
),
);
}
// ─────────────────────────────────────────────────────────────────────────
// CTR-001: Status chip for submissions
// ─────────────────────────────────────────────────────────────────────────
static Widget statusChip(String status) {
Color bg;
Color fg;
switch (status.toUpperCase()) {
case 'APPROVED':
bg = const Color(0xFFDCFCE7);
fg = const Color(0xFF16A34A);
break;
case 'REJECTED':
bg = const Color(0xFFFEE2E2);
fg = const Color(0xFFDC2626);
break;
default: // PENDING
bg = const Color(0xFFFEF9C3);
fg = const Color(0xFFCA8A04);
}
return Container(
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
decoration: BoxDecoration(
color: bg,
borderRadius: BorderRadius.circular(12),
),
child: Text(
status.toUpperCase(),
style: TextStyle(color: fg, fontWeight: FontWeight.w700, fontSize: 11),
),
);
}
}

368
lib/screens/home_screen.dart
View File

@@ -7,6 +7,7 @@ import 'package:shared_preferences/shared_preferences.dart';
import '../core/auth/auth_guard.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:intl/intl.dart';
import 'package:table_calendar/table_calendar.dart';
import '../features/events/models/event_models.dart';
import '../features/events/services/events_service.dart';
@@ -22,6 +23,7 @@ import 'package:provider/provider.dart';
import '../features/gamification/providers/gamification_provider.dart';
import '../features/notifications/widgets/notification_bell.dart';
import '../features/notifications/providers/notification_provider.dart';
import '../widgets/skeleton_loader.dart';
class HomeScreen extends StatefulWidget {
const HomeScreen({Key? key}) : super(key: key);
@@ -660,7 +662,7 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
Future<void> _onDateChipTap(String label) async {
if (label == 'Date') {
// Open custom calendar dialog
final picked = await _showCalendarDialog();
final picked = await _showCalendarBottomSheet();
if (picked != null) {
setState(() {
_selectedCustomDate = picked;
@@ -963,173 +965,141 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
return dates;
}
/// Show a custom calendar dialog matching the app design.
Future<DateTime?> _showCalendarDialog() {
DateTime viewMonth = _selectedCustomDate ?? DateTime.now();
DateTime? selected = _selectedCustomDate;
/// Show a calendar bottom sheet with TableCalendar for date filtering.
Future<DateTime?> _showCalendarBottomSheet() {
DateTime focusedDay = _selectedCustomDate ?? DateTime.now();
DateTime? selectedDay = _selectedCustomDate;
final eventDates = _eventDates;
return showDialog<DateTime>(
return showModalBottomSheet<DateTime>(
context: context,
barrierColor: Colors.black54,
isScrollControlled: true,
backgroundColor: Colors.transparent,
builder: (ctx) {
return StatefulBuilder(builder: (ctx, setDialogState) {
final now = DateTime.now();
final today = DateTime(now.year, now.month, now.day);
return StatefulBuilder(builder: (ctx, setSheetState) {
final theme = Theme.of(ctx);
final isDark = theme.brightness == Brightness.dark;
// Calendar calculations
final firstDayOfMonth = DateTime(viewMonth.year, viewMonth.month, 1);
final daysInMonth = DateTime(viewMonth.year, viewMonth.month + 1, 0).day;
final startWeekday = firstDayOfMonth.weekday; // 1=Mon
const months = ['January','February','March','April','May','June','July','August','September','October','November','December'];
const dayHeaders = ['M', 'T', 'W', 'T', 'F', 'S', 'S'];
return Center(
child: Container(
margin: const EdgeInsets.symmetric(horizontal: 28),
padding: const EdgeInsets.fromLTRB(20, 24, 20, 20),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(24),
boxShadow: [BoxShadow(color: Colors.black.withOpacity(0.15), blurRadius: 20, offset: const Offset(0, 8))],
),
child: Material(
color: Colors.transparent,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
// Month navigation
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
_calendarNavButton(Icons.chevron_left, () {
setDialogState(() {
viewMonth = DateTime(viewMonth.year, viewMonth.month - 1, 1);
});
}),
Text(
'${months[viewMonth.month - 1]} ${viewMonth.year}',
style: const TextStyle(fontSize: 18, fontWeight: FontWeight.bold, color: Color(0xFF1A1A2E)),
),
_calendarNavButton(Icons.chevron_right, () {
setDialogState(() {
viewMonth = DateTime(viewMonth.year, viewMonth.month + 1, 1);
});
}),
],
return Container(
decoration: BoxDecoration(
color: isDark ? const Color(0xFF1E1E2E) : Colors.white,
borderRadius: const BorderRadius.vertical(top: Radius.circular(24)),
),
padding: const EdgeInsets.fromLTRB(16, 8, 16, 20),
child: SafeArea(
top: false,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
// Drag handle
Container(
width: 40,
height: 4,
margin: const EdgeInsets.only(bottom: 16),
decoration: BoxDecoration(
color: Colors.grey[400],
borderRadius: BorderRadius.circular(2),
),
const SizedBox(height: 20),
),
// Day of week headers
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: dayHeaders.map((d) => SizedBox(
width: 36,
child: Center(child: Text(d, style: TextStyle(color: Colors.grey[500], fontWeight: FontWeight.w600, fontSize: 13))),
)).toList(),
// TableCalendar
TableCalendar(
firstDay: DateTime(2020),
lastDay: DateTime(2030),
focusedDay: focusedDay,
selectedDayPredicate: (day) =>
selectedDay != null && isSameDay(day, selectedDay),
onDaySelected: (selected, focused) {
setSheetState(() {
selectedDay = selected;
focusedDay = focused;
});
},
onPageChanged: (focused) {
setSheetState(() => focusedDay = focused);
},
eventLoader: (day) {
final normalized = DateTime(day.year, day.month, day.day);
return eventDates.contains(normalized) ? [true] : [];
},
startingDayOfWeek: StartingDayOfWeek.monday,
headerStyle: HeaderStyle(
formatButtonVisible: false,
titleCentered: true,
titleTextStyle: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: isDark ? Colors.white : const Color(0xFF1A1A2E),
),
leftChevronIcon: Icon(Icons.chevron_left,
color: isDark ? Colors.white70 : const Color(0xFF374151)),
rightChevronIcon: Icon(Icons.chevron_right,
color: isDark ? Colors.white70 : const Color(0xFF374151)),
),
const SizedBox(height: 12),
// Calendar grid
...List.generate(6, (weekRow) {
return Padding(
padding: const EdgeInsets.only(bottom: 4),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: List.generate(7, (weekCol) {
final cellIndex = weekRow * 7 + weekCol;
final dayNum = cellIndex - (startWeekday - 1) + 1;
if (dayNum < 1 || dayNum > daysInMonth) {
return const SizedBox(width: 36, height: 44);
}
final cellDate = DateTime(viewMonth.year, viewMonth.month, dayNum);
final isToday = cellDate == today;
final isSelected = selected != null &&
cellDate.year == selected!.year &&
cellDate.month == selected!.month &&
cellDate.day == selected!.day;
final hasEvent = eventDates.contains(cellDate);
return GestureDetector(
onTap: () {
setDialogState(() => selected = cellDate);
},
child: SizedBox(
width: 36,
height: 44,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
width: 34,
height: 34,
decoration: BoxDecoration(
color: isSelected
? const Color(0xFF2563EB)
: Colors.transparent,
shape: BoxShape.circle,
border: isToday && !isSelected
? Border.all(color: const Color(0xFF2563EB), width: 1.5)
: null,
),
child: Center(
child: Text(
'$dayNum',
style: TextStyle(
fontSize: 15,
fontWeight: (isToday || isSelected) ? FontWeight.w700 : FontWeight.w500,
color: isSelected
? Colors.white
: isToday
? const Color(0xFF2563EB)
: const Color(0xFF374151),
),
),
),
),
// Event dot
if (hasEvent)
Container(
width: 5,
height: 5,
decoration: BoxDecoration(
color: isSelected ? Colors.white : const Color(0xFFEF4444),
shape: BoxShape.circle,
),
)
else
const SizedBox(height: 5),
],
),
),
);
}),
),
);
}),
const SizedBox(height: 12),
// Done button
SizedBox(
width: 160,
height: 48,
child: ElevatedButton(
onPressed: () => Navigator.of(ctx).pop(selected),
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFF2563EB),
foregroundColor: Colors.white,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(24)),
elevation: 0,
),
child: const Text('Done', style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600)),
calendarStyle: CalendarStyle(
selectedDecoration: const BoxDecoration(
color: Color(0xFF2563EB),
shape: BoxShape.circle,
),
todayDecoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(color: const Color(0xFF2563EB), width: 1.5),
),
todayTextStyle: const TextStyle(
color: Color(0xFF2563EB),
fontWeight: FontWeight.w700,
),
defaultTextStyle: TextStyle(
color: isDark ? Colors.white : const Color(0xFF374151),
),
weekendTextStyle: TextStyle(
color: isDark ? Colors.white70 : const Color(0xFF374151),
),
outsideTextStyle: TextStyle(
color: isDark ? Colors.white24 : Colors.grey[400]!,
),
markerDecoration: const BoxDecoration(
color: Color(0xFFEF4444),
shape: BoxShape.circle,
),
markerSize: 5,
markersMaxCount: 1,
),
daysOfWeekStyle: DaysOfWeekStyle(
weekdayStyle: TextStyle(
color: isDark ? Colors.white54 : Colors.grey[500],
fontWeight: FontWeight.w600,
fontSize: 13,
),
weekendStyle: TextStyle(
color: isDark ? Colors.white54 : Colors.grey[500],
fontWeight: FontWeight.w600,
fontSize: 13,
),
),
],
),
),
const SizedBox(height: 16),
// Done button
SizedBox(
width: 160,
height: 48,
child: ElevatedButton(
onPressed: () => Navigator.of(ctx).pop(selectedDay),
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFF2563EB),
foregroundColor: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(24)),
elevation: 0,
),
child: const Text('Done',
style: TextStyle(
fontSize: 16, fontWeight: FontWeight.w600)),
),
),
],
),
),
);
@@ -1138,22 +1108,6 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
);
}
Widget _calendarNavButton(IconData icon, VoidCallback onTap) {
return InkWell(
onTap: onTap,
borderRadius: BorderRadius.circular(20),
child: Container(
width: 40,
height: 40,
decoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(color: Colors.grey[300]!),
),
child: Icon(icon, color: const Color(0xFF374151), size: 22),
),
);
}
Widget _buildHomeContent() {
return Container(
decoration: const BoxDecoration(
@@ -1268,32 +1222,38 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
: Column(
children: [
RepaintBoundary(
child: SizedBox(
height: 320,
child: PageView.builder(
controller: _heroPageController,
onPageChanged: (page) {
_heroPageNotifier.value = page;
// 8s delay after manual swipe for full read time
_startAutoScroll(delay: const Duration(seconds: 8));
},
itemCount: _heroEvents.length,
itemBuilder: (context, index) {
// Scale animation: active card = 1.0, adjacent = 0.94
return AnimatedBuilder(
animation: _heroPageController,
builder: (context, child) {
double scale = index == _heroPageNotifier.value ? 1.0 : 0.94;
if (_heroPageController.position.haveDimensions) {
scale = (1.0 -
(_heroPageController.page! - index).abs() * 0.06)
.clamp(0.94, 1.0);
}
return Transform.scale(scale: scale, child: child);
},
child: _buildHeroEventImage(_heroEvents[index]),
);
},
child: GestureDetector(
behavior: HitTestBehavior.translucent,
onPanDown: (_) => _autoScrollTimer?.cancel(),
onPanEnd: (_) => _startAutoScroll(delay: const Duration(seconds: 3)),
onPanCancel: () => _startAutoScroll(delay: const Duration(seconds: 3)),
child: SizedBox(
height: 320,
child: PageView.builder(
controller: _heroPageController,
onPageChanged: (page) {
_heroPageNotifier.value = page;
// 8s delay after manual swipe for full read time
_startAutoScroll(delay: const Duration(seconds: 8));
},
itemCount: _heroEvents.length,
itemBuilder: (context, index) {
// Scale animation: active card = 1.0, adjacent = 0.94
return AnimatedBuilder(
animation: _heroPageController,
builder: (context, child) {
double scale = index == _heroPageNotifier.value ? 1.0 : 0.94;
if (_heroPageController.position.haveDimensions) {
scale = (1.0 -
(_heroPageController.page! - index).abs() * 0.06)
.clamp(0.94, 1.0);
}
return Transform.scale(scale: scale, child: child);
},
child: _buildHeroEventImage(_heroEvents[index]),
);
},
),
),
),
),
@@ -1566,7 +1526,7 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
SizedBox(
height: 200,
child: _allFilteredByDate.isEmpty && _loading
? const Center(child: CircularProgressIndicator())
? Row(children: List.generate(3, (_) => const Padding(padding: EdgeInsets.only(right: 12), child: EventCardSkeleton())))
: _allFilteredByDate.isEmpty
? Center(child: Text(
_selectedDateFilter.isNotEmpty ? 'No events for "$_selectedDateFilter"' : 'No events found',
@@ -1660,9 +1620,9 @@ class _HomeScreenState extends State<HomeScreen> with SingleTickerProviderStateM
// Event sections — shelves (All) or filtered list (specific category)
if (_loading)
const Padding(
padding: EdgeInsets.all(40),
child: Center(child: CircularProgressIndicator()),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 20),
child: Column(children: List.generate(3, (_) => const Padding(padding: EdgeInsets.only(bottom: 8), child: EventListSkeleton()))),
)
else if (_allFilteredByDate.isEmpty && _selectedDateFilter.isNotEmpty)
Padding(

53
lib/screens/learn_more_screen.dart
View File

@@ -15,6 +15,7 @@ import '../core/auth/auth_guard.dart';
import '../core/utils/error_utils.dart';
import '../core/constants.dart';
import '../features/reviews/widgets/review_section.dart';
import 'checkout_screen.dart';
class LearnMoreScreen extends StatefulWidget {
final int eventId;
@@ -28,6 +29,18 @@ class LearnMoreScreen extends StatefulWidget {
class _LearnMoreScreenState extends State<LearnMoreScreen> {
final EventsService _service = EventsService();
void _navigateToCheckout() {
if (!AuthGuard.requireLogin(context, reason: 'Sign in to book this event.')) return;
if (_event == null) return;
Navigator.of(context).push(MaterialPageRoute(
builder: (_) => CheckoutScreen(
eventId: _event!.id,
eventName: _event!.name,
eventImage: _event!.thumbImg,
),
));
}
bool _loading = true;
EventModel? _event;
String? _error;
@@ -388,9 +401,7 @@ class _LearnMoreScreenState extends State<LearnMoreScreen> {
right: 32,
bottom: 36,
child: ElevatedButton(
onPressed: () {
// TODO: implement booking action
},
onPressed: _navigateToCheckout,
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFF1A56DB),
foregroundColor: Colors.white,
@@ -530,6 +541,42 @@ class _LearnMoreScreenState extends State<LearnMoreScreen> {
// ── MOBILE layout ─────────────────────────────────────────────────────
return Scaffold(
backgroundColor: theme.scaffoldBackgroundColor,
bottomNavigationBar: (_event != null && _event!.isBookable)
? Container(
decoration: BoxDecoration(
color: theme.scaffoldBackgroundColor,
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.08),
blurRadius: 12,
offset: const Offset(0, -4),
),
],
),
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
child: SafeArea(
top: false,
child: SizedBox(
height: 52,
child: ElevatedButton(
onPressed: _navigateToCheckout,
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFF1A56DB),
foregroundColor: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(14),
),
elevation: 0,
),
child: const Text(
'Book Now',
style: TextStyle(fontSize: 16, fontWeight: FontWeight.w700),
),
),
),
),
)
: null,
body: Stack(
children: [
// ── Scrollable content (carousel + card scroll together) ──

15
lib/screens/login_screen.dart
View File

@@ -595,6 +595,13 @@ class _RegisterScreenState extends State<RegisterScreen> {
final AuthService _auth = AuthService();
bool _loading = false;
String? _selectedDistrict;
static const _districts = [
'Thiruvananthapuram', 'Kollam', 'Pathanamthitta', 'Alappuzha',
'Kottayam', 'Idukki', 'Ernakulam', 'Thrissur', 'Palakkad',
'Malappuram', 'Kozhikode', 'Wayanad', 'Kannur', 'Kasaragod',
];
@override
void dispose() {
@@ -625,6 +632,7 @@ class _RegisterScreenState extends State<RegisterScreen> {
email: email,
phoneNumber: phone,
password: pass,
district: _selectedDistrict,
);
if (!mounted) return;
@@ -679,6 +687,13 @@ class _RegisterScreenState extends State<RegisterScreen> {
const SizedBox(height: 8),
TextFormField(controller: _phoneCtrl, decoration: const InputDecoration(labelText: 'Phone'), validator: _phoneValidator, keyboardType: TextInputType.phone),
const SizedBox(height: 8),
DropdownButtonFormField<String>(
value: _selectedDistrict,
decoration: const InputDecoration(labelText: 'District (optional)'),
items: _districts.map((d) => DropdownMenuItem(value: d, child: Text(d))).toList(),
onChanged: (v) => setState(() => _selectedDistrict = v),
),
const SizedBox(height: 8),
TextFormField(controller: _passCtrl, obscureText: true, decoration: const InputDecoration(labelText: 'Password'), validator: _passwordValidator),
const SizedBox(height: 8),
TextFormField(controller: _confirmCtrl, obscureText: true, decoration: const InputDecoration(labelText: 'Confirm password'), validator: _passwordValidator),

62
lib/screens/profile_screen.dart
View File

@@ -7,8 +7,12 @@ import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:provider/provider.dart';
import '../features/events/services/events_service.dart';
import '../features/events/models/event_models.dart';
import '../features/gamification/providers/gamification_provider.dart';
import '../features/gamification/models/gamification_models.dart';
import '../widgets/skeleton_loader.dart';
import 'learn_more_screen.dart';
import 'settings_screen.dart';
import '../core/app_decoration.dart';
@@ -73,6 +77,11 @@ class _ProfileScreenState extends State<ProfileScreen>
_loadProfile();
_startAnimations();
// Load gamification data for profile EP cards
WidgetsBinding.instance.addPostFrameCallback((_) {
if (mounted) context.read<GamificationProvider>().loadAll();
});
}
@override
@@ -1588,6 +1597,9 @@ class _ProfileScreenState extends State<ProfileScreen>
),
),
// PROF-003: Gamification stat cards
SliverToBoxAdapter(child: _buildGamificationCards(theme)),
// ── Ongoing Events ──
if (_ongoingEvents.isNotEmpty) ...[
SliverToBoxAdapter(child: sectionTitle('Ongoing Events')),
@@ -1657,4 +1669,54 @@ class _ProfileScreenState extends State<ProfileScreen>
),
);
}
// ─────────────────────────────────────────────────────────────────────────
// PROF-003: Gamification 3-card row (Lifetime EP / Liquid EP / RP)
// ─────────────────────────────────────────────────────────────────────────
Widget _buildGamificationCards(ThemeData theme) {
return Consumer<GamificationProvider>(
builder: (context, gp, _) {
if (gp.isLoading && gp.profile == null) {
return const ProfileStatsSkeleton();
}
if (gp.profile == null) return const SizedBox.shrink();
final p = gp.profile!;
return Padding(
padding: const EdgeInsets.fromLTRB(18, 8, 18, 8),
child: Row(
children: [
_gamStatCard('Lifetime EP', '${p.lifetimeEp}', Icons.star, const Color(0xFFF59E0B), theme),
const SizedBox(width: 10),
_gamStatCard('Liquid EP', '${p.currentEp}', Icons.bolt, const Color(0xFF3B82F6), theme),
const SizedBox(width: 10),
_gamStatCard('Reward Pts', '${p.currentRp}', Icons.redeem, const Color(0xFF10B981), theme),
],
),
);
},
);
}
Widget _gamStatCard(String label, String value, IconData icon, Color color, ThemeData theme) {
return Expanded(
child: Container(
padding: const EdgeInsets.symmetric(vertical: 12, horizontal: 8),
decoration: BoxDecoration(
color: color.withOpacity(0.08),
borderRadius: BorderRadius.circular(12),
border: Border.all(color: color.withOpacity(0.2)),
),
child: Column(
children: [
Icon(icon, color: color, size: 22),
const SizedBox(height: 4),
Text(value, style: TextStyle(fontWeight: FontWeight.w800, fontSize: 16, color: theme.textTheme.bodyLarge?.color)),
const SizedBox(height: 2),
Text(label, style: TextStyle(color: theme.hintColor, fontSize: 10), textAlign: TextAlign.center),
],
),
),
);
}
}

134
lib/widgets/skeleton_loader.dart Normal file
View File

@@ -0,0 +1,134 @@
import 'package:flutter/material.dart';
import 'package:shimmer/shimmer.dart';
/// Generic shimmer rectangle with configurable dimensions and border radius.
class SkeletonBox extends StatelessWidget {
final double width;
final double height;
final double borderRadius;
const SkeletonBox({
Key? key,
this.width = double.infinity,
required this.height,
this.borderRadius = 8,
}) : super(key: key);
@override
Widget build(BuildContext context) {
final isDark = Theme.of(context).brightness == Brightness.dark;
return Shimmer.fromColors(
baseColor: isDark ? const Color(0xFF2D2D2D) : Colors.grey[300]!,
highlightColor: isDark ? const Color(0xFF3D3D3D) : Colors.grey[100]!,
child: Container(
width: width,
height: height,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(borderRadius),
),
),
);
}
}
/// Shimmer placeholder for a compact event card (used in horizontal lists).
class EventCardSkeleton extends StatelessWidget {
const EventCardSkeleton({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return SizedBox(
width: 200,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: const [
SkeletonBox(height: 140, borderRadius: 12),
SizedBox(height: 8),
SkeletonBox(height: 14, width: 160),
SizedBox(height: 6),
SkeletonBox(height: 12, width: 100),
],
),
);
}
}
/// Shimmer placeholder for a full-width event list row.
class EventListSkeleton extends StatelessWidget {
const EventListSkeleton({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 6, horizontal: 16),
child: Row(
children: const [
SkeletonBox(width: 64, height: 64, borderRadius: 10),
SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SkeletonBox(height: 14),
SizedBox(height: 8),
SkeletonBox(height: 12, width: 140),
],
),
),
],
),
);
}
}
/// Shimmer placeholder for hero carousel area.
class HeroCarouselSkeleton extends StatelessWidget {
const HeroCarouselSkeleton({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return const Padding(
padding: EdgeInsets.symmetric(horizontal: 16),
child: SkeletonBox(height: 320, borderRadius: 24),
);
}
}
/// Shimmer grid for achievements tab.
class AchievementGridSkeleton extends StatelessWidget {
const AchievementGridSkeleton({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return GridView.count(
crossAxisCount: 2,
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
mainAxisSpacing: 12,
crossAxisSpacing: 12,
padding: const EdgeInsets.all(16),
children: List.generate(4, (_) => const SkeletonBox(height: 160, borderRadius: 16)),
);
}
}
/// Shimmer placeholder for profile stat cards row.
class ProfileStatsSkeleton extends StatelessWidget {
const ProfileStatsSkeleton({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
child: Row(
children: List.generate(3, (_) => const Expanded(
child: Padding(
padding: EdgeInsets.symmetric(horizontal: 4),
child: SkeletonBox(height: 80, borderRadius: 12),
),
)),
),
);
}
}

8
pubspec.lock
View File

@@ -824,6 +824,14 @@ packages:
url: "https://pub.dev"
source: hosted
version: "2.4.1"
shimmer:
dependency: "direct main"
description:
name: shimmer
sha256: "5f88c883a22e9f9f299e5ba0e4f7e6054857224976a5d9f839d4ebdc94a14ac9"
url: "https://pub.dev"
source: hosted
version: "3.0.0"
simple_gesture_detector:
dependency: transitive
description:

1
pubspec.yaml
View File

@@ -25,6 +25,7 @@ dependencies:
razorpay_flutter: ^1.3.7
google_sign_in: ^6.2.2
http: ^1.2.0
shimmer: ^3.0.0
dev_dependencies:
flutter_test: