lionsdev/unionflow-mobile-apps
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit: unionflow-mobile-apps

Browse Source 
Application Flutter complète (sans build artifacts).

Signed-off-by: lions dev Team
This commit is contained in:
dahoud
2026-03-15 16:30:08 +00:00
commit d094d6db9c
1790 changed files with 507435 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

123
lib/shared/widgets/action_row.dart Normal file
View File

@@ -0,0 +1,123 @@
import 'package:flutter/material.dart';
import '../design_system/tokens/app_colors.dart';
import '../design_system/tokens/app_typography.dart';
/// UnionFlow Mobile - Composant DRY : ActionRow
/// Centralise les interactions (J'aime, Commenter, Partager, etc.) sous une barre compacte.
class ActionRow extends StatelessWidget {
final int? likesCount;
final int? commentsCount;
final VoidCallback? onLike;
final VoidCallback? onComment;
final VoidCallback? onShare;
final bool isLiked; // Permet de teinter l'icône Like
// Peut être personnalisé pour des actions spécifiques (ex: Payer)
final String? customActionLabel;
final VoidCallback? onCustomAction;
final IconData? customActionIcon;
const ActionRow({
Key? key,
this.likesCount,
this.commentsCount,
this.onLike,
this.onComment,
this.onShare,
this.isLiked = false,
this.customActionLabel,
this.onCustomAction,
this.customActionIcon,
}) : super(key: key);
@override
Widget build(BuildContext context) {
final isDark = Theme.of(context).brightness == Brightness.dark;
final iconColor = isDark ? AppColors.textSecondaryDark : AppColors.textSecondaryLight;
return Padding(
padding: const EdgeInsets.only(top: 8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
// Actions standards (Like/Comment/Share)
Row(
children: [
if (onLike != null)
_buildActionIcon(
icon: isLiked ? Icons.favorite : Icons.favorite_border,
color: isLiked ? AppColors.error : iconColor,
count: likesCount,
onTap: onLike!,
),
if (onLike != null && onComment != null) const SizedBox(width: 24),
if (onComment != null)
_buildActionIcon(
icon: Icons.chat_bubble_outline,
color: iconColor,
count: commentsCount,
onTap: onComment!,
),
if (onComment != null && onShare != null) const SizedBox(width: 24),
if (onShare != null)
_buildActionIcon(
icon: Icons.share_outlined,
color: iconColor,
onTap: onShare!,
),
],
),
// Action personnalisée à droite (ex: Payer la cotisation)
if (onCustomAction != null)
GestureDetector(
onTap: onCustomAction,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
decoration: BoxDecoration(
color: AppColors.primaryGreen.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
),
child: Row(
children: [
if (customActionIcon != null) ...[
Icon(customActionIcon, size: 14, color: AppColors.primaryGreen),
const SizedBox(width: 4),
],
Text(
customActionLabel ?? '',
style: AppTypography.badgeText.copyWith(color: AppColors.primaryGreen),
),
],
),
),
),
],
),
);
}
Widget _buildActionIcon({
required IconData icon,
required Color color,
required VoidCallback onTap,
int? count,
}) {
return GestureDetector(
onTap: onTap,
behavior: HitTestBehavior.opaque,
child: Row(
children: [
Icon(icon, size: 16, color: color),
if (count != null && count > 0) ...[
const SizedBox(width: 4),
Text(
count.toString(),
style: AppTypography.subtitleSmall.copyWith(color: color),
),
]
],
),
);
}
}

396
lib/shared/widgets/adaptive_widget.dart Normal file
View File

@@ -0,0 +1,396 @@
/// Widget adaptatif révolutionnaire avec morphing intelligent
/// Transformation dynamique selon le rôle utilisateur avec animations fluides
library adaptive_widget;
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../features/authentication/data/models/user.dart';
import '../../features/authentication/data/models/user_role.dart';
import '../../features/authentication/data/datasources/permission_engine.dart';
import '../../features/authentication/presentation/bloc/auth_bloc.dart';
/// Widget adaptatif révolutionnaire qui se transforme selon le rôle utilisateur
///
/// Fonctionnalités :
/// - Morphing intelligent avec animations fluides
/// - Widgets spécifiques par rôle
/// - Vérification de permissions intégrée
/// - Fallback gracieux pour les rôles non supportés
/// - Cache des widgets pour les performances
class AdaptiveWidget extends StatefulWidget {
/// Widgets spécifiques par rôle utilisateur
final Map<UserRole, Widget Function()> roleWidgets;
/// Permissions requises pour afficher le widget
final List<String> requiredPermissions;
/// Widget affiché si les permissions sont insuffisantes
final Widget? fallbackWidget;
/// Widget affiché pendant le chargement
final Widget? loadingWidget;
/// Activer les animations de morphing
final bool enableMorphing;
/// Durée de l'animation de morphing
final Duration morphingDuration;
/// Courbe d'animation
final Curve animationCurve;
/// Contexte organisationnel pour les permissions
final String? organizationId;
/// Activer l'audit trail
final bool auditLog;
/// Constructeur du widget adaptatif
const AdaptiveWidget({
super.key,
required this.roleWidgets,
this.requiredPermissions = const [],
this.fallbackWidget,
this.loadingWidget,
this.enableMorphing = true,
this.morphingDuration = const Duration(milliseconds: 800),
this.animationCurve = Curves.easeInOutCubic,
this.organizationId,
this.auditLog = true,
});
@override
State<AdaptiveWidget> createState() => _AdaptiveWidgetState();
}
class _AdaptiveWidgetState extends State<AdaptiveWidget>
with TickerProviderStateMixin {
/// Cache des widgets construits pour éviter les reconstructions
final Map<UserRole, Widget> _widgetCache = {};
/// Contrôleur d'animation pour le morphing
late AnimationController _morphController;
/// Animation d'opacité
late Animation<double> _opacityAnimation;
/// Animation d'échelle
late Animation<double> _scaleAnimation;
/// Rôle utilisateur précédent pour détecter les changements
UserRole? _previousRole;
@override
void initState() {
super.initState();
_initializeAnimations();
}
@override
void dispose() {
_morphController.dispose();
super.dispose();
}
/// Initialise les animations de morphing
void _initializeAnimations() {
_morphController = AnimationController(
duration: widget.morphingDuration,
vsync: this,
);
_opacityAnimation = Tween<double>(
begin: 0.0,
end: 1.0,
).animate(CurvedAnimation(
parent: _morphController,
curve: widget.animationCurve,
));
_scaleAnimation = Tween<double>(
begin: 0.95,
end: 1.0,
).animate(CurvedAnimation(
parent: _morphController,
curve: widget.animationCurve,
));
// Démarrer l'animation initiale
_morphController.forward();
}
@override
Widget build(BuildContext context) {
return BlocBuilder<AuthBloc, AuthState>(
builder: (context, state) {
// État de chargement
if (state is AuthLoading) {
return widget.loadingWidget ?? _buildLoadingWidget();
}
// État non authentifié
if (state is! AuthAuthenticated) {
return _buildForRole(UserRole.visitor);
}
final user = state.user;
final currentRole = user.primaryRole;
// Détecter le changement de rôle pour déclencher l'animation
if (_previousRole != null && _previousRole != currentRole && widget.enableMorphing) {
_triggerMorphing();
}
_previousRole = currentRole;
return FutureBuilder<bool>(
future: _checkPermissions(user),
builder: (context, permissionSnapshot) {
if (permissionSnapshot.connectionState == ConnectionState.waiting) {
return widget.loadingWidget ?? _buildLoadingWidget();
}
final hasPermissions = permissionSnapshot.data ?? false;
if (!hasPermissions) {
return widget.fallbackWidget ?? _buildUnauthorizedWidget();
}
return _buildForRole(currentRole);
},
);
},
);
}
/// Construit le widget pour un rôle spécifique
Widget _buildForRole(UserRole role) {
// Vérifier le cache
if (_widgetCache.containsKey(role)) {
return _wrapWithAnimation(_widgetCache[role]!);
}
// Trouver le widget approprié
Widget? widget = _findWidgetForRole(role);
widget ??= this.widget.fallbackWidget ?? _buildUnsupportedRoleWidget(role);
// Mettre en cache
_widgetCache[role] = widget;
return _wrapWithAnimation(widget);
}
/// Trouve le widget approprié pour un rôle
Widget? _findWidgetForRole(UserRole role) {
// Vérification directe
if (widget.roleWidgets.containsKey(role)) {
return widget.roleWidgets[role]!();
}
// Recherche du meilleur match par niveau de rôle
UserRole? bestMatch;
for (final availableRole in widget.roleWidgets.keys) {
if (availableRole.level <= role.level) {
if (bestMatch == null || availableRole.level > bestMatch.level) {
bestMatch = availableRole;
}
}
}
return bestMatch != null ? widget.roleWidgets[bestMatch]!() : null;
}
/// Enveloppe le widget avec les animations
Widget _wrapWithAnimation(Widget child) {
if (!widget.enableMorphing) return child;
return AnimatedBuilder(
animation: _morphController,
builder: (context, _) {
return Transform.scale(
scale: _scaleAnimation.value,
child: Opacity(
opacity: _opacityAnimation.value,
child: child,
),
);
},
);
}
/// Déclenche l'animation de morphing
void _triggerMorphing() {
_morphController.reset();
_morphController.forward();
// Vider le cache pour forcer la reconstruction
_widgetCache.clear();
}
/// Vérifie les permissions requises
Future<bool> _checkPermissions(User user) async {
if (widget.requiredPermissions.isEmpty) return true;
final results = await PermissionEngine.hasPermissions(
user,
widget.requiredPermissions,
organizationId: widget.organizationId,
auditLog: widget.auditLog,
);
return results.values.every((hasPermission) => hasPermission);
}
/// Widget de chargement par défaut
Widget _buildLoadingWidget() {
return const Center(
child: SizedBox(
width: 24,
height: 24,
child: CircularProgressIndicator(strokeWidth: 2),
),
);
}
/// Widget non autorisé par défaut
Widget _buildUnauthorizedWidget() {
return Container(
padding: const EdgeInsets.all(16),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
Icons.lock_outline,
size: 48,
color: Theme.of(context).disabledColor,
),
const SizedBox(height: 8),
Text(
'Accès non autorisé',
style: Theme.of(context).textTheme.titleMedium?.copyWith(
color: Theme.of(context).disabledColor,
),
),
const SizedBox(height: 4),
Text(
'Vous n\'avez pas les permissions nécessaires',
style: Theme.of(context).textTheme.bodySmall?.copyWith(
color: Theme.of(context).disabledColor,
),
textAlign: TextAlign.center,
),
],
),
);
}
/// Widget pour rôle non supporté
Widget _buildUnsupportedRoleWidget(UserRole role) {
return Container(
padding: const EdgeInsets.all(16),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
Icons.warning_outlined,
size: 48,
color: Theme.of(context).colorScheme.error,
),
const SizedBox(height: 8),
Text(
'Rôle non supporté',
style: Theme.of(context).textTheme.titleMedium?.copyWith(
color: Theme.of(context).colorScheme.error,
),
),
const SizedBox(height: 4),
Text(
'Le rôle ${role.displayName} n\'est pas supporté par ce widget',
style: Theme.of(context).textTheme.bodySmall,
textAlign: TextAlign.center,
),
],
),
);
}
}
/// Widget sécurisé avec vérification de permissions intégrée
///
/// Version simplifiée d'AdaptiveWidget pour les cas où seules
/// les permissions importent, pas le rôle spécifique
class SecureWidget extends StatelessWidget {
/// Permissions requises pour afficher le widget
final List<String> requiredPermissions;
/// Widget à afficher si autorisé
final Widget child;
/// Widget à afficher si non autorisé
final Widget? unauthorizedWidget;
/// Widget à afficher pendant le chargement
final Widget? loadingWidget;
/// Contexte organisationnel
final String? organizationId;
/// Activer l'audit trail
final bool auditLog;
/// Constructeur du widget sécurisé
const SecureWidget({
super.key,
required this.requiredPermissions,
required this.child,
this.unauthorizedWidget,
this.loadingWidget,
this.organizationId,
this.auditLog = true,
});
@override
Widget build(BuildContext context) {
return BlocBuilder<AuthBloc, AuthState>(
builder: (context, state) {
if (state is AuthLoading) {
return loadingWidget ?? const SizedBox.shrink();
}
if (state is! AuthAuthenticated) {
return unauthorizedWidget ?? const SizedBox.shrink();
}
return FutureBuilder<bool>(
future: _checkPermissions(state.user),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return loadingWidget ?? const SizedBox.shrink();
}
final hasPermissions = snapshot.data ?? false;
if (!hasPermissions) {
return unauthorizedWidget ?? const SizedBox.shrink();
}
return child;
},
);
},
);
}
/// Vérifie les permissions requises
Future<bool> _checkPermissions(User user) async {
if (requiredPermissions.isEmpty) return true;
final results = await PermissionEngine.hasPermissions(
user,
requiredPermissions,
organizationId: organizationId,
auditLog: auditLog,
);
return results.values.every((hasPermission) => hasPermission);
}
}

