Update app.py

app.py

@@ -4,28 +4,24 @@ import time
 from llama_cpp import Llama
 import os
 from huggingface_hub import hf_hub_download
-import base64
 
 # Configuration du modèle
 MODEL_NAME = "Dorian2B/Vera-v1.5-Instruct-GGUF"
 MODEL_FILE = "vera-v1.5-instruct-q8_0.gguf"
 
-# Variables globales pour les paramètres
-model_instance = None
-
 def download_model():
     model_path = hf_hub_download(repo_id=MODEL_NAME, filename=MODEL_FILE)
     return model_path
 
-def load_model(context_size=4096):
+def load_model():
     model_path = download_model()
     
     # Paramètres pour le modèle
     model = Llama(
         model_path=model_path,
-        n_ctx=context_size,  # Taille du contexte configurable
+        n_ctx=4096,  # Taille du contexte
         n_gpu_layers=-1,  # Utilise tous les layers disponibles sur GPU si possible
-        verbose=False  # Désactive les logs verbeux
+        verbose=False  # Désactive les logs verbeaux
     )
     return model
 
@@ -44,40 +40,10 @@ def format_prompt(message, history):
     
     return prompt
 
-# Animation de réflexion (robot qui pense)
-def thinking_animation():
-    # GIF animation encodée en base64
-    robot_animation = """
-    <div style="display: flex; justify-content: center; margin: 20px 0;">
-        <div class="loading-animation">
-            <div class="robot">
-                <div class="antenna"></div>
-                <div class="head">
-                    <div class="eye left"></div>
-                    <div class="eye right"></div>
-                    <div class="mouth"></div>
-                </div>
-                <div class="body">
-                    <div class="arm left"></div>
-                    <div class="arm right"></div>
-                </div>
-            </div>
-        </div>
-        <div style="margin-left: 20px; font-size: 18px; color: #666; margin-top: 50px;">Vera réfléchit...</div>
-    </div>
-    """
-    return robot_animation
-
 # Fonction d'inférence avec streaming
-def generate_response(message, history, temperature, top_p, context_size):
-    global model_instance
-    
-    # Recharger le modèle si les paramètres de contexte ont changé
-    if not model_instance or model_instance.n_ctx() != context_size:
-        model_instance = load_model(context_size)
-    
-    # Animation de réflexion
-    yield history + [(message, thinking_animation())]
+def generate_response(message, history):
+    if not hasattr(generate_response, "model"):
+        generate_response.model = load_model()
     
     # Ajout du message utilisateur à l'historique
     history = history + [(message, "")]
@@ -87,11 +53,11 @@ def generate_response(message, history, temperature, top_p, context_size):
     response_text = ""
     
     # Utilise le stream pour générer la réponse progressivement
