From 89fd147ac3e7cbe7baca01ccfc6dd51ac8ea9116 Mon Sep 17 00:00:00 2001
From: Knight-sys <vladimir.keblischbili@hotmail.com>
Date: Fri, 24 Oct 2025 10:58:15 -0500
Subject: [PATCH] fix: escape special characters in game names using event
 listeners

---
 web/static/app.js | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/web/static/app.js b/web/static/app.js
index 9b67030..2498b27 100644
--- a/web/static/app.js
+++ b/web/static/app.js
@@ -673,9 +673,13 @@ function renderSelectedGames(games) {
             <span class="drag-handle">☰</span>
             <span class="priority-number">${index + 1}</span>
             <span class="game-name">${game}</span>
-            <button class="remove-btn" onclick="removeGameFromWatch('${game}')">✕</button>
+            <button class="remove-btn">✕</button>
         `;
 
+        // Event listener for the delete button
+        const removeBtn = div.querySelector('.remove-btn');
+        removeBtn.addEventListener('click', () => removeGameFromWatch(game));
+
         // Drag event handlers
         div.addEventListener('dragstart', handleDragStart);
         div.addEventListener('dragover', handleDragOver);
@@ -708,9 +712,13 @@ function renderAvailableGames(games, filterText) {
         const label = document.createElement('label');
         label.className = 'game-checkbox';
         label.innerHTML = `
-            <input type="checkbox" value="${game}" onchange="toggleGameWatch('${game}', this.checked)">
+            <input type="checkbox" value="${game}">
             <span>${game}</span>
         `;
+
+        const checkbox = label.querySelector('input[type="checkbox"]');
+        checkbox.addEventListener('change', (e) => toggleGameWatch(game, e.target.checked));
+
         container.appendChild(label);
     });
 }