From 2a74503bed76218020f94f7831713282d1d1a7ca Mon Sep 17 00:00:00 2001
From: Bruno Charest <bruno.charest@gmail.com>
Date: Fri, 29 May 2026 23:30:06 -0400
Subject: [PATCH] =?UTF-8?q?fix:=20header=202=20lignes=20+=20aper=C3=A7u=20?=
 =?UTF-8?q?utilise=20/raw=20+=20corrige=20regex=20newline?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/index.html  | 20 +++++++++++---------
 frontend/js/graph.js |  4 ++--
 2 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/frontend/index.html b/frontend/index.html
index 01532f0..d6cc1b1 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -700,18 +700,20 @@
   <!-- Graph View Modal -->
   <div class="editor-modal" id="graph-modal">
     <div class="editor-container" style="max-width:95vw;width:1000px;height:85vh;display:flex;flex-direction:column;">
-      <div class="editor-header" style="flex-wrap:wrap;gap:4px">
-        <div class="editor-actions" style="flex:1;min-width:0;display:flex;align-items:center;gap:4px;flex-wrap:wrap">
-          <span id="graph-info" style="font-size:0.75rem;color:var(--text-muted);margin-right:4px;white-space:nowrap"></span>
-          <label style="font-size:0.7rem;color:var(--text-muted);margin-right:2px">Profondeur:</label>
+      <div class="editor-header" style="flex-wrap:wrap;gap:2px">
+        <div class="editor-actions" style="width:100%;display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding-bottom:4px">
+          <span id="graph-info" style="font-size:0.75rem;color:var(--text-muted);white-space:nowrap"></span>
+          <label style="font-size:0.7rem;color:var(--text-muted)">Profondeur:</label>
           <input type="range" id="graph-depth" min="0" max="3" value="1" style="width:50px" title="Profondeur d'exploration">
           <button class="editor-btn" id="graph-full-vault" title="Vue complète du vault" aria-label="Vault complet" style="font-size:0.7rem">🌐 Tout</button>
-          <span style="color:var(--border-color);margin:0 2px">│</span>
+          <span style="color:var(--border-color);margin:0 4px">│</span>
           <i data-lucide="search" style="width:14px;height:14px;color:var(--text-muted);flex-shrink:0"></i>
-          <input type="text" id="graph-search" placeholder="Rechercher un nœud..." style="width:160px;font-size:0.75rem;padding:2px 8px;border-radius:4px;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary)">
+          <input type="text" id="graph-search" placeholder="Rechercher un nœud..." style="width:180px;font-size:0.75rem;padding:2px 8px;border-radius:4px;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary)">
           <i data-lucide="tag" style="width:14px;height:14px;color:var(--text-muted);flex-shrink:0;margin-left:4px"></i>
-          <input type="text" id="graph-tag-filter" placeholder="Filtrer par tag..." style="width:120px;font-size:0.75rem;padding:2px 8px;border-radius:4px;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary)">
-          <span style="font-size:0.65rem;color:var(--text-muted);margin-left:4px;opacity:0.6">Ctrl+survol = aperçu</span>
+          <input type="text" id="graph-tag-filter" placeholder="Filtrer par tag..." style="width:140px;font-size:0.75rem;padding:2px 8px;border-radius:4px;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary)">
+          <span style="font-size:0.65rem;color:var(--text-muted);margin-left:4px;opacity:0.6;white-space:nowrap">Ctrl+survol = aperçu</span>
+        </div>
+        <div class="editor-actions" style="width:100%;display:flex;align-items:center;gap:4px;border-top:1px solid var(--border-color);padding-top:3px">
           <span style="flex:1"></span>
           <button class="editor-btn" id="graph-zoom-in" title="Zoom avant" aria-label="Zoom avant">
             <i data-lucide="zoom-in" style="width:16px;height:16px"></i>
@@ -732,7 +734,7 @@
             <i data-lucide="x" style="width:16px;height:16px"></i>
           </button>
         </div>
-        <div class="editor-title" id="graph-title" style="width:100%;font-size:0.85rem;padding-top:2px;border-top:1px solid var(--border-color);margin-top:2px">Vue Graphique</div>
+        <div class="editor-title" id="graph-title" style="width:100%;font-size:0.85rem;padding-top:2px;border-top:1px solid var(--border-color)">Vue Graphique</div>
       </div>
       <div class="editor-body" style="flex:1;overflow:hidden;position:relative;padding:0">
         <canvas id="graph-canvas" style="width:100%;height:100%;cursor:grab"></canvas>
diff --git a/frontend/js/graph.js b/frontend/js/graph.js
index 75eef68..cb465a2 100644
--- a/frontend/js/graph.js
+++ b/frontend/js/graph.js
@@ -653,8 +653,8 @@ export const GraphViewManager = {
     // Show loading indicator
     this._showPreviewTooltip(node, 'Chargement...', screenX, screenY);
     try {
-      const data = await api(`/api/file/${encodeURIComponent(this._vault)}?path=${encodeURIComponent(node.path)}`);
-      const content = (data.content || '').substring(0, 400).replace(/\\n/g, ' ');
+      const data = await api(`/api/file/${encodeURIComponent(this._vault)}/raw?path=${encodeURIComponent(node.path)}`);
+      const content = (data.raw || '').substring(0, 400).replace(/\n/g, ' ');
       this._previewCache[cacheKey] = content;
       this._showPreviewTooltip(node, content, screenX, screenY);
     } catch {