Update frontend/src/App.js

frontend/src/App.js

@@ -13,40 +13,35 @@ function App() {
   const [activeConversationId, setActiveConversationId] = useState(null);
   const [isAuthenticated, setIsAuthenticated] = useState(false);
   const [userName, setUserName] = useState('');
-  const [page, setPage] = useState("login"); // Démarrer sur login par défaut
+  const [page, setPage] = useState("login"); 
   const [userRole, setUserRole] = useState('');
 
 
-  // Vérifier si l'utilisateur est déjà connecté au chargement
 useEffect(() => {
   const storedUserName = localStorage.getItem('userName');
   const storedUserRole = localStorage.getItem('userRole');
 
   if (storedUserName) {
     setUserName(storedUserName);
-    setUserRole(storedUserRole); // Charge le rôle mais ne change pas la page
+    setUserRole(storedUserRole); 
     setIsAuthenticated(true);
     
-    // Toujours définir la page sur "chat" au début, quel que soit le rôle
     setPage("chat");
     
-    // Charger les conversations de l'utilisateur
     fetchConversations();
     
     console.log("Role chargé depuis localStorage:", storedUserRole);
   }
 }, []);
   
-  // Fonction pour récupérer les conversations depuis l'API
   const fetchConversations = async () => {
     try {
       const response = await fetch('/api/conversations', {
-        credentials: 'include', // Important pour envoyer les cookies
+        credentials: 'include',
       });
       
       if (response.ok) {
         const data = await response.json();
-        // Formater les données pour correspondre à votre format de conversation
         const formattedConversations = data.conversations.map(conv => ({
           id: conv._id,
           title: conv.title,
@@ -63,7 +58,6 @@ useEffect(() => {
     }
   };
   
-  // Fonction pour charger les messages d'une conversation sélectionnée
   const loadConversationMessages = async (conversationId) => {
     try {
       const response = await fetch(`/api/conversations/${conversationId}/messages`, {
@@ -72,7 +66,6 @@ useEffect(() => {
       
       if (response.ok) {
         const data = await response.json();
-        // Formater les messages pour correspondre à votre format
         const formattedMessages = data.messages.map(msg => ({
           sender: msg.sender,
           text: msg.text,
@@ -85,7 +78,6 @@ useEffect(() => {
     }
   };
   
-  // Au changement de conversation active
   useEffect(() => {
     if (activeConversationId && isAuthenticated) {
       loadConversationMessages(activeConversationId);
@@ -114,7 +106,6 @@ useEffect(() => {
       };
       
       try {
-        // Enregistrer la nouvelle conversation dans MongoDB
         const response = await fetch('/api/conversations', {
           method: 'POST',
           headers: {
@@ -126,7 +117,7 @@ useEffect(() => {
         
         if (response.ok) {
           const data = await response.json();
-          conversationId = data.conversation_id; // Important: stocker l'ID dans une variable locale
+          conversationId = data.conversation_id; 
           
           const newChat = {
             id: conversationId,
@@ -138,7 +129,6 @@ useEffect(() => {
           setConversations([newChat, ...conversations]);
           setActiveConversationId(conversationId);
           
-          // IMPORTANT: Enregistrer le message utilisateur une fois l'ID disponible
           await fetch(`/api/conversations/${conversationId}/messages`, {
             method: 'POST',
             headers: { 'Content-Type': 'application/json' },
@@ -154,7 +144,6 @@ useEffect(() => {
         return; // Arrêter si on ne peut pas créer la conversation
       }
     } else {
-      // Sauvegarder le message utilisateur pour une conversation existante
       try {
         await fetch(`/api/conversations/${conversationId}/messages`, {
           method: 'POST',
@@ -170,10 +159,9 @@ useEffect(() => {
       }
     }
     
-    return conversationId; // Retourner l'ID pour le composant ChatInterface
+    return conversationId; 
   };
   
-  // Fonction pour sauvegarder la réponse du bot
   const saveBotResponse = async (conversationId, botResponse) => {
     if (!conversationId) return;
     
@@ -195,7 +183,6 @@ useEffect(() => {
   };
 
   const handleLoginSuccess = () => {
-    // Récupérer le nom d'utilisateur stocké par le composant Login
     const storedUserName = localStorage.getItem('userName');
     const storedUserRole = localStorage.getItem('userRole');
 
@@ -206,7 +193,6 @@ useEffect(() => {
     setPage(storedUserRole === "Administrateur" ? "Administrateur" : "chat");
 
     
-    // Charger les conversations de l'utilisateur
     fetchConversations();
   };
  const handleLogout = async () => {
@@ -217,15 +203,14 @@ useEffect(() => {
         credentials: 'include',
       });
       
-      // Nettoyer le stockage local
       localStorage.removeItem('userName');
       localStorage.removeItem('userId');
-      localStorage.removeItem('userRole'); // Ajout de cette ligne
+      localStorage.removeItem('userRole'); 
 
       // Réinitialiser l'état
       setIsAuthenticated(false);
       setUserName('');
-      setUserRole(''); // Ajout de cette ligne
+      setUserRole(''); 
 
       setConversations([]);
       setMessages([]);
@@ -301,7 +286,9 @@ useEffect(() => {
             activeConversationId={activeConversationId}
             saveBotResponse={saveBotResponse}
             userName={userName}
-            toLogin={handleLogout} 
+            toLogin={handleLogout}
+            onNewChat={handleNewChat} 
+
           />
         }
         {page === "login" && <Login toSignin={() => setPage("signin")} onLoginSuccess={handleLoginSuccess}/>}