292
lib/shared/widgets/confirmation_dialog.dart Normal file
View File

@@ -0,0 +1,292 @@
/// Dialogue de confirmation réutilisable
/// Utilisé pour confirmer les actions critiques (suppression, etc.)
library confirmation_dialog;
import 'package:flutter/material.dart';
/// Type d'action pour personnaliser l'apparence du dialogue
enum ConfirmationAction {
delete,
deactivate,
activate,
cancel,
warning,
info,
}
/// Dialogue de confirmation générique
class ConfirmationDialog extends StatelessWidget {
final String title;
final String message;
final String confirmText;
final String cancelText;
final ConfirmationAction action;
final VoidCallback? onConfirm;
final VoidCallback? onCancel;
const ConfirmationDialog({
super.key,
required this.title,
required this.message,
this.confirmText = 'Confirmer',
this.cancelText = 'Annuler',
this.action = ConfirmationAction.warning,
this.onConfirm,
this.onCancel,
});
/// Constructeur pour suppression
const ConfirmationDialog.delete({
super.key,
required this.title,
required this.message,
this.confirmText = 'Supprimer',
this.cancelText = 'Annuler',
this.onConfirm,
this.onCancel,
}) : action = ConfirmationAction.delete;
/// Constructeur pour désactivation
const ConfirmationDialog.deactivate({
super.key,
required this.title,
required this.message,
this.confirmText = 'Désactiver',
this.cancelText = 'Annuler',
this.onConfirm,
this.onCancel,
}) : action = ConfirmationAction.deactivate;
/// Constructeur pour activation
const ConfirmationDialog.activate({
super.key,
required this.title,
required this.message,
this.confirmText = 'Activer',
this.cancelText = 'Annuler',
this.onConfirm,
this.onCancel,
}) : action = ConfirmationAction.activate;
@override
Widget build(BuildContext context) {
final colors = _getColors();
return AlertDialog(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
title: Row(
children: [
Icon(
_getIcon(),
color: colors['icon'],
size: 28,
),
const SizedBox(width: 12),
Expanded(
child: Text(
title,
style: TextStyle(
color: colors['title'],
fontWeight: FontWeight.bold,
fontSize: 18,
),
),
),
],
),
content: Text(
message,
style: const TextStyle(
fontSize: 16,
height: 1.5,
),
),
actions: [
TextButton(
onPressed: () {
Navigator.pop(context, false);
onCancel?.call();
},
child: Text(
cancelText,
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.w500,
),
),
),
ElevatedButton(
onPressed: () {
Navigator.pop(context, true);
onConfirm?.call();
},
style: ElevatedButton.styleFrom(
backgroundColor: colors['button'],
foregroundColor: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 12),
),
child: Text(
confirmText,
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
),
],
);
}
IconData _getIcon() {
switch (action) {
case ConfirmationAction.delete:
return Icons.delete_forever;
case ConfirmationAction.deactivate:
return Icons.block;
case ConfirmationAction.activate:
return Icons.check_circle;
case ConfirmationAction.cancel:
return Icons.cancel;
case ConfirmationAction.warning:
return Icons.warning;
case ConfirmationAction.info:
return Icons.info;
}
}
Map<String, Color> _getColors() {
switch (action) {
case ConfirmationAction.delete:
return {
'icon': Colors.red,
'title': Colors.red[700]!,
'button': Colors.red,
};
case ConfirmationAction.deactivate:
return {
'icon': Colors.orange,
'title': Colors.orange[700]!,
'button': Colors.orange,
};
case ConfirmationAction.activate:
return {
'icon': Colors.green,
'title': Colors.green[700]!,
'button': Colors.green,
};
case ConfirmationAction.cancel:
return {
'icon': Colors.grey,
'title': Colors.grey[700]!,
'button': Colors.grey,
};
case ConfirmationAction.warning:
return {
'icon': Colors.amber,
'title': Colors.amber[700]!,
'button': Colors.amber,
};
case ConfirmationAction.info:
return {
'icon': Colors.blue,
'title': Colors.blue[700]!,
'button': Colors.blue,
};
}
}
}
/// Fonction utilitaire pour afficher un dialogue de confirmation
Future<bool> showConfirmationDialog({
required BuildContext context,
required String title,
required String message,
String confirmText = 'Confirmer',
String cancelText = 'Annuler',
ConfirmationAction action = ConfirmationAction.warning,
}) async {
final result = await showDialog<bool>(
context: context,
builder: (context) => ConfirmationDialog(
title: title,
message: message,
confirmText: confirmText,
cancelText: cancelText,
action: action,
onConfirm: () {},
onCancel: () {},
),
);
return result ?? false;
}
/// Fonction utilitaire pour dialogue de suppression
Future<bool> showDeleteConfirmation({
required BuildContext context,
required String itemName,
String? additionalMessage,
}) async {
final message = additionalMessage != null
? 'Êtes-vous sûr de vouloir supprimer "$itemName" ?\n\n$additionalMessage\n\nCette action est irréversible.'
: 'Êtes-vous sûr de vouloir supprimer "$itemName" ?\n\nCette action est irréversible.';
final result = await showDialog<bool>(
context: context,
builder: (context) => ConfirmationDialog.delete(
title: 'Confirmer la suppression',
message: message,
onConfirm: () {},
onCancel: () {},
),
);
return result ?? false;
}
/// Fonction utilitaire pour dialogue de désactivation
Future<bool> showDeactivateConfirmation({
required BuildContext context,
required String itemName,
String? reason,
}) async {
final message = reason != null
? 'Êtes-vous sûr de vouloir désactiver "$itemName" ?\n\n$reason'
: 'Êtes-vous sûr de vouloir désactiver "$itemName" ?';
final result = await showDialog<bool>(
context: context,
builder: (context) => ConfirmationDialog.deactivate(
title: 'Confirmer la désactivation',
message: message,
onConfirm: () {},
onCancel: () {},
),
);
return result ?? false;
}
/// Fonction utilitaire pour dialogue d'activation
Future<bool> showActivateConfirmation({
required BuildContext context,
required String itemName,
}) async {
final result = await showDialog<bool>(
context: context,
builder: (context) => ConfirmationDialog.activate(
title: 'Confirmer l\'activation',
message: 'Êtes-vous sûr de vouloir activer "$itemName" ?',
onConfirm: () {},
onCancel: () {},
),
);
return result ?? false;
}

58
lib/shared/widgets/core_card.dart Normal file
View File

