From f111153bded4a354e7114d436434079231267581 Mon Sep 17 00:00:00 2001
From: Vibe Nuage Agent <vibe@mistral.ai>
Date: Fri, 5 Jun 2026 18:50:09 +0000
Subject: [PATCH] =?UTF-8?q?Fix:=20Event-Delegation=20f=C3=BCr=20dynamisch?=
 =?UTF-8?q?=20erstellte=20Buttons=20(Bearbeiten/L=C3=B6schen=20in=20Tee-Ka?=
 =?UTF-8?q?rten).=20Entfernt=20onclick-Attribute=20und=20ersetzt=20sie=20d?=
 =?UTF-8?q?urch=20data-Attribute=20+=20Event-Delegation=20auf=20dem=20Cont?=
 =?UTF-8?q?ainer.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: trevor1969 <trevor1969@users.noreply.github.com>
---
 app.js | 25 +++++++++++++++++++++----
 1 file changed, 21 insertions(+), 4 deletions(-)

diff --git a/app.js b/app.js
index 345b918..6797dd2 100644
--- a/app.js
+++ b/app.js
@@ -652,6 +652,23 @@ class TeeTracker {
             document.getElementById('add-tea-btn').addEventListener('click', () => this.openTeaModal());
         }
         
+        // Event delegation for tea action buttons (edit/delete)
+        const teasListContainer = document.getElementById('teas-list');
+        if (teasListContainer) {
+            teasListContainer.addEventListener('click', (e) => {
+                const editBtn = e.target.closest('.tea-edit-btn');
+                const deleteBtn = e.target.closest('.tea-delete-btn');
+                
+                if (editBtn) {
+                    const teaId = editBtn.dataset.teaId;
+                    if (teaId) this.editTea(teaId);
+                } else if (deleteBtn) {
+                    const teaId = deleteBtn.dataset.teaId;
+                    if (teaId) this.showDeleteTeaConfirm(teaId);
+                }
+            });
+        }
+        
         // Tea modal
         if (document.getElementById('close-modal')) {
             document.getElementById('close-modal').addEventListener('click', () => this.closeTeaModal());
@@ -1308,8 +1325,8 @@ class TeeTracker {
                 ${tea.brand ? `<div class="tea-brand">Marke: ${tea.brand}</div>` : ''}
                 ${tea.description ? `<div class="tea-description">${tea.description}</div>` : ''}
                 <div class="tea-actions">
-                    <button class="tea-action-btn tea-edit-btn" onclick="window.app.editTea('${tea.id}')">Bearbeiten</button>
-                    <button class="tea-action-btn tea-delete-btn" onclick="window.app.showDeleteTeaConfirm('${tea.id}')">Löschen</button>
+                    <button class="tea-action-btn tea-edit-btn" data-tea-id="${tea.id}" data-action="edit">Bearbeiten</button>
+                    <button class="tea-action-btn tea-delete-btn" data-tea-id="${tea.id}" data-action="delete">Löschen</button>
                 </div>
             </div>
         `).join('');
@@ -1356,8 +1373,8 @@ class TeeTracker {
                 ${tea.brand ? `<div class="tea-brand">Marke: ${tea.brand}</div>` : ''}
                 ${tea.description ? `<div class="tea-description">${tea.description}</div>` : ''}
                 <div class="tea-actions">
-                    <button class="tea-action-btn tea-edit-btn" onclick="window.app.editTea('${tea.id}')">Bearbeiten</button>
-                    <button class="tea-action-btn tea-delete-btn" onclick="window.app.showDeleteTeaConfirm('${tea.id}')">Löschen</button>
+                    <button class="tea-action-btn tea-edit-btn" data-tea-id="${tea.id}" data-action="edit">Bearbeiten</button>
+                    <button class="tea-action-btn tea-delete-btn" data-tea-id="${tea.id}" data-action="delete">Löschen</button>
                 </div>
             </div>
         `).join('');