-    for token in model_instance.create_completion(
+    for token in generate_response.model.create_completion(
         prompt,
-        max_tokens=min(2048, context_size // 2),  # S'assurer que max_tokens ne dépasse pas la moitié du contexte
-        temperature=temperature,
-        top_p=top_p,
+        max_tokens=2048,
+        temperature=0.7,
+        top_p=0.95,
         stop=["</s>", "<|user|>", "<|system|>"],
         stream=True,
     ):
@@ -119,122 +85,10 @@ footer {visibility: hidden}
     background: linear-gradient(135deg, #6e8efb, #a777e3);
     color: white;
     border-radius: 15px 15px 0 15px;
-    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
 }
 .chatbot .bot-message {
     background: #f0f2f5;
     border-radius: 15px 15px 15px 0;
-    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
-}
-.input-textbox {
-    border: 2px solid #ddd !important;
-    border-radius: 12px !important;
-    transition: border-color 0.3s ease !important;
-}
-.input-textbox:focus {
-    border-color: #6e8efb !important;
-    box-shadow: 0 0 0 3px rgba(110, 142, 251, 0.1) !important;
-}
-.parameters-box {
-    border-radius: 10px;
-    background: #fff;
-    padding: 15px;
-    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
-    margin-top: 10px;
-}
-.slider-label {
-    font-weight: 600;
-    color: #444;
-}
-
-/* Animation du robot qui réfléchit */
-@keyframes thinking {
-    0% { transform: translateY(0); }
-    50% { transform: translateY(-10px); }
-    100% { transform: translateY(0); }
-}
-@keyframes blink {
-    0% { opacity: 1; }
-    50% { opacity: 0.5; }
-    100% { opacity: 1; }
-}
-@keyframes wave {
-    0% { transform: rotate(0deg); }
-    25% { transform: rotate(20deg); }
-    75% { transform: rotate(-20deg); }
-    100% { transform: rotate(0deg); }
-}
-.loading-animation {
-    width: 100px;
-    height: 150px;
-    position: relative;
-}
-.robot {
-    animation: thinking 2s ease-in-out infinite;
-}
-.antenna {
-    width: 4px;
-    height: 15px;
-    background-color: #888;
-    position: absolute;
-    top: 0;
-    left: 48px;
-    border-radius: 2px;
-}
-.head {
-    width: 60px;
-    height: 50px;
-    background-color: #6e8efb;
-    border-radius: 15px;
-    position: absolute;
-    top: 15px;
-    left: 20px;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-around;
-    align-items: center;
-    padding: 10px;
-}
-.eye {
-    width: 12px;
-    height: 12px;
-    background-color: white;
-    border-radius: 50%;
-    animation: blink 2.5s ease-in-out infinite;
-}
-.mouth {
-    width: 20px;
-    height: 5px;
-    background-color: white;
-    border-radius: 2px;
-    margin-top: 5px;
-}
-.body {
-    width: 70px;
-    height: 60px;
-    background-color: #a777e3;
-    border-radius: 10px;
-    position: absolute;
-    top: 65px;
-    left: 15px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 0 5px;
-}
-.arm {
-    width: 8px;
-    height: 40px;
-    background-color: #6e8efb;
-    border-radius: 4px;
-}
-.arm.left {
-    transform-origin: top center;
-    animation: wave 1.5s ease-in-out infinite;
-}
-.arm.right {
-    transform-origin: top center;
-    animation: wave 1.5s ease-in-out infinite reverse;
 }
 """
 
@@ -257,95 +111,37 @@ with gr.Blocks(css=custom_css, theme=gr.themes.Soft()) as demo:
                 elem_id="chatbot",
                 container=True,
                 elem_classes="chatbot-container",
-                render=True,  # Pour supporter le HTML dans les réponses
             )
     
     with gr.Row():
         with gr.Column(scale=4):
             message = gr.Textbox(
-                placeholder="Entrez votre message ici... (Entrée pour envoyer, Maj+Entrée pour nouvelle ligne)",
+                placeholder="Entrez votre message ici...",
                 lines=2,
-                max_lines=10,
                 container=True,
                 scale=4,
                 autofocus=True,
-                elem_classes="input-textbox",
-                submit_btn=True,  # Bouton d'envoi intégré
             )
         with gr.Column(scale=1):
             with gr.Row():
                 submit_btn = gr.Button("Envoyer", variant="primary", scale=2)
                 reset_btn = gr.Button("Réinitialiser", variant="secondary", scale=1)
     
-    # Paramètres du modèle
-    with gr.Row(elem_classes="parameters-box"):
-        with gr.Column(scale=1):
-            temperature = gr.Slider(
-                minimum=0.1, 
-                maximum=1.5, 
-                value=0.7, 
-                step=0.1, 
-                label="Température", 
-                info="Contrôle la créativité (plus élevé = plus créatif)",
-                elem_classes="slider-label"
-            )
-        with gr.Column(scale=1):
-            top_p = gr.Slider(
-                minimum=0.1, 
-                maximum=1.0, 
-                value=0.95, 
-                step=0.05, 
-                label="Top P", 
-                info="Contrôle la diversité des réponses",
-                elem_classes="slider-label"
-            )
-        with gr.Column(scale=1):
-            context_size = gr.Slider(
-                minimum=1024, 
-                maximum=8192, 
-                value=4096, 
-                step=1024, 
-                label="Taille du contexte", 
-                info="Mémoire du modèle (plus élevé = plus de contexte)",
-                elem_classes="slider-label"
-            )
-    
     with gr.Accordion("À propos du modèle", open=False):
         gr.Markdown("""
         Ce modèle est basé sur **Vera-v1.5-Instruct-GGUF** de [Dorian2B](https://huggingface.co/Dorian2B/Vera-v1.5-Instruct-GGUF).
         Le modèle est optimisé pour les conversations en français.
         
-        **Paramètres ajustables:**
-        - **Température**: Contrôle la créativité et l'aléatoire des réponses. Une valeur basse génère des réponses plus déterministes et focalisées, tandis qu'une valeur haute donne des réponses plus créatives et diverses.
-        - **Top P**: Également appelé "nucleus sampling", il filtre les tokens les moins probables. Une valeur de 0.95 signifie que seuls les tokens qui constituent 95% de la probabilité de masse sont considérés.
-        - **Taille du contexte**: Détermine combien de tokens précédents le modèle peut "voir" pour générer sa réponse. Une valeur plus grande permet de maintenir une conversation plus longue, mais utilise plus de mémoire.
+        **Paramètres du modèle:**
+        - Température: 0.7
+        - Top-p: 0.95
+        - Contexte: 4096 tokens
         """)
     
-    # JavaScript pour la gestion de Maj+Entrée
-    gr.HTML("""
-    <script>
-    document.addEventListener('DOMContentLoaded', function() {
-        // Permettre à Shift+Enter d'insérer une nouvelle ligne au lieu de soumettre
-        setTimeout(() => {
-            const textareas = document.querySelectorAll('textarea');
-            textareas.forEach(textarea => {
-                textarea.addEventListener('keydown', function(e) {
-                    if (e.key === 'Enter' && !e.shiftKey) {
-                        e.preventDefault();
-                        const submitButton = textarea.closest('.gradio-container').querySelector('button[data-testid="submit"]');
-                        if (submitButton) submitButton.click();
-                    }
-                });
-            });
-        }, 1000); // Délai pour s'assurer que tous les éléments sont chargés
-    });
-    </script>
-    """)
-    
     # Configuration des événements
     submit_btn.click(
         fn=generate_response,
-        inputs=[message, chatbot, temperature, top_p, context_size],
+        inputs=[message, chatbot],
         outputs=[chatbot],
         queue=True
     ).then(
@@ -355,7 +151,7 @@ with gr.Blocks(css=custom_css, theme=gr.themes.Soft()) as demo:
     
     message.submit(
         fn=generate_response,
-        inputs=[message, chatbot, temperature, top_p, context_size],
+        inputs=[message, chatbot],
         outputs=[chatbot],
         queue=True
     ).then(
@@ -370,15 +166,5 @@ with gr.Blocks(css=custom_css, theme=gr.themes.Soft()) as demo:
 
 # Lancement de l'interface
 if __name__ == "__main__":
-    # Pré-télécharger le modèle au démarrage
-    print("Téléchargement du modèle...")
-    model_path = download_model()
-    print(f"Modèle téléchargé à {model_path}")
-    
-    # Initialiser le modèle au démarrage
-    print("Initialisation du modèle...")
-    model_instance = load_model()
-    print("Modèle initialisé avec succès!")
-    
     demo.queue()
     demo.launch(share=True, show_error=True)