Add markdown rendering for /field-notes route

requirements.txt

@@ -1,4 +1,5 @@
 gradio>=6.0,<7.0
 httpx>=0.28,<1.0
+markdown>=3.7,<4.0
 numpy
 piper-tts>=1.2,<2.0

server_app.py

@@ -1,4 +1,3 @@
-import html
 import logging
 import os
 import tempfile
@@ -8,6 +7,7 @@ from gradio.data_classes import FileData
 from fastapi.responses import HTMLResponse, FileResponse
 
 from core import process_turn, end_session_click, reset_session, make_initial_state
+from markdown import markdown
 
 log = logging.getLogger(__name__)
 logging.basicConfig(level=logging.INFO, force=True)
@@ -113,35 +113,35 @@ _FIELD_NOTES_HTML_TEMPLATE = """\
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>Field Notes · Patient Virtuel</title>
 <style>
-  *, *::before, *::after {{ margin: 0; box-sizing: border-box; }}
-  body {{
+  *, *::before, *::after { margin: 0; box-sizing: border-box; }
+  body {
     background: #19120c; color: #efe0d4;
     font-family: "EB Garamond", Georgia, serif;
     line-height: 1.7; padding: 2rem 1rem;
-  }}
-  article {{
+  }
+  article {
     max-width: 720px; margin: 0 auto;
-  }}
-  h1 {{ font-size: 2rem; margin-bottom: 0.5rem; color: #ff5719; }}
-  h2 {{ font-size: 1.4rem; margin: 2rem 0 0.5rem; color: #ff5719; }}
-  h3 {{ font-size: 1.1rem; margin: 1.5rem 0 0.3rem; color: #e6beb2; }}
-  p  {{ margin: 0.6rem 0; }}
-  pre {{ background: #221a13; padding: 1rem; border-radius: 8px;
+  }
+  h1 { font-size: 2rem; margin-bottom: 0.5rem; color: #ff5719; }
+  h2 { font-size: 1.4rem; margin: 2rem 0 0.5rem; color: #ff5719; }
+  h3 { font-size: 1.1rem; margin: 1.5rem 0 0.3rem; color: #e6beb2; }
+  p  { margin: 0.6rem 0; }
+  pre { background: #221a13; padding: 1rem; border-radius: 8px;
         overflow-x: auto; font-size: 0.85rem; margin: 1rem 0;
-        border: 1px solid rgba(255,200,150,0.1); }}
-  code {{ background: #221a13; padding: 0.1em 0.3em; border-radius: 4px;
-         font-size: 0.9em; }}
-  table {{ border-collapse: collapse; margin: 1rem 0; width: 100%; }}
-  th, td {{ border: 1px solid #5c4037; padding: 0.4rem 0.6rem; text-align: left; }}
-  th {{ background: #312821; color: #ff5719; }}
-  a {{ color: #ff5719; }}
-  hr {{ border: none; border-top: 1px solid #5c4037; margin: 2rem 0; }}
-  ul, ol {{ margin: 0.5rem 0 0.5rem 1.5rem; }}
+        border: 1px solid rgba(255,200,150,0.1); }
+  code { background: #221a13; padding: 0.1em 0.3em; border-radius: 4px;
+         font-size: 0.9em; }
+  table { border-collapse: collapse; margin: 1rem 0; width: 100%; }
+  th, td { border: 1px solid #5c4037; padding: 0.4rem 0.6rem; text-align: left; }
+  th { background: #312821; color: #ff5719; }
+  a { color: #ff5719; }
+  hr { border: none; border-top: 1px solid #5c4037; margin: 2rem 0; }
+  ul, ol { margin: 0.5rem 0 0.5rem 1.5rem; }
 </style>
 </head>
 <body>
 <article>
-{content}
+%s
 </article>
 </body>
 </html>"""
@@ -156,9 +156,8 @@ async def field_notes():
     except FileNotFoundError:
         return "<h1>Field Notes not found</h1>"
 
-    escaped = html.escape(raw)
-    html_content = escaped.replace("\n", "<br>")
-    return _FIELD_NOTES_HTML_TEMPLATE.format(content=html_content)
+    body = markdown(raw, extensions=["fenced_code", "tables"])
+    return _FIELD_NOTES_HTML_TEMPLATE.replace("%s", body, 1)
 
 
 if __name__ == "__main__":