@@ -0,0 +1,58 @@
import 'package:flutter/material.dart';
import '../design_system/tokens/app_colors.dart';
/// UnionFlow Mobile - Composant DRY Centralisé : CoreCard
/// Le seul et unique conteneur d'affichage (Posts, Événements, Profils).
/// Design : Minimaliste Premium, Bordures ultra-fines, Ombre invisible mais présente.
class CoreCard extends StatelessWidget {
final Widget child;
final EdgeInsetsGeometry padding;
final EdgeInsetsGeometry margin;
final VoidCallback? onTap;
final Color? backgroundColor;
const CoreCard({
Key? key,
required this.child,
this.padding = const EdgeInsets.all(12.0),
this.margin = const EdgeInsets.only(bottom: 10.0),
this.onTap,
this.backgroundColor,
}) : super(key: key);
@override
Widget build(BuildContext context) {
final isDark = Theme.of(context).brightness == Brightness.dark;
return Container(
width: double.infinity,
margin: margin,
decoration: BoxDecoration(
color: backgroundColor ?? (isDark ? const Color(0xFF1A1A1A) : Colors.white),
borderRadius: BorderRadius.circular(6.0),
border: Border.all(
color: isDark ? AppColors.darkBorder.withOpacity(0.5) : AppColors.lightBorder,
width: 0.4,
),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(isDark ? 0.3 : 0.03),
blurRadius: 10,
offset: const Offset(0, 4),
),
],
),
child: Material(
color: Colors.transparent,
child: InkWell(
onTap: onTap,
borderRadius: BorderRadius.circular(6.0),
child: Padding(
padding: padding,
child: child,
),
),
),
);
}
}

73
lib/shared/widgets/core_shimmer.dart Normal file
View File

@@ -0,0 +1,73 @@
import 'package:flutter/material.dart';
import 'package:shimmer/shimmer.dart';
import '../design_system/tokens/app_colors.dart';
import 'core_card.dart';
/// UnionFlow Mobile - Composant DRY : CoreShimmer
/// Utilise `shimmer` package pour générer des loaders élégants sans textes.
class CoreShimmer extends StatelessWidget {
final int itemCount;
const CoreShimmer({
Key? key,
this.itemCount = 5,
}) : super(key: key);
@override
Widget build(BuildContext context) {
final isDark = Theme.of(context).brightness == Brightness.dark;
final baseColor = isDark ? Colors.grey[800]! : Colors.grey[300]!;
final highlightColor = isDark ? Colors.grey[700]! : Colors.grey[100]!;
return ListView.builder(
itemCount: itemCount,
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
itemBuilder: (_, __) => Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: Shimmer.fromColors(
baseColor: baseColor,
highlightColor: highlightColor,
child: CoreCard(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
CircleAvatar(radius: 16, backgroundColor: Colors.white),
SizedBox(width: 8),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(width: 100, height: 10, color: Colors.white),
SizedBox(height: 4),
Container(width: 40, height: 8, color: Colors.white),
],
),
),
],
),
SizedBox(height: 12),
Container(width: double.infinity, height: 10, color: Colors.white),
SizedBox(height: 4),
Container(width: 250, height: 10, color: Colors.white),
SizedBox(height: 4),
Container(width: 150, height: 10, color: Colors.white),
SizedBox(height: 12),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Container(width: 40, height: 12, color: Colors.white),
Container(width: 40, height: 12, color: Colors.white),
Container(width: 40, height: 12, color: Colors.white),
],
),
],
),
),
),
),
);
}
}

76
lib/shared/widgets/core_text_field.dart Normal file
View File

@@ -0,0 +1,76 @@
import 'package:flutter/material.dart';
import '../design_system/tokens/app_colors.dart';
import '../design_system/tokens/app_typography.dart';
/// UnionFlow Mobile - Composant DRY : CoreTextField
/// Champ de texte minimaliste, fin, sans bordures massives.
class CoreTextField extends StatelessWidget {
final String hintText;
final IconData? prefixIcon;
final bool obscureText;
final TextEditingController? controller;
final TextInputType keyboardType;
final String? errorText;
const CoreTextField({
Key? key,
required this.hintText,
this.prefixIcon,
this.obscureText = false,
this.controller,
this.keyboardType = TextInputType.text,
this.errorText,
}) : super(key: key);
@override
Widget build(BuildContext context) {
final isDark = Theme.of(context).brightness == Brightness.dark;
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
TextField(
controller: controller,
obscureText: obscureText,
keyboardType: keyboardType,
style: AppTypography.actionText, // Texte d'entrée assez lisible
decoration: InputDecoration(
hintText: hintText,
hintStyle: AppTypography.subtitleSmall.copyWith(
color: isDark ? AppColors.textSecondaryDark : AppColors.textSecondaryLight,
),
prefixIcon: prefixIcon != null
? Icon(prefixIcon, size: 20, color: AppColors.primaryGreen)
: null,
filled: true,
fillColor: isDark ? AppColors.darkSurface : AppColors.lightSurface,
contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: BorderSide(
color: isDark ? AppColors.darkBorder : AppColors.lightBorder,
width: 1,
),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: BorderSide(
color: isDark ? AppColors.darkBorder : AppColors.lightBorder,
width: 1,
),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: const BorderSide(
color: AppColors.primaryGreen,
width: 1.5,
),
),
errorText: errorText,
errorStyle: AppTypography.badgeText.copyWith(color: AppColors.error),
),
),
],
);
}
}

43
lib/shared/widgets/dynamic_fab.dart Normal file
View File

@@ -0,0 +1,43 @@
import 'package:flutter/material.dart';
import '../design_system/tokens/app_colors.dart';
import '../design_system/tokens/app_typography.dart';
/// UnionFlow Mobile - Composant DRY : DynamicFAB
/// Bouton Flottant "Twitter Style" paramétrable pour les actions principales.
class DynamicFAB extends StatelessWidget {
final VoidCallback onPressed;
final IconData icon;
final String? label; // Si null, c'est juste un bouton rond. Si texte, c'est un "extended" FAB.
const DynamicFAB({
Key? key,
required this.onPressed,
required this.icon,
this.label,
}) : super(key: key);
@override
Widget build(BuildContext context) {
if (label != null) {
return FloatingActionButton.extended(
onPressed: onPressed,
backgroundColor: AppColors.primaryGreen,
foregroundColor: Colors.white,
elevation: 4,
icon: Icon(icon, size: 20),
label: Text(
label!,
style: AppTypography.actionText,
),
);
}
return FloatingActionButton(
onPressed: onPressed,
backgroundColor: AppColors.primaryGreen,
foregroundColor: Colors.white,
elevation: 4,
child: Icon(icon, size: 24),
);
}
}

286
lib/shared/widgets/error_display_widget.dart Normal file
View File

