Implement passive consent evidence workflow with extension-driven capture

src/popup/popup.js

@@ -8,6 +8,19 @@ const requestMonitoringStatus = document.getElementById(
 );
 const consentCaptureToggle = document.getElementById("consent-capture-toggle");
 const consentCaptureStatus = document.getElementById("consent-capture-status");
+const preConsentCapture = document.getElementById("pre-consent-capture");
+const preConsentCaptureSummary = document.getElementById(
+  "pre-consent-capture-summary"
+);
+const preConsentCaptureStart = document.getElementById(
+  "pre-consent-capture-start"
+);
+const preConsentCaptureDecline = document.getElementById(
+  "pre-consent-capture-decline"
+);
+const preConsentCaptureStatus = document.getElementById(
+  "pre-consent-capture-status"
+);
 const maintenanceWarning = document.getElementById("maintenance-warning");
 const evidenceLockedCount = document.getElementById("evidence-locked-count");
 const evidenceDashboardButton = document.getElementById(
@@ -47,6 +60,7 @@ const evidenceStoreCountCells = {
 
 document.addEventListener("DOMContentLoaded", async () => {
   await renderSettings();
+  await renderPreConsentCaptureStatus();
   await renderEvidenceMaintenanceStatus();
   await renderEvidenceRetentionStatus();
 
@@ -57,7 +71,13 @@ document.addEventListener("DOMContentLoaded", async () => {
       "consentCaptureEnabled",
       consentCaptureToggle.checked
     );
+
+    if (consentCaptureToggle.checked) {
+      await probePreConsentCaptureForActiveTab();
+    }
+
     await renderSettings();
+    await renderPreConsentCaptureStatus();
 
     consentCaptureToggle.disabled = false;
   });
@@ -84,6 +104,8 @@ document.addEventListener("DOMContentLoaded", async () => {
   evidencePurgeUnlockedButton.addEventListener("click", openPurgeConfirmModal);
   evidencePurgeCancelButton.addEventListener("click", closePurgeConfirmModal);
   evidencePurgeConfirmButton.addEventListener("click", purgeUnlockedEvidence);
+  preConsentCaptureStart.addEventListener("click", startPreConsentCapture);
+  preConsentCaptureDecline.addEventListener("click", declinePreConsentCapture);
 });
 
 async function renderSettings() {
@@ -158,6 +180,137 @@ function renderEvidenceRetentionMessage(message) {
   evidenceRetentionStatus.textContent = message;
 }
 
+async function renderPreConsentCaptureStatus() {
+  try {
+    const activeTab = await getActiveTab();
+
+    if (!activeTab?.id) {
+      renderNoPreConsentCapture();
+      return;
+    }
+
+    const result = await browser.runtime.sendMessage({
+      type: "get_pre_consent_capture_status",
+      payload: {
+        tabId: activeTab.id
+      }
+    });
+
+    if (!result?.success) {
+      throw new Error(result?.error ?? "get_pre_consent_capture_status_failed");
+    }
+
+    renderPreConsentCapture(result.capture);
+  } catch (error) {
+    renderNoPreConsentCapture();
+    console.warn("VendorGet-IV pre-consent status failed", error);
+  }
+}
+
+async function probePreConsentCaptureForActiveTab() {
+  try {
+    const activeTab = await getActiveTab();
+
+    if (!activeTab?.id) {
+      return;
+    }
+
+    await browser.runtime.sendMessage({
+      type: "probe_pre_consent_capture_for_tab",
+      payload: {
+        tabId: activeTab.id
+      }
+    });
+  } catch (error) {
+    console.warn("VendorGet-IV pre-consent probe failed", error);
+  }
+}
+
+function renderPreConsentCapture(capture) {
+  if (!capture) {
+    renderNoPreConsentCapture();
+    return;
+  }
+
+  preConsentCapture.hidden = false;
+  preConsentCaptureStart.hidden = capture.status !== "attention";
+  preConsentCaptureDecline.hidden = capture.status !== "attention";
+
+  if (capture.status === "recording") {
+    preConsentCaptureSummary.textContent = "Pre-Consent-Erfassung läuft.";
+    preConsentCaptureStatus.textContent =
+      "Provider-Announcement wurde gesichert; warte auf useractioncomplete.";
+    return;
+  }
+
+  preConsentCaptureSummary.textContent = buildPreConsentCaptureSummary(capture);
+  preConsentCaptureStatus.textContent = "";
+}
+
+function renderNoPreConsentCapture() {
+  preConsentCapture.hidden = true;
+  preConsentCaptureSummary.textContent = "";
+  preConsentCaptureStatus.textContent = "";
+  preConsentCaptureStart.disabled = false;
+  preConsentCaptureDecline.disabled = false;
+}
+
+function buildPreConsentCaptureSummary(capture) {
+  const eventLabel = capture.firstEventStatus ?? "TCF-Event";
+  const eventCount = Number(capture.eventCount ?? 0);
+
+  return `${eventLabel} erkannt, ${eventCount} Pre-Consent-Event(s) gepuffert.`;
+}
+
+async function startPreConsentCapture() {
+  await answerPreConsentCapture("start_pre_consent_capture");
+}
+
+async function declinePreConsentCapture() {
+  await answerPreConsentCapture("decline_pre_consent_capture");
+}
+
+async function answerPreConsentCapture(messageType) {
+  preConsentCaptureStart.disabled = true;
+  preConsentCaptureDecline.disabled = true;
+
+  try {
+    const activeTab = await getActiveTab();
+
+    if (!activeTab?.id) {
+      throw new Error("active_tab_unavailable");
+    }
+
+    const result = await browser.runtime.sendMessage({
+      type: messageType,
+      payload: {
+        tabId: activeTab.id
+      }
+    });
+
+    if (!result?.success) {
+      throw new Error(result?.error ?? messageType);
+    }
+
+    renderPreConsentCapture(result.capture);
+  } catch (error) {
+    preConsentCaptureStatus.textContent = "Aktion konnte nicht ausgeführt werden";
+    console.warn("VendorGet-IV pre-consent action failed", error);
+  } finally {
+    preConsentCaptureStart.disabled = false;
+    preConsentCaptureDecline.disabled = false;
+  }
+}
+
+async function getActiveTab() {
+  const tabs = await browser.tabs.query({
+    active: true,
+    currentWindow: true
+  });
+
+  return tabs[0] ?? null;
+}
+
 function openPurgeConfirmModal() {
   evidencePurgeConfirmModal.hidden = false;
   evidencePurgeCancelButton.focus();