Open source candidates with configured browser

public/app.js

@@ -791,8 +791,8 @@ function renderSourceCandidates(items) {
         actions.append(status, pictures);
         header.append(name, actions);
         const rows = item.candidates.length
-            ? item.candidates.map(renderSourceCandidateRow)
-            : [renderManualSearchRow(item.searchUrl, item.error || "Open search")];
+            ? item.candidates.map((candidate) => renderSourceCandidateRow(candidate, item.source))
+            : [renderManualSearchRow(item.searchUrl, item.error || "Open search", item.source)];
         section.append(header, ...rows);
         return section;
     }));
@@ -867,27 +867,51 @@ function updateFindSourcesButtonState() {
     setButtonLabel(findSourcesButton, hasSources ? "Find sources ✓" : "Find sources");
     findSourcesButton.disabled = !manufacturerSelect.value || !currentProduct;
 }
-function renderSourceCandidateRow(candidate) {
-    const row = document.createElement("a");
+function renderSourceCandidateRow(candidate, source) {
+    const row = document.createElement("div");
     row.className = "source-row";
-    row.href = candidate.url;
-    row.target = "_blank";
-    row.rel = "noreferrer";
     const title = document.createElement("span");
     title.className = "source-row-title";
     title.textContent = formatValue(candidate.title || candidate.url);
     title.title = formatValue(candidate.rawTitle || candidate.title || candidate.url);
-    const action = document.createElement("span");
+    const action = document.createElement("button");
+    action.type = "button";
     action.className = "source-row-action";
     action.textContent = "Open";
+    action.addEventListener("click", () => openSourceCandidate(candidate.url, source, action));
     row.append(title, action);
     return row;
 }
-function renderManualSearchRow(url, label) {
+async function openSourceCandidate(url, source, button) {
+    if (!url || !source?.key || !manufacturerSelect.value)
+        return;
+    const previousText = button.textContent;
+    button.disabled = true;
+    button.textContent = "Opening...";
+    try {
+        const params = new URLSearchParams({
+            manufacturerId: manufacturerSelect.value,
+            sourceKey: source.key,
+            url,
+        });
+        const response = await fetch(`/api/catalog-maker/open-source?${params.toString()}`);
+        const data = await response.json();
+        if (!response.ok || data.error)
+            throw new Error(data.error || "Source browser could not be opened.");
+    }
+    catch (error) {
+        alert(error.message || "Source browser could not be opened.");
+    }
+    finally {
+        button.disabled = false;
+        button.textContent = previousText;
+    }
+}
+function renderManualSearchRow(url, label, source) {
     return renderSourceCandidateRow({
         title: label,
         url,
-    });
+    }, source);
 }
 function closeSourceCandidates() {
     sourceModal.hidden = true;