@@ -0,0 +1,286 @@
/// Widget for displaying user-friendly error messages with retry capability
library error_display_widget;
import 'package:flutter/material.dart';
import '../../core/error/failures.dart';
/// Error display widget that shows failures in a user-friendly way
class ErrorDisplayWidget extends StatelessWidget {
final Failure failure;
final VoidCallback? onRetry;
final bool showRetryButton;
const ErrorDisplayWidget({
super.key,
required this.failure,
this.onRetry,
this.showRetryButton = true,
});
@override
Widget build(BuildContext context) {
return Center(
child: Padding(
padding: const EdgeInsets.all(24.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// Error icon
Icon(
_getErrorIcon(),
size: 64,
color: _getErrorColor(context),
),
const SizedBox(height: 24),
// Error title
Text(
_getErrorTitle(),
style: Theme.of(context).textTheme.titleLarge?.copyWith(
fontWeight: FontWeight.bold,
color: _getErrorColor(context),
),
textAlign: TextAlign.center,
),
const SizedBox(height: 12),
// Error message
Text(
failure.getUserMessage(),
style: Theme.of(context).textTheme.bodyLarge?.copyWith(
color: Colors.grey[600],
),
textAlign: TextAlign.center,
),
// Retry button (if retryable and callback provided)
if (showRetryButton && failure.isRetryable && onRetry != null) ...[
const SizedBox(height: 32),
ElevatedButton.icon(
onPressed: onRetry,
icon: const Icon(Icons.refresh),
label: const Text('Réessayer'),
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.symmetric(
horizontal: 32,
vertical: 16,
),
),
),
],
],
),
),
);
}
/// Get appropriate icon for error type
IconData _getErrorIcon() {
if (failure is NetworkFailure) {
return Icons.wifi_off;
} else if (failure is UnauthorizedFailure) {
return Icons.lock_outline;
} else if (failure is ForbiddenFailure) {
return Icons.block;
} else if (failure is NotFoundFailure) {
return Icons.search_off;
} else if (failure is ValidationFailure) {
return Icons.error_outline;
} else if (failure is ServerFailure) {
return Icons.cloud_off;
} else {
return Icons.warning_amber;
}
}
/// Get appropriate color for error type
Color _getErrorColor(BuildContext context) {
if (failure is NetworkFailure) {
return Colors.orange;
} else if (failure is UnauthorizedFailure) {
return Colors.red;
} else if (failure is ForbiddenFailure) {
return Colors.deepOrange;
} else if (failure is ValidationFailure) {
return Colors.amber;
} else {
return Theme.of(context).colorScheme.error;
}
}
/// Get appropriate title for error type
String _getErrorTitle() {
if (failure is NetworkFailure) {
return 'Problème de connexion';
} else if (failure is UnauthorizedFailure) {
return 'Session expirée';
} else if (failure is ForbiddenFailure) {
return 'Accès refusé';
} else if (failure is NotFoundFailure) {
return 'Non trouvé';
} else if (failure is ValidationFailure) {
return 'Données invalides';
} else if (failure is ServerFailure) {
return 'Erreur serveur';
} else {
return 'Une erreur est survenue';
}
}
}
/// Compact error banner for inline display
class ErrorBanner extends StatelessWidget {
final Failure failure;
final VoidCallback? onRetry;
final VoidCallback? onDismiss;
const ErrorBanner({
super.key,
required this.failure,
this.onRetry,
this.onDismiss,
});
@override
Widget build(BuildContext context) {
return Container(
margin: const EdgeInsets.all(16),
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: _getErrorColor(context).withOpacity(0.1),
border: Border.all(
color: _getErrorColor(context),
width: 1,
),
borderRadius: BorderRadius.circular(8),
),
child: Row(
children: [
Icon(
_getErrorIcon(),
color: _getErrorColor(context),
),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
_getErrorTitle(),
style: TextStyle(
fontWeight: FontWeight.bold,
color: _getErrorColor(context),
),
),
const SizedBox(height: 4),
Text(
failure.getUserMessage(),
style: TextStyle(
fontSize: 13,
color: Colors.grey[700],
),
),
],
),
),
if (failure.isRetryable && onRetry != null)
TextButton(
onPressed: onRetry,
child: const Text('Réessayer'),
),
if (onDismiss != null)
IconButton(
icon: const Icon(Icons.close, size: 20),
onPressed: onDismiss,
padding: EdgeInsets.zero,
constraints: const BoxConstraints(),
),
],
),
);
}
IconData _getErrorIcon() {
if (failure is NetworkFailure) {
return Icons.wifi_off;
} else if (failure is UnauthorizedFailure) {
return Icons.lock_outline;
} else if (failure is ForbiddenFailure) {
return Icons.block;
} else if (failure is NotFoundFailure) {
return Icons.search_off;
} else if (failure is ValidationFailure) {
return Icons.error_outline;
} else if (failure is ServerFailure) {
return Icons.cloud_off;
} else {
return Icons.warning_amber;
}
}
Color _getErrorColor(BuildContext context) {
if (failure is NetworkFailure) {
return Colors.orange;
} else if (failure is UnauthorizedFailure) {
return Colors.red;
} else if (failure is ForbiddenFailure) {
return Colors.deepOrange;
} else if (failure is ValidationFailure) {
return Colors.amber;
} else {
return Theme.of(context).colorScheme.error;
}
}
String _getErrorTitle() {
if (failure is NetworkFailure) {
return 'Problème de connexion';
} else if (failure is UnauthorizedFailure) {
return 'Session expirée';
} else if (failure is ForbiddenFailure) {
return 'Accès refusé';
} else if (failure is NotFoundFailure) {
return 'Non trouvé';
} else if (failure is ValidationFailure) {
return 'Données invalides';
} else if (failure is ServerFailure) {
return 'Erreur serveur';
} else {
return 'Erreur';
}
}
}
/// Show error as a SnackBar
void showErrorSnackBar(
BuildContext context,
Failure failure, {
VoidCallback? onRetry,
}) {
final snackBar = SnackBar(
content: Row(
children: [
Icon(
failure is NetworkFailure ? Icons.wifi_off : Icons.error_outline,
color: Colors.white,
),
const SizedBox(width: 12),
Expanded(
child: Text(failure.getUserMessage()),
),
],
),
backgroundColor: failure is NetworkFailure ? Colors.orange : Colors.red,
behavior: SnackBarBehavior.floating,
action: failure.isRetryable && onRetry != null
? SnackBarAction(
label: 'Réessayer',
textColor: Colors.white,
onPressed: onRetry,
)
: null,
duration: Duration(seconds: failure.isRetryable ? 6 : 4),
);
ScaffoldMessenger.of(context).showSnackBar(snackBar);
}

168
lib/shared/widgets/error_widget.dart Normal file
View File

@@ -0,0 +1,168 @@
/// Widget d'erreur réutilisable pour toute l'application
library error_widget;
import 'package:flutter/material.dart';
/// Widget d'erreur avec message et bouton de retry
class AppErrorWidget extends StatelessWidget {
/// Message d'erreur à afficher
final String message;
/// Callback appelé lors du clic sur le bouton retry
final VoidCallback? onRetry;
/// Icône personnalisée (optionnel)
final IconData? icon;
/// Titre personnalisé (optionnel)
final String? title;
const AppErrorWidget({
super.key,
required this.message,
this.onRetry,
this.icon,
this.title,
});
@override
Widget build(BuildContext context) {
return Center(
child: Padding(
padding: const EdgeInsets.all(24.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
Icon(
icon ?? Icons.error_outline,
size: 64,
color: Theme.of(context).colorScheme.error,
),
const SizedBox(height: 16),
Text(
title ?? 'Oups !',
style: Theme.of(context).textTheme.headlineSmall?.copyWith(
color: Theme.of(context).colorScheme.onSurface,
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 8),
Text(
message,
textAlign: TextAlign.center,
style: Theme.of(context).textTheme.bodyMedium?.copyWith(
color: Theme.of(context).colorScheme.onSurfaceVariant,
),
),
if (onRetry != null) ...[
const SizedBox(height: 24),
ElevatedButton.icon(
onPressed: onRetry,
icon: const Icon(Icons.refresh),
label: const Text('Réessayer'),
style: ElevatedButton.styleFrom(
padding: const EdgeInsets.symmetric(
horizontal: 24,
vertical: 12,
),
),
),
],
],
),
),
);
}
}
/// Widget d'erreur réseau spécifique
class NetworkErrorWidget extends StatelessWidget {
final VoidCallback? onRetry;
const NetworkErrorWidget({
super.key,
this.onRetry,
});
@override
Widget build(BuildContext context) {
return AppErrorWidget(
message: 'Impossible de se connecter au serveur.\nVérifiez votre connexion internet.',
onRetry: onRetry,
icon: Icons.wifi_off,
title: 'Pas de connexion',
);
}
}
/// Widget d'erreur de permissions
class PermissionErrorWidget extends StatelessWidget {
final String? message;
const PermissionErrorWidget({
super.key,
this.message,
});
@override
Widget build(BuildContext context) {
return AppErrorWidget(
message: message ?? 'Vous n\'avez pas les permissions nécessaires pour accéder à cette ressource.',
icon: Icons.lock_outline,
title: 'Accès refusé',
);
}
}
/// Widget d'erreur "Aucune donnée"
class EmptyDataWidget extends StatelessWidget {
final String message;
final IconData? icon;
final VoidCallback? onAction;
final String? actionLabel;
const EmptyDataWidget({
super.key,
required this.message,
this.icon,
this.onAction,
this.actionLabel,
});
@override
Widget build(BuildContext context) {
return Center(
child: Padding(
padding: const EdgeInsets.all(24.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
Icon(
icon ?? Icons.inbox_outlined,
size: 64,
color: Theme.of(context).colorScheme.onSurfaceVariant,
),
const SizedBox(height: 16),
Text(
message,
textAlign: TextAlign.center,
style: Theme.of(context).textTheme.bodyLarge?.copyWith(
color: Theme.of(context).colorScheme.onSurfaceVariant,
),
),
if (onAction != null && actionLabel != null) ...[
const SizedBox(height: 24),
ElevatedButton(
onPressed: onAction,
child: Text(actionLabel!),
),
],
],
),
),
);
}
}

71
lib/shared/widgets/info_badge.dart Normal file
View File

@@ -0,0 +1,71 @@
import 'package:flutter/material.dart';
import '../design_system/tokens/app_colors.dart';
import '../design_system/tokens/app_typography.dart';
/// UnionFlow Mobile - Composant DRY : InfoBadge
/// Indicateur compact pour les statuts ("Payé", "Admin", etc).
class InfoBadge extends StatelessWidget {
final String text;
final Color backgroundColor;
final Color textColor;
final IconData? icon;
const InfoBadge({
Key? key,
required this.text,
this.backgroundColor = AppColors.brandGreenLight,
this.textColor = Colors.white,
this.icon,
}) : super(key: key);
// Factory methods pour les statuts courants
factory InfoBadge.success(String text) {
return InfoBadge(
text: text,
backgroundColor: AppColors.success.withOpacity(0.15),
textColor: AppColors.success,
icon: Icons.check_circle_outline,
);
}
factory InfoBadge.error(String text) {
return InfoBadge(
text: text,
backgroundColor: AppColors.error.withOpacity(0.15),
textColor: AppColors.error,
icon: Icons.error_outline,
);
}
factory InfoBadge.neutral(String text) {
return InfoBadge(
text: text,
backgroundColor: AppColors.info.withOpacity(0.15),
textColor: AppColors.info,
);
}
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
decoration: BoxDecoration(
color: backgroundColor,
borderRadius: BorderRadius.circular(4),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
if (icon != null) ...[
Icon(icon, size: 10, color: textColor),
const SizedBox(width: 2),
],
Text(
text,
style: AppTypography.badgeText.copyWith(color: textColor),
),
],
),
);
}
}

244
lib/shared/widgets/loading_widget.dart Normal file
View File

