From f73cc530c384458c3ebe520a9c80d70465241920 Mon Sep 17 00:00:00 2001
From: Lukas <lukas.pupkalipinski@lpl-mind.de>
Date: Tue, 9 Jun 2026 19:20:27 +0200
Subject: [PATCH] fix(ui): improve suggestion handling in unresolved series
 template

- Update Font Awesome from 6.0.0 to 6.6.0
- Replace suggestion links with buttons for better click handling
- Add debug logging for troubleshooting suggestion clicks
- Use 'link' field as primary provider key source
---
 src/server/web/templates/unresolved.html | 50 ++++++++++++++++++------
 1 file changed, 37 insertions(+), 13 deletions(-)

diff --git a/src/server/web/templates/unresolved.html b/src/server/web/templates/unresolved.html
index bc50aba..8a3e437 100644
--- a/src/server/web/templates/unresolved.html
+++ b/src/server/web/templates/unresolved.html
@@ -6,7 +6,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>AniWorld Manager - Resolve Series</title>
     <link rel="stylesheet" href="/static/css/styles.css?v={{ static_version('css/styles.css') }}">
-    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
+    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" rel="stylesheet">
     <style>
         .unresolved-container {
             min-height: 100vh;
@@ -198,15 +198,27 @@
             font-size: 0.8rem;
         }
 
-        .suggestion-link {
+        .suggestion-btn {
+            background: none;
+            border: none;
             color: var(--color-accent);
-            text-decoration: none;
+            cursor: pointer;
+            padding: 0;
+            font-family: inherit;
+            font-size: inherit;
+            text-align: left;
         }
 
-        .suggestion-link:hover {
+        .suggestion-btn:hover {
             text-decoration: underline;
         }
 
+        .suggestion-btn .key-label {
+            color: var(--color-text-secondary);
+            font-size: 0.8rem;
+            margin-left: 0.3rem;
+        }
+
         .no-suggestions {
             display: flex;
             align-items: center;
@@ -591,12 +603,17 @@
         // Render functions
         function renderFolderItem(folder) {
             const suggestionsHtml = folder.search_suggestions && folder.search_suggestions.length > 0
-                ? folder.search_suggestions.map(s => `
+                ? folder.search_suggestions.map(s => {
+                    console.log('[DEBUG] Rendering suggestion:', s);
+                    return `
                     <div class="suggestion-item">
-                        <i class="fas fa-link"></i>
-                        <a href="#" class="suggestion-link" data-provider-key="${s.provider_key || s.key || ''}" data-folder="${folder.folder_name}">${s.name || s.title}</a>
+                        <i class="fas fa-hand-pointer"></i>
+                        <button class="suggestion-btn" data-provider-key="${s.link || s.provider_key || s.key || ''}" data-folder="${folder.folder_name}">
+                            ${s.name || s.title} <span class="key-label">(${s.link || ''})</span>
+                        </button>
                     </div>
-                `).join('')
+                    `;
+                }).join('')
                 : '<div class="no-suggestions"><i class="fas fa-info-circle"></i> No suggestions found</div>';
 
             // Always show search row so user can search multiple times
@@ -666,11 +683,16 @@
         }
 
         function attachSuggestionLinkEvents() {
-            document.querySelectorAll('.suggestion-link').forEach(link => {
+            document.querySelectorAll('.suggestion-btn').forEach(link => {
                 link.addEventListener('click', async (e) => {
                     e.preventDefault();
-                    const providerKey = e.target.dataset.providerKey;
-                    const folder = e.target.dataset.folder;
+                    // Use 'link' from closure, not e.target, to handle clicks on child elements
+                    const providerKey = link.dataset.providerKey;
+                    const folder = link.dataset.folder;
+                    
+                    console.log('[DEBUG] Suggestion clicked:', { providerKey, folder, link });
+                    console.log('[DEBUG] Full dataset:', link.dataset);
+                    console.log('[DEBUG] Suggestion object keys:', link.dataset);
                     
                     if (!providerKey) {
                         showToast('No provider key available for this suggestion', 'error');
@@ -823,8 +845,10 @@
                         if (result.search_suggestions && result.search_suggestions.length > 0) {
                             suggestionsEl.innerHTML = result.search_suggestions.map(s => `
                                 <div class="suggestion-item">
-                                    <i class="fas fa-link"></i>
-                                    <a href="#" class="suggestion-link" data-provider-key="${s.provider_key || s.key || ''}" data-folder="${folder}">${s.name || s.title}</a>
+                                    <i class="fas fa-hand-pointer"></i>
+                                    <button class="suggestion-btn" data-provider-key="${s.link || s.provider_key || s.key || ''}" data-folder="${folder}">
+                                        ${s.name || s.title} <span class="key-label">(${s.link || ''})</span>
+                                    </button>
                                 </div>
                             `).join('');
                         } else {