From 36b6b7845990f7d89a563e1e1ee900fa6f0b6b2e Mon Sep 17 00:00:00 2001
From: Julien Maille <julien.maille@gmail.com>
Date: Fri, 9 Jan 2026 21:41:40 +0100
Subject: [PATCH] FIX: broken display with tracks containing weird characters

---
 js/ui-interactions.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/js/ui-interactions.js b/js/ui-interactions.js
index 23e86a2..2187032 100644
--- a/js/ui-interactions.js
+++ b/js/ui-interactions.js
@@ -1,5 +1,5 @@
 //js/ui-interactions.js
-import { SVG_CLOSE, SVG_BIN, SVG_HEART, formatTime, trackDataStore, getTrackTitle, getTrackArtists } from './utils.js';
+import { SVG_CLOSE, SVG_BIN, SVG_HEART, formatTime, trackDataStore, getTrackTitle, getTrackArtists, escapeHtml } from './utils.js';
 import { sidePanelManager } from './side-panel.js';
 
 export function initializeUIInteractions(player, api) {
@@ -81,8 +81,8 @@ export function initializeUIInteractions(player, api) {
                         <img src="${api.getCoverUrl(track.album?.cover)}"
                              class="track-item-cover" loading="lazy">
                         <div class="track-item-details">
-                            <div class="title">${trackTitle}</div>
-                            <div class="artist">${trackArtists}</div>
+                            <div class="title">${escapeHtml(trackTitle)}</div>
+                            <div class="artist">${escapeHtml(trackArtists)}</div>
                         </div>
                     </div>
                     <div class="track-item-duration">${formatTime(track.duration)}</div>