@@ -0,0 +1,244 @@
/// Widgets de chargement réutilisables pour toute l'application
library loading_widget;
import 'package:flutter/material.dart';
import 'package:shimmer/shimmer.dart';
/// Widget de chargement simple avec CircularProgressIndicator
class AppLoadingWidget extends StatelessWidget {
final String? message;
final double? size;
const AppLoadingWidget({
super.key,
this.message,
this.size,
});
@override
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
SizedBox(
width: size ?? 40,
height: size ?? 40,
child: CircularProgressIndicator(
strokeWidth: 3,
valueColor: AlwaysStoppedAnimation<Color>(
Theme.of(context).colorScheme.primary,
),
),
),
if (message != null) ...[
const SizedBox(height: 16),
Text(
message!,
style: Theme.of(context).textTheme.bodyMedium?.copyWith(
color: Theme.of(context).colorScheme.onSurfaceVariant,
),
),
],
],
),
);
}
}
/// Widget de chargement avec effet shimmer pour les listes
class ShimmerListLoading extends StatelessWidget {
final int itemCount;
final double itemHeight;
const ShimmerListLoading({
super.key,
this.itemCount = 5,
this.itemHeight = 80,
});
@override
Widget build(BuildContext context) {
return ListView.builder(
itemCount: itemCount,
padding: const EdgeInsets.all(16),
itemBuilder: (context, index) {
return Padding(
padding: const EdgeInsets.only(bottom: 12),
child: Shimmer.fromColors(
baseColor: Colors.grey[300]!,
highlightColor: Colors.grey[100]!,
child: Container(
height: itemHeight,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
),
),
),
);
},
);
}
}
/// Widget de chargement avec effet shimmer pour les cartes
class ShimmerCardLoading extends StatelessWidget {
final double height;
final double? width;
const ShimmerCardLoading({
super.key,
this.height = 120,
this.width,
});
@override
Widget build(BuildContext context) {
return Shimmer.fromColors(
baseColor: Colors.grey[300]!,
highlightColor: Colors.grey[100]!,
child: Container(
height: height,
width: width,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
),
),
);
}
}
/// Widget de chargement avec effet shimmer pour une grille
class ShimmerGridLoading extends StatelessWidget {
final int itemCount;
final int crossAxisCount;
final double childAspectRatio;
const ShimmerGridLoading({
super.key,
this.itemCount = 6,
this.crossAxisCount = 2,
this.childAspectRatio = 1.0,
});
@override
Widget build(BuildContext context) {
return GridView.builder(
padding: const EdgeInsets.all(16),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: crossAxisCount,
crossAxisSpacing: 12,
mainAxisSpacing: 12,
childAspectRatio: childAspectRatio,
),
itemCount: itemCount,
itemBuilder: (context, index) {
return Shimmer.fromColors(
baseColor: Colors.grey[300]!,
highlightColor: Colors.grey[100]!,
child: Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
),
),
);
},
);
}
}
/// Widget de chargement pour les détails d'un élément
class ShimmerDetailLoading extends StatelessWidget {
const ShimmerDetailLoading({super.key});
@override
Widget build(BuildContext context) {
return Shimmer.fromColors(
baseColor: Colors.grey[300]!,
highlightColor: Colors.grey[100]!,
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Header
Container(
height: 200,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
),
),
const SizedBox(height: 16),
// Title
Container(
height: 24,
width: double.infinity,
color: Colors.white,
),
const SizedBox(height: 8),
// Subtitle
Container(
height: 16,
width: 200,
color: Colors.white,
),
const SizedBox(height: 24),
// Content lines
...List.generate(5, (index) {
return Padding(
padding: const EdgeInsets.only(bottom: 8),
child: Container(
height: 12,
width: double.infinity,
color: Colors.white,
),
);
}),
],
),
),
);
}
}
/// Widget de chargement inline (petit)
class InlineLoadingWidget extends StatelessWidget {
final String? message;
const InlineLoadingWidget({
super.key,
this.message,
});
@override
Widget build(BuildContext context) {
return Row(
mainAxisSize: MainAxisSize.min,
children: [
SizedBox(
width: 16,
height: 16,
child: CircularProgressIndicator(
strokeWidth: 2,
valueColor: AlwaysStoppedAnimation<Color>(
Theme.of(context).colorScheme.primary,
),
),
),
if (message != null) ...[
const SizedBox(width: 8),
Text(
message!,
style: Theme.of(context).textTheme.bodySmall,
),
],
],
);
}
}

107
lib/shared/widgets/mini_avatar.dart Normal file
View File

@@ -0,0 +1,107 @@
import 'package:flutter/material.dart';
import 'package:cached_network_image/cached_network_image.dart';
import '../design_system/tokens/app_colors.dart';
import '../design_system/tokens/app_typography.dart';
/// UnionFlow Mobile - Composant DRY : MiniAvatar
/// Évite toute répétition de configuration d'image de profil.
/// Formats contraints (24px, 32px max).
class MiniAvatar extends StatelessWidget {
final String? imageUrl;
final String fallbackText; // Ex: "JD" pour John Doe
final double size;
final bool isOnline; // Ajoute une petite pastille verte
final Color? backgroundColor;
final Color? iconColor;
final bool isIcon;
const MiniAvatar({
Key? key,
this.imageUrl,
required this.fallbackText,
this.size = 32.0,
this.isOnline = false,
this.backgroundColor,
this.iconColor,
this.isIcon = false,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return Stack(
children: [
Container(
width: size,
height: size,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: backgroundColor ?? AppColors.primaryGreen.withOpacity(0.1),
border: Border.all(
color: AppColors.lightBorder,
width: 0.5,
),
),
child: ClipOval(
child: isIcon
? _buildIcon()
: (imageUrl != null && imageUrl!.isNotEmpty
? CachedNetworkImage(
imageUrl: imageUrl!,
fit: BoxFit.cover,
placeholder: (context, url) => _buildFallback(),
errorWidget: (context, url, error) => _buildFallback(),
)
: _buildFallback()),
),
),
if (isOnline)
Positioned(
bottom: 0,
right: 0,
child: Container(
width: size * 0.3,
height: size * 0.3,
decoration: BoxDecoration(
color: AppColors.success,
shape: BoxShape.circle,
border: Border.all(
color: Theme.of(context).scaffoldBackgroundColor,
width: 1.5,
),
),
),
),
],
);
}
Widget _buildFallback() {
return Center(
child: Text(
fallbackText.toUpperCase(),
style: AppTypography.actionText.copyWith(
color: iconColor ?? AppColors.primaryGreen,
fontSize: size * 0.4,
),
),
);
}
Widget _buildIcon() {
IconData iconData;
switch (fallbackText) {
case 'people': iconData = Icons.people; break;
case 'event': iconData = Icons.event; break;
case 'business': iconData = Icons.business; break;
case 'settings': iconData = Icons.settings; break;
default: iconData = Icons.notifications;
}
return Center(
child: Icon(
iconData,
color: iconColor ?? AppColors.primaryGreen,
size: size * 0.6,
),
);
}
}

326
lib/shared/widgets/validated_text_field.dart Normal file
View File

