Update app.py

app.py

@@ -1,51 +1,72 @@
 import gradio as gr
 from transformers import pipeline
 
-# Carga del modelo con autenticación automática usando token en entorno
 classifier = pipeline(
     "text-classification",
     model="distilbert-base-uncased-finetuned-sst-2-english",
     use_auth_token=True
 )
 
-notes = []
-
-def add_note(title, content):
+def add_note(title, content, state):
     if not content.strip():
-        return "Por favor ingresa contenido para la nota."
+        return gr.update(), state, "⚠️ Escribe contenido (no vacío)."
     result = classifier(content)[0]
     label = result["label"]
-    notes.append({
+    note = {
         "title": title or "Sin título",
         "content": content,
         "category": label
-    })
-
-    # Construir HTML para mostrar todas las notas
-    display = ""
-    for note in notes:
-        display += f"<div style='border:1px solid #1a1a2e; background:#222; border-radius:8px; padding:10px; margin-bottom:12px;'>"
-        display += f"<h3 style='color:#0099ff;'>{note['title']}</h3>"
-        display += f"<p style='color:#e3eaff;'>{note['content']}</p>"
-        display += f"<strong style='color:#0099ff;'>Categoría sugerida: {note['category']}</strong></div>"
-    return display
+    }
+    notes = state or []
+    notes.append(note)
+    notes_html = ""
+    for idx, n in enumerate(notes):
+        notes_html += f'''
+            <div style="border:1px solid #1a1a2e;background:#222;border-radius:8px;padding:10px;margin-bottom:18px;position:relative;">
+                <h3 style="color:#0099ff;">{n["title"]}</h3>
+                <p style="color:#e3eaff;">{n["content"]}</p>
+                <strong style="color:#0099ff;">Categoría IA: {n["category"]}</strong>
+                <button onclick="navigator.clipboard.writeText(`{n["title"]}\\n{n["content"]}`)" style="position:absolute;top:10px;right:10px;background:#23233a;color:#62cfff;border:none;padding:5px 7px;border-radius:6px;cursor:pointer;">Copiar</button>
+            </div>
+        '''
+    notes_html += """
+    <button onclick="downloadNotes()" style="background:#0099ff;color:white;border:none;padding:10px 18px;border-radius:8px;cursor:pointer;">
+      Descargar todas tus notas
+    </button>
+    <script>
+    function downloadNotes() {
+        let divs = document.querySelectorAll('div[style*="border:1px solid"]');
+        let text = "";
+        divs.forEach((div) => {
+            text += div.querySelector('h3').textContent + "\\n";
+            text += div.querySelector('p').textContent + "\\n\\n";
+        });
+        let blob = new Blob([text], {type:"text/plain"});
+        let link = document.createElement('a');
+        link.href = window.URL.createObjectURL(blob);
+        link.download = "mis_notas.txt";
+        link.click();
+    }
+    </script>
+    """
+    return notes_html, notes, "✅ Nota guardada"
 
 with gr.Blocks(theme=gr.themes.Base(primary_hue="blue")) as demo:
     gr.Markdown("<h1 style='color:#0099ff; text-align:center;'>BATUTO_IA_NOTAS</h1>")
     gr.Markdown("<p style='color:#e3eaff; text-align:center;'>Bloc de notas inteligente con tema oscuro y fuentes azules.</p>")
+    state = gr.State([])
     with gr.Row():
         title = gr.Textbox(label="Título", elem_id="titlebox")
         content = gr.Textbox(lines=4, label="Contenido de la nota", elem_id="contentbox")
     submit = gr.Button("Guardar nota", elem_id="savebtn")
-    show_notes = gr.HTML()
-    submit.click(add_note, [title, content], show_notes)
-    gr.Markdown(
-        """
-        <style>
-        body { background: #181824; }
-        #titlebox, #contentbox, #savebtn { color: #0099ff !important; background: #23233a; border-radius: 8px; }
-        </style>
-        """
-    )
+    show_notes = gr.HTML(label="Tus notas")
+    status = gr.Markdown()
+    submit.click(add_note, [title, content, state], [show_notes, state, status])
+    gr.Markdown("""
+    <style>
+    body { background: #181824; }
+    #titlebox, #contentbox, #savebtn { color: #0099ff !important; background: #23233a; border-radius: 8px; }
+    </style>
+    """)
 
 demo.launch()