chore(demo): demo encadré avec une question fixe

Author: RedBoardDev

frontend/src/components/tchat/ChatInput.tsx

@@ -1,7 +1,7 @@
 import React, { useState, useRef, useEffect } from "react";
 import Icon from "@icon";
 import styles from "./ChatInput.module.css";
-import { Spin } from "antd";
+import { Button, Modal, Spin } from "antd";
 import { LoadingOutlined } from "@ant-design/icons";
 
 interface ChatInputProps {
@@ -12,6 +12,7 @@ interface ChatInputProps {
 const ChatInput: React.FC<ChatInputProps> = ({ onSendMessage, isLoading }) => {
   const [message, setMessage] = useState("");
   const textareaRef = useRef<HTMLTextAreaElement>(null);
+  const [isModalVisible, setIsModalVisible] = useState(false);
 
   const adjustTextareaHeight = () => {
     if (textareaRef.current) {
@@ -28,11 +29,12 @@ const ChatInput: React.FC<ChatInputProps> = ({ onSendMessage, isLoading }) => {
   }, [message]);
 
   const handleSend = () => {
-    onSendMessage(message);
-    setMessage("");
-    if (textareaRef.current) {
-      textareaRef.current.style.height = "auto";
-    }
+    // onSendMessage(message);
+    // setMessage("");
+    // if (textareaRef.current) {
+    //   textareaRef.current.style.height = "auto";
+    // }
+    setIsModalVisible(true)
   };
 
   const handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {
@@ -57,6 +59,7 @@ const ChatInput: React.FC<ChatInputProps> = ({ onSendMessage, isLoading }) => {
       <button
         className={styles.sendButton}
         disabled={!message.trim() || isLoading}
+        // disabled
         onClick={handleSend}
       >
         {isLoading ? (
@@ -75,6 +78,25 @@ const ChatInput: React.FC<ChatInputProps> = ({ onSendMessage, isLoading }) => {
           />
         )}
       </button>
+      <Modal
+        title="Fonctionnalité désactivée"
+        visible={isModalVisible}
+        onOk={() => setIsModalVisible(false)}
+        onCancel={() => setIsModalVisible(false)}
+        footer={[
+          <Button
+            key="ok"
+            type="primary"
+            onClick={() => setIsModalVisible(false)}
+          >
+            OK
+          </Button>,
+        ]}
+      >
+        <p>
+          Cette fonctionnalité est désactivée pour des fins de démonstration.
+        </p>
+      </Modal>
     </div>
   );
 };

frontend/src/views/chat/ChatContainer.module.css

@@ -26,7 +26,8 @@
   border-radius: 12px;
   color: #f5f5f5;
   font-size: 16px;
-  padding: 28px 28px;
+  padding: 12px;
+  height: auto;
   transition:
     background-color 0.3s ease,
     border-color 0.3s ease;

frontend/src/views/chat/ChatContainer.tsx

@@ -9,15 +9,11 @@ import { v4 as uuidv4 } from "uuid";
 import ApiFct from "@services/apiService";
 import { APP_ROUTES } from "@config/appRoutes";
 import { useMap } from "@contexts/MapContext";
-import L, { Point } from "leaflet";
 import addCustomPolygonToMap from "@utils/customPolygon";
 import { addMarkers } from "@utils/plugins";
 
 const suggestions = [
-  "Quelles sont les causes du changement climatique ?",
-  "Comment se forment les ouragans ?",
-  "Quels sont les impacts du réchauffement climatique ?",
-  "Comment prévenir les catastrophes naturelles ?",
+  "Quels risques d'inondation à Nice et quels dégâts potentiels sur les infrastructures publiques ?",
 ];
 
 const fktext = `Pour Nice, les données historiques indiquent que le risque d’inondation est élevé, avec une moyenne de 2 à 3 inondations majeures par décennie. En croisant ces informations avec la Base Permanente des Équipements et l’estimation financière des infrastructures publiques, il est estimé que les dégâts potentiels pourraient atteindre jusqu’à 15 millions d’euros en cas d’inondation majeure.
@@ -38,7 +34,6 @@ const ChatContainer: React.FC = () => {
   const [messages, setMessages] = useState<Message[]>([]);
   const [isTyping, setIsTyping] = useState(false);
   const { map } = useMap();
-  ``;
 
   useEffect(() => {
     if (chatId) {
@@ -69,7 +64,6 @@ const ChatContainer: React.FC = () => {
       updatedAt: number;
     } | null = null;
 
-    console.log("p1", chatId);
     if (!chatId) return;
     while (attempts > 0) {
       const chat = await ApiFct.getMessages(chatId);