@@ -0,0 +1,326 @@
/// Reusable validated text field with consistent styling
library validated_text_field;
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
/// Validated text field with consistent styling and behavior
class ValidatedTextField extends StatelessWidget {
final TextEditingController? controller;
final String? labelText;
final String? hintText;
final String? helperText;
final String? initialValue;
final String? Function(String?)? validator;
final void Function(String)? onChanged;
final void Function(String?)? onSaved;
final TextInputType? keyboardType;
final TextInputAction? textInputAction;
final bool obscureText;
final bool enabled;
final bool readOnly;
final int? maxLines;
final int? minLines;
final int? maxLength;
final Widget? prefixIcon;
final Widget? suffixIcon;
final List<TextInputFormatter>? inputFormatters;
final FocusNode? focusNode;
final void Function()? onEditingComplete;
final void Function(String)? onFieldSubmitted;
final AutovalidateMode? autovalidateMode;
final bool showCounter;
const ValidatedTextField({
super.key,
this.controller,
this.labelText,
this.hintText,
this.helperText,
this.initialValue,
this.validator,
this.onChanged,
this.onSaved,
this.keyboardType,
this.textInputAction,
this.obscureText = false,
this.enabled = true,
this.readOnly = false,
this.maxLines = 1,
this.minLines,
this.maxLength,
this.prefixIcon,
this.suffixIcon,
this.inputFormatters,
this.focusNode,
this.onEditingComplete,
this.onFieldSubmitted,
this.autovalidateMode,
this.showCounter = true,
});
@override
Widget build(BuildContext context) {
return TextFormField(
controller: controller,
initialValue: initialValue,
decoration: InputDecoration(
labelText: labelText,
hintText: hintText,
helperText: helperText,
prefixIcon: prefixIcon,
suffixIcon: suffixIcon,
border: const OutlineInputBorder(),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.grey.shade400,
width: 1.0,
),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(
color: Colors.blue,
width: 2.0,
),
),
errorBorder: const OutlineInputBorder(
borderSide: BorderSide(
color: Colors.red,
width: 1.0,
),
),
focusedErrorBorder: const OutlineInputBorder(
borderSide: BorderSide(
color: Colors.red,
width: 2.0,
),
),
filled: !enabled,
fillColor: !enabled ? Colors.grey.shade100 : null,
counterText: showCounter ? null : '',
),
validator: validator,
onChanged: onChanged,
onSaved: onSaved,
keyboardType: keyboardType,
textInputAction: textInputAction,
obscureText: obscureText,
enabled: enabled,
readOnly: readOnly,
maxLines: maxLines,
minLines: minLines,
maxLength: maxLength,
inputFormatters: inputFormatters,
focusNode: focusNode,
onEditingComplete: onEditingComplete,
onFieldSubmitted: onFieldSubmitted,
autovalidateMode: autovalidateMode,
);
}
}
/// Validated amount field with currency formatting
class ValidatedAmountField extends StatelessWidget {
final TextEditingController? controller;
final String? labelText;
final String? hintText;
final String? initialValue;
final String? Function(String?)? validator;
final void Function(String)? onChanged;
final void Function(String?)? onSaved;
final bool enabled;
final String currencySymbol;
final FocusNode? focusNode;
const ValidatedAmountField({
super.key,
this.controller,
this.labelText,
this.hintText,
this.initialValue,
this.validator,
this.onChanged,
this.onSaved,
this.enabled = true,
this.currencySymbol = 'FCFA',
this.focusNode,
});
@override
Widget build(BuildContext context) {
return ValidatedTextField(
controller: controller,
initialValue: initialValue,
labelText: labelText,
hintText: hintText,
helperText: 'Entrez un montant positif (max 2 décimales)',
validator: validator,
onChanged: onChanged,
onSaved: onSaved,
enabled: enabled,
focusNode: focusNode,
keyboardType: const TextInputType.numberWithOptions(decimal: true),
textInputAction: TextInputAction.next,
suffixIcon: Padding(
padding: const EdgeInsets.all(12.0),
child: Text(
currencySymbol,
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Colors.grey,
),
),
),
inputFormatters: [
FilteringTextInputFormatter.allow(RegExp(r'^\d+\.?\d{0,2}')),
],
);
}
}
/// Validated dropdown field
class ValidatedDropdownField<T> extends StatelessWidget {
final T? value;
final List<DropdownMenuItem<T>> items;
final String? labelText;
final String? hintText;
final String? helperText;
final String? Function(T?)? validator;
final void Function(T?)? onChanged;
final void Function(T?)? onSaved;
final bool enabled;
const ValidatedDropdownField({
super.key,
this.value,
required this.items,
this.labelText,
this.hintText,
this.helperText,
this.validator,
this.onChanged,
this.onSaved,
this.enabled = true,
});
@override
Widget build(BuildContext context) {
return DropdownButtonFormField<T>(
value: value,
items: items,
decoration: InputDecoration(
labelText: labelText,
hintText: hintText,
helperText: helperText,
border: const OutlineInputBorder(),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.grey.shade400,
width: 1.0,
),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(
color: Colors.blue,
width: 2.0,
),
),
errorBorder: const OutlineInputBorder(
borderSide: BorderSide(
color: Colors.red,
width: 1.0,
),
),
filled: !enabled,
fillColor: !enabled ? Colors.grey.shade100 : null,
),
validator: validator,
onChanged: enabled ? onChanged : null,
onSaved: onSaved,
);
}
}
/// Validated date picker field
class ValidatedDateField extends StatelessWidget {
final DateTime? selectedDate;
final String? labelText;
final String? hintText;
final String? helperText;
final String? Function(DateTime?)? validator;
final void Function(DateTime)? onChanged;
final DateTime? firstDate;
final DateTime? lastDate;
final bool enabled;
const ValidatedDateField({
super.key,
this.selectedDate,
this.labelText,
this.hintText,
this.helperText,
this.validator,
this.onChanged,
this.firstDate,
this.lastDate,
this.enabled = true,
});
@override
Widget build(BuildContext context) {
return InkWell(
onTap: enabled
? () async {
final date = await showDatePicker(
context: context,
initialDate: selectedDate ?? DateTime.now(),
firstDate: firstDate ?? DateTime(2000),
lastDate: lastDate ?? DateTime(2100),
);
if (date != null && onChanged != null) {
onChanged!(date);
}
}
: null,
child: InputDecorator(
decoration: InputDecoration(
labelText: labelText,
hintText: hintText,
helperText: helperText,
suffixIcon: const Icon(Icons.calendar_today),
border: const OutlineInputBorder(),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.grey.shade400,
width: 1.0,
),
),
focusedBorder: const OutlineInputBorder(
borderSide: BorderSide(
color: Colors.blue,
width: 2.0,
),
),
errorBorder: const OutlineInputBorder(
borderSide: BorderSide(
color: Colors.red,
width: 1.0,
),
),
filled: !enabled,
fillColor: !enabled ? Colors.grey.shade100 : null,
errorText: validator != null ? validator!(selectedDate) : null,
),
child: Text(
selectedDate != null
? '${selectedDate!.day}/${selectedDate!.month}/${selectedDate!.year}'
: hintText ?? 'Sélectionner une date',
style: TextStyle(
color: selectedDate != null ? Colors.black87 : Colors.grey,
),
),
),
);
}
}