modif my account

em2rp/.vscode/launch.json

@@ -4,22 +4,7 @@
     // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
     "version": "0.2.0",
         "configurations": [
-            {
-                "name": "Attach to Chrome",
-                "port": 9222,
-                "request": "attach",
-                "type": "chrome",
-                "webRoot": "${workspaceFolder}",
-                "preLaunchTask": "npm: vite",
             
-            },            
-            {
-                "name": "Launch Chrome",
-                "request": "launch",
-                "type": "chrome",
-                "url": "http://localhost:8080",
-                "webRoot": "${workspaceFolder}"
-            },
             {
                 "name": "Launch Edge",
                 "request": "launch",

em2rp/cors.json

@@ -0,0 +1,8 @@
+[
+    {
+      "origin": ["http://localhost:63825"],
+      "method": ["GET"],
+      "maxAgeSeconds": 3600
+    }
+  ]
+  

em2rp/lib/main.dart

@@ -1,3 +1,4 @@
+import 'package:em2rp/utils/auth_guard_widget.dart';
 import 'package:em2rp/views/calendar_page.dart';
 import 'package:em2rp/views/login_page.dart';
 import 'package:firebase_auth/firebase_auth.dart';
@@ -15,6 +16,8 @@ void main() async {
   await Firebase.initializeApp(
     options: DefaultFirebaseOptions.currentPlatform,
   );
+  await FirebaseAuth.instance.setPersistence(Persistence.LOCAL);
+
   runApp(
     ChangeNotifierProvider(
       // Wrap MyApp with ChangeNotifierProvider
@@ -31,50 +34,56 @@ class MyApp extends StatelessWidget {
   Widget build(BuildContext context) {
     print("test");
     return MaterialApp(
-        title: 'EM2 ERP',
-        theme: ThemeData(
-          primarySwatch: Colors.red,
-          primaryColor: AppColors.noir,
-          colorScheme:
-              ColorScheme.fromSwatch().copyWith(secondary: AppColors.rouge),
-          textTheme: const TextTheme(
-            bodyMedium: TextStyle(color: AppColors.noir),
+      title: 'EM2 ERP',
+      theme: ThemeData(
+        primarySwatch: Colors.red,
+        primaryColor: AppColors.noir,
+        colorScheme:
+            ColorScheme.fromSwatch().copyWith(secondary: AppColors.rouge),
+        textTheme: const TextTheme(
+          bodyMedium: TextStyle(color: AppColors.noir),
+        ),
+        // Personnalisation de l'InputDecorationTheme pour les text fields
+        inputDecorationTheme: InputDecorationTheme(
+          focusedBorder: OutlineInputBorder(
+            // Bordure lorsqu'il est focus
+            borderSide:
+                BorderSide(color: AppColors.noir), // Couleur rouge quand focus
           ),
-          // Personnalisation de l'InputDecorationTheme pour les text fields
-          inputDecorationTheme: InputDecorationTheme(
-            focusedBorder: OutlineInputBorder(
-              // Bordure lorsqu'il est focus
-              borderSide: BorderSide(
-                  color: AppColors.noir), // Couleur rouge quand focus
-            ),
-            enabledBorder: OutlineInputBorder(
-              // Bordure par défaut (non focus)
-              borderSide:
-                  BorderSide(color: AppColors.gris), // Couleur grise par défaut
-            ),
-            labelStyle: TextStyle(color: AppColors.noir), // Couleur du label
-            hintStyle: TextStyle(color: AppColors.gris), // Couleur du hint text
-            // Tu peux personnaliser d'autres propriétés ici :
-            // fillColor, filled, iconColor, prefixStyle, suffixStyle, etc.
+          enabledBorder: OutlineInputBorder(
+            // Bordure par défaut (non focus)
+            borderSide:
+                BorderSide(color: AppColors.gris), // Couleur grise par défaut
           ),
-          elevatedButtonTheme: ElevatedButtonThemeData(
-            style: ElevatedButton.styleFrom(
-              foregroundColor:
-                  AppColors.blanc, // Couleur du texte du bouton (ici blanc)
-              backgroundColor: AppColors
-                  .noir, // Couleur de fond du bouton (si tu veux aussi changer le fond)
-              // Autres styles possibles pour les boutons :
-              // textStyle, padding, shape, elevation, etc.
-            ),
+          labelStyle: TextStyle(color: AppColors.noir), // Couleur du label
+          hintStyle: TextStyle(color: AppColors.gris), // Couleur du hint text
+          // Tu peux personnaliser d'autres propriétés ici :
+          // fillColor, filled, iconColor, prefixStyle, suffixStyle, etc.
+        ),
+        elevatedButtonTheme: ElevatedButtonThemeData(
+          style: ElevatedButton.styleFrom(
+            foregroundColor:
+                AppColors.blanc, // Couleur du texte du bouton (ici blanc)
+            backgroundColor: AppColors
+                .noir, // Couleur de fond du bouton (si tu veux aussi changer le fond)
+            // Autres styles possibles pour les boutons :
+            // textStyle, padding, shape, elevation, etc.
           ),
         ),
-        routes: {
-          '/login': (context) => const LoginPage(),
-          '/calendar': (context) => const CalendarPage(),
-          '/my_account': (context) => const MyAccountPage(),
-          '/user_management': (context) => const UserManagementPage(),
-        },
-        // Conditionally set home based on authentication state
-        home: LoginPage());
+      ),
+      routes: {
+        //Pages accessibles à tous
+        '/login': (context) => const LoginPage(),
+
+        //Pages réservées aux UTILISATEURS CONNECTÉS
+        '/calendar': (context) => const AuthGuard(child: CalendarPage()),
+        '/my_account': (context) => const AuthGuard(child: MyAccountPage()),
+
+        //Pages réservées aux ADMIN
+        '/user_management': (context) =>
+            const AuthGuard(requiredRole: "ADMIN", child: UserManagementPage()),
+      },
+      initialRoute: '/login',
+    );
   }
 }

em2rp/lib/providers/user_provider.dart

@@ -5,38 +5,29 @@ class UserProvider extends ChangeNotifier {
   String? _firstName;
   String? _lastName;
   String? _role;
-  // String? _profilePictureUrl;
+  String? _profilePictureUrl;
   String? _email;
-  // String? _phoneNumber;
+  String? _phoneNumber;
 
   String? get uid => _uid;
   String? get firstName => _firstName;
   String? get lastName => _lastName;
   String? get role => _role;
-  // String? get profilePhotoUrl => _profilePictureUrl;
+  String? get profilePhotoUrl => _profilePictureUrl;
   String? get email => _email;
-  // String? get phoneNumber => _phoneNumber;
+  String? get phoneNumber => _phoneNumber;
 
-  // void setUserData(Map<String, dynamic> userData, String uid) {
-  //   _uid = uid;
-  //   _firstName = userData['firstName'];
-  //   _lastName = userData['lastName'];
-  //   _role = userData['role'] ?? 'USER'; // Default role if not provided
-  //   // _profilePictureUrl = userData['profilePhotoUrl'];
-  //   _email = userData['email'];
-  //   // _phoneNumber = userData['phoneNumber'];
-  //   notifyListeners(); // Notify listeners that state has changed
-  // }
   void setUserData(Map<String, dynamic> userData, String uid) {
     _uid = uid;
     _firstName = userData['firstName'];
     _lastName = userData['lastName'];
     _role = userData['role'] ?? 'USER'; // Default role if not provided
+    if (userData['profilePhotoUrl'] != "") {
+      _profilePictureUrl = userData['profilePhotoUrl'];
+    }
     _email = userData['email'];
-
-    print("User data set: $_firstName $_lastName ($_email)");
-
-    notifyListeners();
+    _phoneNumber = userData['phoneNumber'];
+    notifyListeners(); // Notify listeners that state has changed
   }
 
   void clearUserData() {
@@ -44,9 +35,24 @@ class UserProvider extends ChangeNotifier {
     _firstName = null;
     _lastName = null;
     _role = null;
-    // _profilePictureUrl = null;
+    _profilePictureUrl = null;
     _email = null;
-    // _phoneNumber = null;
+    _phoneNumber = null;
+    notifyListeners();
+  }
+
+  void setUserFirstName(String text) {
+    _firstName = text;
+    notifyListeners();
+  }
+
+  void setUserLastName(String text) {
+    _lastName = text;
+    notifyListeners();
+  }
+
+  void setUserPhoneNumber(String text) {
+    _phoneNumber = text;
     notifyListeners();
   }
 }

em2rp/lib/utils/auth_guard_widget.dart

@@ -0,0 +1,41 @@
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+import 'package:em2rp/providers/user_provider.dart';
+import 'package:em2rp/views/login_page.dart';
+
+class AuthGuard extends StatelessWidget {
+  final Widget child;
+  final String?
+      requiredRole; // Si non null, la page est réservée à ce rôle (ex: "ADMIN")
+
+  const AuthGuard({
+    super.key,
+    required this.child,
+    this.requiredRole,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final userProvider = Provider.of<UserProvider>(context);
+
+    // Si l'utilisateur n'est pas connecté (aucun uid ou email)
+    if (userProvider.uid == null || userProvider.email == null) {
+      // Retourne la page de connexion.
+      // Vous pouvez aussi déclencher une redirection automatique si nécessaire.
+      return const LoginPage();
+    }
+
+    // Si la page requiert un rôle spécifique et que l'utilisateur ne le possède pas
+    if (requiredRole != null && userProvider.role != requiredRole) {
+      return Scaffold(
+        appBar: AppBar(title: const Text("Accès refusé")),
+        body: const Center(
+          child: Text("Vous n'êtes pas autorisé à accéder à cette page."),
+        ),
+      );
+    }
+
+    // Sinon, afficher la page demandée
+    return child;
+  }
+}

em2rp/lib/utils/colors.dart

@@ -3,6 +3,6 @@ import 'package:flutter/material.dart';
 class AppColors {
   static const Color noir = Color(0xFF000000); // Noir
   static const Color blanc = Color(0xFFFFFFFF); // Blanc
-  static const Color rouge = Color(0xFFFF0000); // Rouge
+  static const Color rouge = Color.fromARGB(255, 159, 0, 0); // Rouge
   static const Color gris = Color(0xFF808080); // Gris (gris moyen)
 }

em2rp/lib/utils/firebase_storage_manager.dart

@@ -0,0 +1,90 @@
+import 'dart:io';
+
+import 'package:flutter/foundation.dart'; // pour kIsWeb
+import 'package:firebase_storage/firebase_storage.dart';
+import 'package:cloud_firestore/cloud_firestore.dart';
+import 'package:image_picker/image_picker.dart';
+
+class FirebaseStorageManager {
+  final FirebaseStorage _storage = FirebaseStorage.instance;
+  final FirebaseFirestore _firestore = FirebaseFirestore.instance;
+
+  /// Upload ou remplace la photo de profil d'un utilisateur dans Firebase Storage.
+  /// Pour le Web, on fixe l'extension .jpg.
+  /// 1. Construit le chemin : "ProfilePictures/UID.jpg"
+  /// 2. Supprime l'ancienne photo (si elle existe).
+  /// 3. Upload la nouvelle photo.
+  /// 4. Met à jour Firestore avec l'URL de la nouvelle image.
+  Future<String?> sendProfilePicture(
+      {required XFile imageFile, required String uid}) async {
+    try {
+      const String fileExtension = '.jpg'; // Extension fixe pour le web
+      final String fileName = '$uid$fileExtension';
+      final String filePath = 'ProfilePictures/$fileName';
+      final Reference storageRef = _storage.ref().child(filePath);
+
+      // 2. Suppression de l'ancienne photo de profil (si elle existe)
+      try {
+        await _storage.ref().child(filePath).delete();
+        print(
+            "FirebaseStorageManager: Ancienne photo supprimée pour l'utilisateur $uid.");
+      } on FirebaseException catch (e) {
+        if (e.code == 'object-not-found') {
+          print(
+              "FirebaseStorageManager: Pas d'ancienne photo à supprimer pour l'utilisateur $uid.");
+        } else {
+          print(
+              "FirebaseStorageManager: Erreur lors de la suppression pour l'utilisateur $uid: ${e.message}");
+          return null;
+        }
+      }
+
+      // 3. Upload de la nouvelle photo en fonction de la plateforme
+      UploadTask uploadTask;
+      if (kIsWeb) {
+        // Pour le web, lire les bytes et utiliser putData()
+        final bytes = await imageFile.readAsBytes();
+        uploadTask = storageRef.putData(bytes);
+      } else {
+        // Pour mobile/desktop, utiliser un File (dart:io)
+        final file = File(imageFile.path);
+        uploadTask = storageRef.putFile(file);
+      }
+
+      final TaskSnapshot snapshot = await uploadTask.whenComplete(() {});
+      if (snapshot.state == TaskState.success) {
+        // 4. Récupérer l'URL de téléchargement
+        final String downloadUrl = await snapshot.ref.getDownloadURL();
+        print(
+            "FirebaseStorageManager: Nouvelle photo uploadée pour l'utilisateur $uid. URL: $downloadUrl");
+
+        // 5. Mettre à jour Firestore avec l'URL de la photo de profil
+        try {
+          await _firestore
+              .collection('users')
+              .doc(uid)
+              .update({'profilePhotoUrl': downloadUrl});
+          print(
+              "FirebaseStorageManager: Firestore mis à jour pour l'utilisateur $uid.");
+        } catch (firestoreError) {
+          print(
+              "FirebaseStorageManager: Erreur Firestore pour l'utilisateur $uid: $firestoreError");
+          return downloadUrl; // On retourne l'URL même si la mise à jour échoue
+        }
+        return downloadUrl;
+      } else {
+        print(
+            "FirebaseStorageManager: Échec de l'upload pour l'utilisateur $uid. État: ${snapshot.state}");
+        return null;
+      }
+    } on FirebaseException catch (storageError) {
+      print(
+          "FirebaseStorageManager: Erreur Firebase Storage pour l'utilisateur $uid: ${storageError.message}");
+      return null;
+    } catch (e) {
+      print(
+          "FirebaseStorageManager: Erreur inattendue pour l'utilisateur $uid: $e");
+      return null;
+    }
+  }
+}

em2rp/lib/views/login_page.dart

@@ -64,12 +64,14 @@ class _LoginPageState extends State<LoginPage> {
         // Maintenant que toutes les données sont chargées, naviguer vers CalendarPage.
         Navigator.of(context).pushReplacementNamed('/calendar');
       } else {
+        if (!mounted) return;
         setState(() {
           _errorMessage = "Aucune donnée utilisateur trouvée.";
           _isLoading = false;
         });
       }
     } on FirebaseAuthException catch (e) {
+      if (!mounted) return;
       setState(() {
         _isLoading = false;
         if (e.code == 'user-not-found' || e.code == 'wrong-password') {
@@ -81,6 +83,7 @@ class _LoginPageState extends State<LoginPage> {
         }
       });
     } catch (e) {
+      if (!mounted) return;
       setState(() {
         _errorMessage =
             "Erreur lors de la récupération des données utilisateur.";
@@ -90,6 +93,7 @@ class _LoginPageState extends State<LoginPage> {
   }
 
   void _togglePasswordVisibility() {
+    if (!mounted) return;
     setState(() {
       _obscurePassword = !_obscurePassword;
     });
@@ -124,7 +128,7 @@ class _LoginPageState extends State<LoginPage> {
       children: <Widget>[
         Expanded(
           flex: 6,
-          child: const ImageSectionWidget(), // Affiche l'image de gauche
+          child: const BigLeftImageWidget(),
         ),
         Expanded(
           flex: 4,

em2rp/lib/views/my_account_page.dart

@@ -1,21 +1,240 @@
 import 'package:em2rp/providers/user_provider.dart';
+import 'package:em2rp/utils/firebase_storage_manager.dart';
+import 'package:em2rp/views/widgets/image/profile_picture.dart';
 import 'package:em2rp/views/widgets/nav/main_drawer.dart';
 import 'package:flutter/material.dart';
+import 'package:firebase_auth/firebase_auth.dart';
+import 'package:cloud_firestore/cloud_firestore.dart';
 import 'package:provider/provider.dart';
+import 'package:image_picker/image_picker.dart';
+import 'package:em2rp/views/widgets/inputs/styled_text_field.dart';
 
-class MyAccountPage extends StatelessWidget {
+class MyAccountPage extends StatefulWidget {
   const MyAccountPage({super.key});
+  @override
+  _MyAccountPageState createState() => _MyAccountPageState();
+}
+
+class _MyAccountPageState extends State<MyAccountPage> {
+  final User? user = FirebaseAuth.instance.currentUser;
+  final TextEditingController _firstNameController = TextEditingController();
+  final TextEditingController _lastNameController = TextEditingController();
+  final TextEditingController _phoneController = TextEditingController();
+  String? profilePhotoUrl;
+  bool _isHoveringProfilePic = false;
+  final FirebaseStorageManager _storageManager =
+      FirebaseStorageManager(); // Instance of FirebaseStorageManager
+
+  @override
+  void initState() {
+    super.initState();
+    _loadUserData();
+  }
+
+  Future<void> _loadUserData() async {
+    if (user != null) {
+      DocumentSnapshot userData = await FirebaseFirestore.instance
+          .collection('users')
+          .doc(user!.uid)
+          .get();
+
+      if (userData.exists) {
+        if (!mounted) return;
+        setState(() {
+          _firstNameController.text = userData['firstName'] ?? '';
+          _lastNameController.text = userData['lastName'] ?? '';
+          _phoneController.text = userData['phone'] ?? '';
+        });
+      }
+    }
+  }
+
+  Future<void> _updateUserData() async {
+    if (user != null) {
+      try {
+        await FirebaseFirestore.instance.collection('users').doc(user!.uid).set(
+          {
+            'firstName': _firstNameController.text,
+            'lastName': _lastNameController.text,
+            'phone': _phoneController.text,
+          },
+          SetOptions(merge: true),
+        );
+
+        // **MISE À JOUR DU USERPROVIDER APRÈS SUCCÈS**
+        final userProvider = Provider.of<UserProvider>(context, listen: false);
+        userProvider.setUserFirstName(_firstNameController.text);
+        userProvider.setUserLastName(_lastNameController.text);
+        userProvider.setUserPhoneNumber(_phoneController.text);
+
+        ScaffoldMessenger.of(context).showSnackBar(
+          const SnackBar(
+            content:
+                Text('Informations personnelles mises à jour avec succès!'),
+            backgroundColor: Colors.green,
+          ),
+        );
+      } catch (e) {
+        ScaffoldMessenger.of(context).showSnackBar(
+          SnackBar(
+            content: Text(
+              'Erreur lors de la mise à jour des informations personnelles: ${e.toString()}',
+            ),
+            backgroundColor: Colors.red,
+          ),
+        );
+        print(
+            'Erreur lors de la mise à jour des informations utilisateur: ${e.toString()}');
+      }
+    }
+  }
+
+  Future<void> _changeProfilePicture() async {
+    final ImagePicker picker = ImagePicker();
+    final XFile? image = await picker.pickImage(
+      source: ImageSource.gallery,
+    ); // You can also use ImageSource.camera
+
+    if (image != null) {
+      // Call FirebaseStorageManager to send the profile picture
+      String? newProfilePhotoUrl = await _storageManager.sendProfilePicture(
+        imageFile: image,
+        uid: user!.uid,
+      );
+      if (newProfilePhotoUrl != null) {
+        if (!mounted) return;
+        setState(() {
+          profilePhotoUrl =
+              newProfilePhotoUrl; // Update the profilePhotoUrl to refresh the UI
+        });
+        // Optionally, update the UserProvider if you are using it to manage user data globally
+        // Provider.of<UserProvider>(context, listen: false).setUserProfilePhotoUrl(newProfilePhotoUrl);
+        ScaffoldMessenger.of(context).showSnackBar(
+          const SnackBar(
+            content: Text('Photo de profil mise à jour avec succès!'),
+            backgroundColor: Colors.green, // Optional: Style for success
+          ),
+        );
+      } else {
+        ScaffoldMessenger.of(context).showSnackBar(
+          const SnackBar(
+            content: Text(
+              'Erreur lors de la mise à jour de la photo de profil.',
+            ),
+            backgroundColor: Colors.red, // Optional: Style for error
+          ),
+        );
+      }
+    } else {
+      // User cancelled image picking
+      ScaffoldMessenger.of(context).showSnackBar(
+        const SnackBar(content: Text('Sélection de photo annulée.')),
+      );
+    }
+  }
 
   @override
   Widget build(BuildContext context) {
-    final userProvider = Provider.of<UserProvider>(context);
+    final userProvider = Provider.of<UserProvider>(
+      context,
+    );
 
     return Scaffold(
       appBar: AppBar(title: const Text('Mon Compte')),
-      drawer:
-          MainDrawer(currentPage: '/my_account', userProvider: userProvider),
-      body: const Center(
-        child: Text('Page Mon Compte', style: TextStyle(fontSize: 24)),
+      drawer: MainDrawer(
+        currentPage: '/my_account',
+        userProvider: userProvider,
+      ), // Pass UserProvider to MainDrawer
+      body: SingleChildScrollView(
+        // Added SingleChildScrollView for better responsiveness
+        child: Padding(
+          padding: const EdgeInsets.all(
+              24.0), // Increased padding around the main content
+          child: Column(
+            crossAxisAlignment: CrossAxisAlignment.center,
+            children: [
+              MouseRegion(
+                onEnter: (_) => setState(() => _isHoveringProfilePic = true),
+                onExit: (_) => setState(() => _isHoveringProfilePic = false),
+                cursor: SystemMouseCursors.click,
+                child: GestureDetector(
+                  onTap:
+                      _changeProfilePicture, // Call _changeProfilePicture on tap
+                  child: Stack(
+                    alignment: Alignment.center,
+                    children: [
+                      ProfilePictureWidget(
+                          userId: user!.uid,
+                          radius:
+                              80), // Increased radius for larger profile picture
+                      if (_isHoveringProfilePic)
+                        Container(
+                          width: 160, // Slightly larger hover overlay
+                          height: 160,
+                          decoration: BoxDecoration(
+                            color: Colors.black54,
+                            shape: BoxShape.circle,
+                          ),
+                          child: const Center(
+                            child: Icon(
+                              Icons.edit,
+                              color: Colors.white,
+                              size: 36, // Slightly larger edit icon
+                            ),
+                          ),
+                        ),
+                    ],
+                  ),
+                ),
+              ),
+              Center(
+                child: Card(
+                  elevation: 4.0, // Ajouter un léger relief
+                  shape: RoundedRectangleBorder(
+                      borderRadius:
+                          BorderRadius.circular(12.0)), // Bords arrondis
+                  child: Padding(
+                    padding: const EdgeInsets.all(
+                        24.0), // Padding intérieur de la carte
+                    child: ConstrainedBox(
+                      // Limiter la largeur des inputs dans la carte
+                      constraints: BoxConstraints(
+                          maxWidth:
+                              500), // Ajustez la largeur maximale souhaitée
+                      child: Column(
+                        children: [
+                          StyledTextField(
+                              labelText: 'Prénom',
+                              controller: _firstNameController),
+                          const SizedBox(height: 16),
+                          StyledTextField(
+                              labelText: 'Nom',
+                              controller: _lastNameController),
+                          const SizedBox(height: 16),
+                          StyledTextField(
+                              labelText: 'Numéro de téléphone',
+                              controller: _phoneController),
+                          const SizedBox(height: 16),
+                          StyledTextField(
+                            labelText: 'Email',
+                            controller:
+                                TextEditingController(text: user?.email ?? ''),
+                            enabled: false,
+                          ),
+                          const SizedBox(height: 20),
+                          ElevatedButton(
+                            onPressed: _updateUserData,
+                            child: const Text('Enregistrer'),
+                          ),
+                        ],
+                      ),
+                    ),
+                  ),
+                ),
+              ),
+            ],
+          ),
+        ),
       ),
     );
   }

em2rp/lib/views/widgets/auth/login_button.dart

@@ -16,6 +16,7 @@ class LoginButtonWidget extends StatelessWidget {
     return ElevatedButton(
       onPressed: isLoading ? null : onPressed,
       style: ElevatedButton.styleFrom(
+        backgroundColor: AppColors.rouge,
         padding: const EdgeInsets.symmetric(vertical: 15),
         textStyle: const TextStyle(fontSize: 18),
       ),

em2rp/lib/views/widgets/image/big_image_left.dart

@@ -1,8 +1,8 @@
 import 'package:em2rp/utils/colors.dart';
 import 'package:flutter/material.dart';
 
-class ImageSectionWidget extends StatelessWidget {
-  const ImageSectionWidget({super.key});
+class BigLeftImageWidget extends StatelessWidget {
+  const BigLeftImageWidget({super.key});
 
   @override
   Widget build(BuildContext context) {

em2rp/lib/views/widgets/image/profile_picture.dart

@@ -0,0 +1,102 @@
+import 'package:flutter/material.dart';
+import 'package:cloud_firestore/cloud_firestore.dart';
+
+class ProfilePictureWidget extends StatelessWidget {
+  final String userId;
+  final double radius;
+  final String? defaultImageUrl; // URL de l'image par défaut (optionnel)
+
+  const ProfilePictureWidget({
+    super.key,
+    required this.userId,
+    this.radius = 25,
+    this.defaultImageUrl,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return FutureBuilder<DocumentSnapshot>(
+      future: FirebaseFirestore.instance.collection('users').doc(userId).get(),
+      builder: (context, snapshot) {
+        if (snapshot.connectionState == ConnectionState.waiting) {
+          return _buildLoadingAvatar(
+              radius); // Afficher un avatar de chargement
+        } else if (snapshot.hasError) {
+          print("Erreur FutureBuilder ProfilePictureWidget: ${snapshot.error}");
+          return _buildDefaultAvatar(radius,
+              defaultImageUrl); // Afficher avatar par défaut en cas d'erreur Firestore
+        } else if (snapshot.data != null && snapshot.data!.exists) {
+          final userData = snapshot.data!;
+          final profilePhotoUrl = userData['profilePhotoUrl'] as String?;
+
+          if (profilePhotoUrl != null && profilePhotoUrl.isNotEmpty) {
+            return CircleAvatar(
+              radius: radius,
+              // Utilisation de Image.network directement dans backgroundImage
+              backgroundImage: Image.network(
+                profilePhotoUrl,
+                errorBuilder: (context, error, stackTrace) {
+                  print(
+                      "Erreur de chargement Image.network pour l'URL: $profilePhotoUrl, Erreur: $error");
+                  // En cas d'erreur de chargement de l'image réseau, afficher l'avatar par défaut
+                  return _buildDefaultAvatar(radius, defaultImageUrl);
+                },
+              ).image, // .image pour obtenir un ImageProvider pour backgroundImage
+            );
+          } else {
+            return _buildDefaultAvatar(radius,
+                defaultImageUrl); // Pas d'URL dans Firestore, afficher avatar par défaut
+          }
+        } else {
+          return _buildDefaultAvatar(radius,
+              defaultImageUrl); // Document utilisateur non trouvé ou n'existe pas
+        }
+      },
+    );
+  }
+
+  // Widget utilitaire pour construire un CircleAvatar de chargement
+  Widget _buildLoadingAvatar(double radius) {
+    return CircleAvatar(
+      radius: radius,
+      backgroundColor:
+          Colors.grey[300], // Couleur de fond pendant le chargement
+      child: SizedBox(
+        width: radius * 0.8, // Ajuster la taille du loader
+        height: radius * 0.8,
+        child: CircularProgressIndicator(
+            strokeWidth: 2), // Indicateur de chargement
+      ),
+    );
+  }
+
+  // Widget utilitaire pour construire un CircleAvatar par défaut (avec icône ou image par défaut)
+  Widget _buildDefaultAvatar(double radius, String? defaultImageUrl) {
+    if (defaultImageUrl != null && defaultImageUrl.isNotEmpty) {
+      return CircleAvatar(
+        radius: radius,
+        // Utilisation de Image.network pour l'image par défaut, avec gestion d'erreur similaire
+        backgroundImage: Image.network(
+          defaultImageUrl,
+          errorBuilder: (context, error, stackTrace) {
+            print(
+                "Erreur de chargement Image.network pour l'URL par défaut: $defaultImageUrl, Erreur: $error");
+            return _buildIconAvatar(
+                radius); // Si l'image par défaut ne charge pas, afficher l'icône
+          },
+        ).image, // .image pour ImageProvider
+      );
+    } else {
+      return _buildIconAvatar(
+          radius); // Si pas d'URL par défaut fournie, afficher l'icône
+    }
+  }
+
+  // Widget utilitaire pour construire un CircleAvatar avec une icône par défaut
+  Widget _buildIconAvatar(double radius) {
+    return CircleAvatar(
+      radius: radius,
+      child: Icon(Icons.account_circle, size: radius * 1.5), // Icône par défaut
+    );
+  }
+}

em2rp/lib/views/widgets/inputs/styled_text_field.dart

@@ -0,0 +1,29 @@
+import 'package:flutter/material.dart';
+
+class StyledTextField extends StatelessWidget {
+  final String labelText;
+  final TextEditingController controller;
+  final bool enabled;
+
+  const StyledTextField({
+    super.key,
+    required this.labelText,
+    required this.controller,
+    this.enabled = true,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.symmetric(vertical: 8.0),
+      child: TextField(
+        controller: controller,
+        enabled: enabled,
+        decoration: InputDecoration(
+          labelText: labelText,
+          border: const OutlineInputBorder(),
+        ),
+      ),
+    );
+  }
+}

em2rp/lib/views/widgets/nav/main_drawer.dart

@@ -1,10 +1,10 @@
-import 'package:em2rp/providers/user_provider.dart'; // Import UserProvider
+import 'package:em2rp/providers/user_provider.dart';
 import 'package:em2rp/utils/colors.dart';
 import 'package:em2rp/views/calendar_page.dart';
 import 'package:em2rp/views/my_account_page.dart';
 import 'package:em2rp/views/user_management_page.dart';
 import 'package:flutter/material.dart';
-// Import Provider
+import 'package:em2rp/views/widgets/image/profile_picture.dart';
 
 class MainDrawer extends StatelessWidget {
   final String currentPage;
@@ -20,7 +20,7 @@ class MainDrawer extends StatelessWidget {
         padding: EdgeInsets.zero,
         children: <Widget>[
           DrawerHeader(
-            // Header du drawer amélioré
+            // Header du drawer
             decoration: BoxDecoration(
               image: DecorationImage(
                 image: AssetImage('assets/EM2_NsurB.jpg'),
@@ -36,16 +36,16 @@ class MainDrawer extends StatelessWidget {
               alignment: Alignment.bottomLeft,
               child: Column(
                 // Use Column to arrange logo and user name
-                crossAxisAlignment:
-                    CrossAxisAlignment.start, // Align text to the left
-                mainAxisAlignment:
-                    MainAxisAlignment.end, // Align content to the bottom
+                crossAxisAlignment: CrossAxisAlignment.start,
+                mainAxisAlignment: MainAxisAlignment.end,
                 children: [
-                  Image.asset('assets/EM2_NsurB.jpg',
-                      height: 50), // Smaller logo in header
+                  ProfilePictureWidget(
+                    userId: userProvider.uid!,
+                    radius: 30,
+                  ),
                   const SizedBox(height: 8),
                   Text(
-                    'Bonjour, ${userProvider.firstName ?? 'Erreur'}', // Display user's first name from provider
+                    'Bonjour, ${userProvider.firstName ?? 'Erreur'}',
                     style: TextStyle(
                       color: AppColors.blanc,
                       fontSize: 18,
@@ -90,7 +90,7 @@ class MainDrawer extends StatelessWidget {
                   leading: const Icon(Icons.account_circle),
                   // Lien vers "Mon Compte"
                   title: const Text('Mon Compte'),
-                  selected: currentPage == '/my_acount',
+                  selected: currentPage == '/my_account',
                   selectedColor: AppColors.rouge,
                   onTap: () {
                     Navigator.pop(context);
@@ -107,7 +107,7 @@ class MainDrawer extends StatelessWidget {
                   title: const Text('Gestion des Utilisateurs'),
                   selected: currentPage ==
                       '/user_management', // Check if current page is UserManagementPage
-                  selectedColor: AppColors.rouge, // Color when selected
+                  selectedColor: AppColors.rouge,
                   onTap: () {
                     Navigator.pop(context); // Ferme le drawer
                     Navigator.pushReplacement(
@@ -121,7 +121,6 @@ class MainDrawer extends StatelessWidget {
               ],
             ),
           ),
-          // Tu peux ajouter d'autres liens ici si besoin
         ],
       ),
     );

em2rp/pubspec.yaml

@@ -14,6 +14,9 @@ dependencies:
   cloud_firestore: ^5.6.5
   google_sign_in: ^6.2.2
   provider: ^6.1.2
+  firebase_storage: ^12.4.4
+  image_picker: ^1.1.2
+  universal_io: ^2.2.2
 
 dev_dependencies:
   flutter_test: