feat(frontend): improve application feedback messages
This commit is contained in:
@@ -0,0 +1,189 @@
|
||||
import "package:flutter/material.dart";
|
||||
import "package:google_fonts/google_fonts.dart";
|
||||
|
||||
import "../theme/ensup_colors.dart";
|
||||
|
||||
enum AppMessageType { information, succes, alerte, erreur }
|
||||
|
||||
class AppMessage {
|
||||
AppMessage._();
|
||||
|
||||
static int _messageActif = 0;
|
||||
|
||||
static void information(
|
||||
BuildContext context,
|
||||
String message, {
|
||||
String titre = "Information",
|
||||
}) {
|
||||
_afficher(
|
||||
context,
|
||||
type: AppMessageType.information,
|
||||
titre: titre,
|
||||
message: message,
|
||||
);
|
||||
}
|
||||
|
||||
static void succes(
|
||||
BuildContext context,
|
||||
String message, {
|
||||
String titre = "Action réussie",
|
||||
}) {
|
||||
_afficher(
|
||||
context,
|
||||
type: AppMessageType.succes,
|
||||
titre: titre,
|
||||
message: message,
|
||||
);
|
||||
}
|
||||
|
||||
static void alerte(
|
||||
BuildContext context,
|
||||
String message, {
|
||||
String titre = "Attention",
|
||||
}) {
|
||||
_afficher(
|
||||
context,
|
||||
type: AppMessageType.alerte,
|
||||
titre: titre,
|
||||
message: message,
|
||||
);
|
||||
}
|
||||
|
||||
static void erreur(
|
||||
BuildContext context,
|
||||
Object erreur, {
|
||||
String titre = "Une erreur est survenue",
|
||||
}) {
|
||||
_afficher(
|
||||
context,
|
||||
type: AppMessageType.erreur,
|
||||
titre: titre,
|
||||
message: _nettoyerErreur(erreur),
|
||||
duree: const Duration(seconds: 8),
|
||||
);
|
||||
}
|
||||
|
||||
static void _afficher(
|
||||
BuildContext context, {
|
||||
required AppMessageType type,
|
||||
required String titre,
|
||||
required String message,
|
||||
Duration duree = const Duration(seconds: 6),
|
||||
}) {
|
||||
final messenger = ScaffoldMessenger.of(context);
|
||||
final identifiant = ++_messageActif;
|
||||
final style = _style(type);
|
||||
|
||||
messenger
|
||||
..clearSnackBars()
|
||||
..hideCurrentMaterialBanner()
|
||||
..showMaterialBanner(
|
||||
MaterialBanner(
|
||||
backgroundColor: style.fond,
|
||||
surfaceTintColor: Colors.transparent,
|
||||
elevation: 6,
|
||||
shadowColor: EnsupColors.text.withValues(alpha: 0.18),
|
||||
padding: const EdgeInsets.fromLTRB(20, 14, 8, 14),
|
||||
leadingPadding: const EdgeInsets.only(right: 14),
|
||||
leading: Container(
|
||||
width: 40,
|
||||
height: 40,
|
||||
decoration: BoxDecoration(
|
||||
color: style.couleur,
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: Icon(style.icone, color: Colors.white, size: 22),
|
||||
),
|
||||
content: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Text(
|
||||
titre,
|
||||
style: GoogleFonts.darkerGrotesque(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w800,
|
||||
color: style.texte,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 2),
|
||||
Text(
|
||||
message,
|
||||
style: GoogleFonts.titilliumWeb(
|
||||
fontSize: 13,
|
||||
color: EnsupColors.text2,
|
||||
height: 1.35,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
actions: [
|
||||
IconButton(
|
||||
tooltip: "Fermer le message",
|
||||
onPressed: () {
|
||||
_messageActif++;
|
||||
messenger.hideCurrentMaterialBanner();
|
||||
},
|
||||
icon: Icon(Icons.close, color: style.texte),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
|
||||
Future<void>.delayed(duree, () {
|
||||
if (_messageActif == identifiant && messenger.mounted) {
|
||||
messenger.hideCurrentMaterialBanner();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
static String _nettoyerErreur(Object erreur) {
|
||||
return erreur
|
||||
.toString()
|
||||
.replaceFirst(RegExp(r"^(Exception|Error):\s*"), "")
|
||||
.trim();
|
||||
}
|
||||
|
||||
static _AppMessageStyle _style(AppMessageType type) {
|
||||
return switch (type) {
|
||||
AppMessageType.information => const _AppMessageStyle(
|
||||
fond: Color(0xFFEFF8FC),
|
||||
couleur: EnsupColors.cyan,
|
||||
texte: EnsupColors.blue3,
|
||||
icone: Icons.info_outline,
|
||||
),
|
||||
AppMessageType.succes => const _AppMessageStyle(
|
||||
fond: Color(0xFFF0FDF4),
|
||||
couleur: EnsupColors.green,
|
||||
texte: Color(0xFF166534),
|
||||
icone: Icons.check_circle_outline,
|
||||
),
|
||||
AppMessageType.alerte => const _AppMessageStyle(
|
||||
fond: Color(0xFFFFF7ED),
|
||||
couleur: Color(0xFFD97706),
|
||||
texte: Color(0xFF9A3412),
|
||||
icone: Icons.warning_amber_rounded,
|
||||
),
|
||||
AppMessageType.erreur => const _AppMessageStyle(
|
||||
fond: Color(0xFFFFF1F2),
|
||||
couleur: EnsupColors.red,
|
||||
texte: Color(0xFF9F1239),
|
||||
icone: Icons.error_outline,
|
||||
),
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
class _AppMessageStyle {
|
||||
const _AppMessageStyle({
|
||||
required this.fond,
|
||||
required this.couleur,
|
||||
required this.texte,
|
||||
required this.icone,
|
||||
});
|
||||
|
||||
final Color fond;
|
||||
final Color couleur;
|
||||
final Color texte;
|
||||
final IconData icone;
|
||||
}
|
||||
Reference in New Issue
Block a user