Files
TravelMate/lib/components/home/home_content.dart

471 lines
16 KiB
Dart

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:travel_mate/components/home/create_trip_content.dart';
import '../home/show_trip_details_content.dart';
import '../../blocs/user/user_bloc.dart';
import '../../blocs/user/user_state.dart';
import '../../blocs/trip/trip_bloc.dart';
import '../../blocs/trip/trip_state.dart';
import '../../blocs/trip/trip_event.dart';
import '../../models/trip.dart';
/// Home content widget for the main application dashboard.
///
/// This widget serves as the primary content area of the home screen,
/// displaying user trips and providing navigation to trip management
/// features. Key functionality includes:
/// - Loading and displaying user trips
/// - Creating new trips
/// - Viewing trip details
/// - Managing trip state with proper user authentication
///
/// The widget maintains state persistence using AutomaticKeepAliveClientMixin
/// to preserve content when switching between tabs.
class HomeContent extends StatefulWidget {
/// Creates a home content widget.
const HomeContent({super.key});
@override
State<HomeContent> createState() => _HomeContentState();
}
class _HomeContentState extends State<HomeContent>
with AutomaticKeepAliveClientMixin {
/// Preserves widget state when switching between tabs
@override
bool get wantKeepAlive => true;
/// Flag to prevent duplicate trip loading operations
bool _hasLoadedTrips = false;
@override
void initState() {
super.initState();
// Use addPostFrameCallback to wait for the widget tree to be ready
WidgetsBinding.instance.addPostFrameCallback((_) {
_loadTripsIfUserLoaded();
});
}
/// Loads trips if a user is currently loaded and trips haven't been loaded yet.
///
/// Checks the current user state and initiates trip loading if the user is
/// authenticated and trips haven't been loaded previously. This prevents
/// duplicate loading operations.
void _loadTripsIfUserLoaded() {
if (!_hasLoadedTrips && mounted) {
final userState = context.read<UserBloc>().state;
if (userState is UserLoaded) {
_hasLoadedTrips = true;
context.read<TripBloc>().add(
LoadTripsByUserId(userId: userState.user.id),
);
}
}
}
@override
Widget build(BuildContext context) {
super.build(context); // Important pour AutomaticKeepAliveClientMixin
return BlocBuilder<UserBloc, UserState>(
builder: (context, userState) {
if (userState is UserLoading) {
return Scaffold(body: Center(child: CircularProgressIndicator()));
}
if (userState is UserError) {
return Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(Icons.error, size: 64, color: Colors.red),
SizedBox(height: 16),
Text('Erreur: ${userState.message}'),
],
),
),
);
}
if (userState is! UserLoaded) {
return Scaffold(body: Center(child: Text('Veuillez vous connecter')));
}
final user = userState.user;
return BlocConsumer<TripBloc, TripState>(
listener: (context, tripState) {
if (tripState is TripOperationSuccess) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(tripState.message),
backgroundColor: Colors.green,
),
);
} else if (tripState is TripError) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(tripState.message),
backgroundColor: Colors.red,
),
);
} else if (tripState is TripCreated) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text('Voyage en cours de création...'),
backgroundColor: Colors.blue,
duration: Duration(seconds: 1),
),
);
}
},
builder: (context, tripState) {
// AJOUTÉ : Si l'état est initial et qu'on n'a pas encore chargé, charger maintenant
if (tripState is TripInitial && !_hasLoadedTrips) {
WidgetsBinding.instance.addPostFrameCallback((_) {
_loadTripsIfUserLoaded();
});
}
return Scaffold(
body: RefreshIndicator(
onRefresh: () async {
context.read<TripBloc>().add(
LoadTripsByUserId(userId: user.id),
);
await Future.delayed(Duration(milliseconds: 500));
},
child: SingleChildScrollView(
physics: const AlwaysScrollableScrollPhysics(),
padding: const EdgeInsets.all(16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Bonjour ${user.prenom} !',
style: TextStyle(
fontSize: 28,
fontWeight: FontWeight.bold,
color: Theme.of(context).brightness == Brightness.dark
? Colors.white
: Colors.black,
),
),
const SizedBox(height: 8),
Text(
'Vos voyages',
style: TextStyle(
fontSize: 16,
color: Theme.of(context).brightness == Brightness.dark
? Colors.white70
: Colors.grey[600],
),
),
const SizedBox(height: 20),
if (tripState is TripLoading || tripState is TripCreated)
_buildLoadingState()
else if (tripState is TripError)
_buildErrorState(tripState.message, user.id)
else if (tripState is TripLoaded)
tripState.trips.isEmpty
? _buildEmptyState()
: _buildTripsList(tripState.trips)
else if (tripState is TripInitial)
_buildLoadingState() // Afficher le loader pendant le premier chargement
else
_buildEmptyState(),
const SizedBox(height: 80),
],
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () async {
final tripBloc = context.read<TripBloc>();
final result = await Navigator.push(
context,
MaterialPageRoute(
builder: (context) => const CreateTripContent(),
),
);
if (result == true && mounted) {
tripBloc.add(LoadTripsByUserId(userId: user.id));
}
},
backgroundColor: Theme.of(context).colorScheme.primary,
foregroundColor: Colors.white,
child: const Icon(Icons.add),
),
floatingActionButtonLocation:
FloatingActionButtonLocation.endFloat,
);
},
);
},
);
}
Widget _buildLoadingState() {
return Center(
child: Padding(
padding: EdgeInsets.all(32),
child: CircularProgressIndicator(),
),
);
}
Widget _buildErrorState(String error, String userId) {
return Center(
child: Padding(
padding: EdgeInsets.all(32),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(Icons.error, size: 64, color: Colors.red),
SizedBox(height: 16),
Text('Erreur lors du chargement des voyages'),
SizedBox(height: 8),
Text(
error,
textAlign: TextAlign.center,
style: TextStyle(fontSize: 12, color: Colors.grey),
),
SizedBox(height: 16),
ElevatedButton(
onPressed: () {
context.read<TripBloc>().add(LoadTripsByUserId(userId: userId));
},
child: Text('Réessayer'),
),
],
),
),
);
}
Widget _buildEmptyState() {
return Center(
child: Padding(
padding: EdgeInsets.all(32),
child: Column(
children: [
Icon(Icons.travel_explore, size: 80, color: Colors.grey[400]),
SizedBox(height: 16),
Text(
'Aucun voyage',
style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
),
SizedBox(height: 8),
Text(
'Créez votre premier voyage en appuyant sur le bouton +',
textAlign: TextAlign.center,
style: TextStyle(fontSize: 14, color: Colors.grey[600]),
),
],
),
),
);
}
Widget _buildTripsList(List<Trip> trips) {
return Column(children: trips.map((trip) => _buildTripCard(trip)).toList());
}
Widget _buildTripCard(Trip trip) {
final isDarkMode = Theme.of(context).brightness == Brightness.dark;
final textColor = isDarkMode ? Colors.white : Colors.black;
final subtextColor = isDarkMode ? Colors.white70 : Colors.grey[600];
return Card(
margin: EdgeInsets.only(bottom: 12),
elevation: 2,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Image en haut de la carte
Container(
height: 200,
width: double.infinity,
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(12),
topRight: Radius.circular(12),
),
color: Colors.grey[300],
),
child: ClipRRect(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(12),
topRight: Radius.circular(12),
),
child: trip.imageUrl != null && trip.imageUrl!.isNotEmpty
? Image.network(
trip.imageUrl!,
fit: BoxFit.cover,
errorBuilder: (context, error, stackTrace) {
return Container(
color: Colors.grey[300],
child: Icon(
Icons.image_not_supported,
size: 50,
color: Colors.grey[600],
),
);
},
)
: Container(
color: Colors.grey[300],
child: Icon(
Icons.travel_explore,
size: 50,
color: Colors.grey[600],
),
),
),
),
// Contenu de la carte
Padding(
padding: EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Nom du voyage
Text(
trip.title,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: textColor,
),
),
SizedBox(height: 8),
// Section dates, participants et bouton
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Colonne gauche : dates et participants
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Dates
Row(
children: [
Icon(
Icons.calendar_today,
size: 16,
color: subtextColor,
),
SizedBox(width: 4),
Text(
'${_formatDate(trip.startDate)} - ${_formatDate(trip.endDate)}',
style: TextStyle(
fontSize: 14,
color: subtextColor,
),
),
],
),
SizedBox(height: 8),
// Nombre de participants
Row(
children: [
Icon(Icons.people, size: 16, color: subtextColor),
SizedBox(width: 4),
Text(
'${trip.participants.length} participant${trip.participants.length > 1 ? 's' : ''}',
style: TextStyle(
fontSize: 14,
color: subtextColor,
),
),
],
),
],
),
),
// Bouton "Voir" à droite
ElevatedButton(
onPressed: () async {
final result = await Navigator.push(
context,
MaterialPageRoute(
builder: (context) =>
ShowTripDetailsContent(trip: trip),
),
);
if (result == true && mounted) {
final userState = context.read<UserBloc>().state;
if (userState is UserLoaded) {
context.read<TripBloc>().add(
LoadTripsByUserId(userId: userState.user.id),
);
}
}
},
style: ElevatedButton.styleFrom(
backgroundColor: Theme.of(context).colorScheme.primary,
foregroundColor: Theme.of(
context,
).colorScheme.onPrimary,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
padding: EdgeInsets.symmetric(
horizontal: 16,
vertical: 8,
),
),
child: Text('Voir', style: TextStyle(fontSize: 14)),
),
],
),
],
),
),
],
),
);
}
// Color _getStatusColor(Trip trip) {
// final now = DateTime.now();
// if (now.isBefore(trip.startDate)) {
// return Colors.blue;
// } else if (now.isAfter(trip.endDate)) {
// return Colors.grey;
// } else {
// return Colors.green;
// }
// }
// String _getStatusText(Trip trip) {
// final now = DateTime.now();
// if (now.isBefore(trip.startDate)) {
// return 'À venir';
// } else if (now.isAfter(trip.endDate)) {
// return 'Terminé';
// } else {
// return 'En cours';
// }
// }
String _formatDate(DateTime date) {
return '${date.day.toString().padLeft(2, '0')}/${date.month.toString().padLeft(2, '0')}/${date.year}';
}
}