From 00267da3dd30177d053463fbc7b8cd31008b73cf Mon Sep 17 00:00:00 2001
From: David Alvarez <davidalvarez81@gmail.com>
Date: Wed, 27 May 2026 11:57:16 +0200
Subject: [PATCH] fix: manual title input searches IGDB first, warns before
 uploading
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Flow when auto-search finds nothing:
1. User types a title → presses Enter/clicks button
2. System searches IGDB with that title
3a. Results found → shown as selectable cards
3b. No results → warning + amber 'Upload anyway as xxx' button
4. Button label changes: 'Search' → 'Upload' after manual search

Also changed Enter key behavior: first press searches, second
press uploads (if no results after manual search)
---
 frontend/src/pages/Library.svelte | 38 ++++++++++++++++++++++++-------
 1 file changed, 30 insertions(+), 8 deletions(-)

diff --git a/frontend/src/pages/Library.svelte b/frontend/src/pages/Library.svelte
index 76ea009..159f9bd 100644
--- a/frontend/src/pages/Library.svelte
+++ b/frontend/src/pages/Library.svelte
@@ -15,6 +15,7 @@
   let searching = $state(false);
   let searchError = $state("");
   let igdbResults = $state(null); // null=loading, []=no results, [{...}]=matches
+  let manualSearched = $state(false); // true after user clicked Search manually
 
   let fileInput;
 
@@ -39,6 +40,7 @@
     igdbResults = null;
     searching = true;
     searchError = "";
+    manualSearched = false;
     fileInput.value = "";
     // Auto-search IGDB with the filename
     searchIGDB(name).then(data => {
@@ -54,6 +56,7 @@
   async function handleManualSearch() {
     const q = pendingTitle.trim();
     if (!q) return;
+    manualSearched = true;
     searching = true;
     searchError = "";
     igdbResults = null;
@@ -61,7 +64,7 @@
       const data = await searchIGDB(q);
       igdbResults = data.results || [];
       if (igdbResults.length === 0) {
-        searchError = "No matches found on IGDB.";
+        searchError = "No matches found for \"" + q + "\" on IGDB.";
       }
     } catch (err) {
       searchError = "IGDB search failed: " + err.message;
@@ -76,6 +79,7 @@
     pendingTitle = "";
     igdbResults = null;
     searchError = "";
+    manualSearched = false;
   }
 
   async function doUpload(title) {
@@ -173,20 +177,27 @@
             </div>
           {:else}
             {#if searchError}
-              <div class="status-msg error-msg">{searchError}</div>
+              <div class="status-msg error-msg">
+                {searchError}
+                {#if manualSearched}
+                  <button class="btn btn-sm btn-upload-anyway" onclick={() => doUpload(pendingTitle.trim())} disabled={uploading}>
+                    {uploading ? "Uploading..." : "Upload anyway as \"" + pendingTitle.trim() + "\""}
+                  </button>
+                {/if}
+              </div>
             {:else}
-              <p class="match-label">No matches found on IGDB. Enter a title manually:</p>
+              <p class="match-label">No matches found. Enter a title to search IGDB:</p>
             {/if}
             <div class="upload-custom-row">
               <input
                 type="text"
-                placeholder="Enter game title..."
+                placeholder="Search IGDB..."
                 bind:value={pendingTitle}
-                disabled={uploading}
-                onkeydown={(e) => e.key === "Enter" && doUpload(pendingTitle.trim())}
+                disabled={uploading || searching}
+                onkeydown={(e) => e.key === "Enter" && (manualSearched ? doUpload(pendingTitle.trim()) : handleManualSearch())}
               />
-              <button class="btn" onclick={() => doUpload(pendingTitle.trim())} disabled={uploading || !pendingTitle.trim()}>
-                {uploading ? "Uploading..." : "Upload"}
+              <button class="btn" onclick={manualSearched ? () => doUpload(pendingTitle.trim()) : handleManualSearch} disabled={uploading || searching || !pendingTitle.trim()}>
+                {uploading ? "Uploading..." : manualSearched ? "Upload" : "Search"}
               </button>
             </div>
             <button class="btn btn-secondary" onclick={() => doUpload(pendingFileName)} disabled={uploading}>
@@ -466,4 +477,15 @@
   .btn-secondary:hover {
     border-color: var(--text-dim);
   }
+  .btn-upload-anyway {
+    margin-top: 8px;
+    width: 100%;
+    justify-content: center;
+    border-color: #cc8833;
+    color: #ffaa44;
+  }
+  .btn-upload-anyway:hover {
+    background: #332211;
+    border-color: #ffaa44;
+  }
 </style>