Initial commit: unionflow-mobile-apps
Application Flutter complète (sans build artifacts). Signed-off-by: lions dev Team
This commit is contained in:
dahoud
196
lib/presentation/notifications/notification_page.dart
Normal file
196
lib/presentation/notifications/notification_page.dart
Normal file
@@ -0,0 +1,196 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||
|
||||
import '../widgets/shared/mini_header_bar.dart';
|
||||
import '../../shared/widgets/core_card.dart';
|
||||
import '../../shared/widgets/core_shimmer.dart';
|
||||
import '../../shared/design_system/tokens/app_typography.dart';
|
||||
import '../../shared/design_system/tokens/app_colors.dart';
|
||||
|
||||
import '../../core/di/injection.dart';
|
||||
import '../../features/notifications/presentation/bloc/notification_bloc.dart';
|
||||
import '../../features/notifications/presentation/bloc/notification_event.dart';
|
||||
import '../../features/notifications/presentation/bloc/notification_state.dart';
|
||||
import '../../features/contributions/presentation/pages/contributions_page_wrapper.dart';
|
||||
import '../../features/epargne/presentation/pages/epargne_page.dart';
|
||||
import '../../features/events/presentation/pages/events_page_wrapper.dart';
|
||||
import '../../features/adhesions/presentation/pages/adhesions_page_wrapper.dart';
|
||||
import '../../features/organizations/presentation/pages/organizations_page_wrapper.dart';
|
||||
import '../../features/members/presentation/pages/members_page_wrapper.dart';
|
||||
|
||||
void _navigateForCategory(BuildContext context, String category) {
|
||||
switch (category.toLowerCase()) {
|
||||
case 'finance':
|
||||
case 'cotisation':
|
||||
Navigator.of(context).push(
|
||||
MaterialPageRoute<void>(builder: (_) => const ContributionsPageWrapper()),
|
||||
);
|
||||
break;
|
||||
case 'event':
|
||||
case 'events':
|
||||
Navigator.of(context).push(
|
||||
MaterialPageRoute<void>(builder: (_) => const EventsPageWrapper()),
|
||||
);
|
||||
break;
|
||||
case 'epargne':
|
||||
Navigator.of(context).push(
|
||||
MaterialPageRoute<void>(builder: (_) => const EpargnePage()),
|
||||
);
|
||||
break;
|
||||
case 'adhesion':
|
||||
case 'adhesions':
|
||||
Navigator.of(context).push(
|
||||
MaterialPageRoute<void>(builder: (_) => const AdhesionsPageWrapper()),
|
||||
);
|
||||
break;
|
||||
case 'organisation':
|
||||
case 'organization':
|
||||
case 'organisations':
|
||||
case 'organizations':
|
||||
Navigator.of(context).push(
|
||||
MaterialPageRoute<void>(builder: (_) => const OrganizationsPageWrapper()),
|
||||
);
|
||||
break;
|
||||
case 'member':
|
||||
case 'membre':
|
||||
case 'members':
|
||||
case 'membres':
|
||||
Navigator.of(context).push(
|
||||
MaterialPageRoute<void>(builder: (_) => const MembersPageWrapper()),
|
||||
);
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
/// UnionFlow Mobile - Onglet Notifications (Mode DRY)
|
||||
/// Liste de notifications avec coloration subtile pour les non-lues.
|
||||
class NotificationPage extends StatelessWidget {
|
||||
const NotificationPage({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return BlocProvider(
|
||||
create: (_) => getIt<NotificationBloc>()..add(LoadNotificationsRequested()),
|
||||
child: const _NotificationView(),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _NotificationView extends StatelessWidget {
|
||||
const _NotificationView();
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final isDark = Theme.of(context).brightness == Brightness.dark;
|
||||
|
||||
return Scaffold(
|
||||
appBar: const MiniHeaderBar(title: 'Notifications'),
|
||||
body: BlocBuilder<NotificationBloc, NotificationState>(
|
||||
builder: (context, state) {
|
||||
if (state is NotificationInitial || state is NotificationLoading) {
|
||||
return const Padding(
|
||||
padding: EdgeInsets.all(8.0),
|
||||
child: CoreShimmer(itemCount: 8),
|
||||
);
|
||||
}
|
||||
|
||||
if (state is NotificationError) {
|
||||
return Center(
|
||||
child: Text(
|
||||
state.message,
|
||||
style: AppTypography.bodyTextSmall.copyWith(color: AppColors.error),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
if (state is NotificationLoaded) {
|
||||
if (state.items.isEmpty) {
|
||||
return const Center(
|
||||
child: Text('Aucune notification.', style: AppTypography.subtitleSmall),
|
||||
);
|
||||
}
|
||||
|
||||
return ListView.builder(
|
||||
itemCount: state.items.length,
|
||||
itemBuilder: (context, index) {
|
||||
final item = state.items[index];
|
||||
final unreadColor = isDark ? const Color(0xFF1B2E26) : const Color(0xFFE8F5E9);
|
||||
|
||||
return InkWell(
|
||||
onTap: () {
|
||||
if (!item.isRead) {
|
||||
context.read<NotificationBloc>().add(NotificationMarkedAsRead(item.id));
|
||||
}
|
||||
_navigateForCategory(context, item.category);
|
||||
},
|
||||
child: Container(
|
||||
color: item.isRead ? Colors.transparent : unreadColor,
|
||||
child: CoreCard(
|
||||
margin: EdgeInsets.zero, // Retire la marge pour coller les items de liste
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Icon(
|
||||
item.category == 'finance' ? Icons.payment : Icons.event,
|
||||
color: item.isRead
|
||||
? (isDark ? AppColors.textSecondaryDark : AppColors.textSecondaryLight)
|
||||
: AppColors.primaryGreen,
|
||||
size: 20,
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Expanded(
|
||||
child: Text(
|
||||
item.title,
|
||||
style: AppTypography.actionText,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
_formatDate(item.date),
|
||||
style: AppTypography.subtitleSmall,
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
item.body,
|
||||
style: AppTypography.bodyTextSmall,
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
return const SizedBox.shrink();
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
String _formatDate(DateTime date) {
|
||||
// Mock simple (dans un vrai cas, utiliser 'intl' ou 'timeago')
|
||||
final diff = DateTime.now().difference(date);
|
||||
if (diff.inHours < 24) return 'il y a ${diff.inHours}h';
|
||||
return '${date.day}/${date.month}';
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user