Global (globals.css):
- prefers-reduced-motion: désactive toutes les animations/transitions
- focus-visible:ring global sur tous les éléments interactifs
Search modal:
- role="dialog" + aria-modal="true" + aria-label
- onClick backdrop ferme la modale
Insights peek:
- DOMPurify.sanitize() sur dangerouslySetInnerHTML (XSS fix)
Login form:
- autoComplete="email" / "current-password"
- htmlFor sur tous les labels
Register form:
- autoComplete="name" / "email" / "new-password"
- htmlFor sur tous les labels
GridCard (notes-list-views):
- Actions visibles sur mobile (opacity-100 sm:opacity-0)
- aria-sort sur colonne triable
- role="button" + tabIndex + onKeyDown sur lignes table
Editorial view:
- role="button" + tabIndex + onKeyDown sur articles
- Menu trigger aria-label + visible mobile
Toolbar:
- aria-label voice i18n
Sidebar (UX: User Freedom):
- Visible par défaut sur /insights (pas caché par le système)
- Toggle via bouton hamburger: toggle-insights-sidebar event
- Préférence persistée en localStorage (insights-sidebar-collapsed)
- User décide: voir ou cacher le sidebar
Cluster chips:
- Triées par taille (plus grand cluster en premier)
- Compteur de notes par cluster (badge arrondi)
- max-w-[120px] sur le nom pour éviter overflow
- padding/gap plus compacts (px-2.5 py-1 gap-1.5)
AGENTS.md: 'pas la liste carnets sur /insights'
- sidebar.tsx: isImmersiveRoute sur /insights → fixed overlay au lieu de relative
- Toutes tailles d'écran: sidebar caché par défaut, s'ouvre en drawer
- Bouton hamburger visible sur desktop + mobile (pas lg:hidden)
- Insights prend 100% de la largeur → graphe + dashboard plus spacious
- handleNoteClick fetch la note + ouvre peek panel au lieu de naviguer
- Panel fixed right (left en RTL), spring animation (stiffness 340 damping 34)
- Header avec titre + boutons Maximize2 (ouvrir note complète) et X (fermer)
- Content rendu en read-only via dangerouslySetInnerHTML
- prefers-reduced-motion: animation désactivée
- responsive: w-full sur mobile, 50vw/640px max sur desktop
Accessibility (CRITIQUE per UI/UX Pro Max skill):
- NetworkGraph Accessibility Grade D → added accessible List view alternative
(toggle Graph/List with cluster→notes table, keyboard navigable)
- aria-label text summary on graph container for screen readers
- role=button + tabIndex + onKeyDown on bridge note cards (keyboard accessible)
- focus-visible:ring on all interactive cards (isolated clusters, bridges, list items)
UX (HIGH):
- prefers-reduced-motion: whileHover disabled when user prefers reduced motion
- cursor-pointer verified + focus-visible:ring-ochre on all clickable cards
- Mobile sidebar: hamburger Menu button in header (dispatches open-mobile-sidebar)
Performance (MEDIUM):
- NetworkGraph lazy-loaded via next/dynamic (D3 ~200KB deferred, ssr:false)
- Loading spinner shown while D3 chunk loads
i18n:
- listView, graphAriaLabel, listAriaLabel added to 15 locales
Quand la similarité whole-note ne passe pas le seuil, vérifie les chunks.
Si une section spécifique de la note A résonne avec une section de la note B,
la connexion est créée avec le snippet précis qui a matché.
SQL: cross-join LATERAL sur NoteEmbeddingChunk avec pgvector <=>.
Fallback gracieux si la table chunks est vide ou erreur.
Rend les liens entre notes visibles et persistants (sync NoteLink au save, auto-save, graphe réseau rafraîchi), ajoute living blocks, Memory Echo, recherche globale, consentement IA explicite et consolide les prototypes design en architectural-grid.
Co-authored-by: Cursor <cursoragent@cursor.com>
