update

browser_extension/config/popup.js

@@ -1,7 +1,9 @@
 const SERVER_URL = "https://youtube.marha.de/profiles";
 const container = document.getElementById("profiles");
+const statusEl = document.getElementById("cookieStatus");
+const syncBtn = document.getElementById("syncBtn");
 
-async function load() {
+async function loadProfiles() {
   try {
     const res = await fetch(SERVER_URL);
     const profiles = await res.json();
@@ -27,4 +29,41 @@ async function load() {
   }
 }
 
-load();
+function formatAgo(iso) {
+  const diff = Date.now() - new Date(iso).getTime();
+  const mins = Math.floor(diff / 60000);
+  if (mins < 1) return "gerade eben";
+  if (mins < 60) return `vor ${mins} min`;
+  const hrs = Math.floor(mins / 60);
+  if (hrs < 24) return `vor ${hrs} h`;
+  const days = Math.floor(hrs / 24);
+  return `vor ${days} Tagen`;
+}
+
+async function refreshStatus() {
+  const { lastCookieSync } = await browser.storage.local.get("lastCookieSync");
+  if (!lastCookieSync) {
+    statusEl.className = "status";
+    statusEl.textContent = "noch nicht synchronisiert";
+    return;
+  }
+  if (lastCookieSync.ok) {
+    statusEl.className = "status ok";
+    statusEl.textContent = `OK (${lastCookieSync.count} Cookies, ${formatAgo(lastCookieSync.when)})`;
+  } else {
+    statusEl.className = "status fail";
+    statusEl.textContent = `Fehler: ${lastCookieSync.error}`;
+  }
+}
+
+syncBtn.addEventListener("click", async () => {
+  syncBtn.disabled = true;
+  syncBtn.textContent = "Syncing...";
+  await browser.runtime.sendMessage({ type: "sync-cookies" });
+  await refreshStatus();
+  syncBtn.disabled = false;
+  syncBtn.textContent = "Jetzt synchronisieren";
+});
+
+loadProfiles();
+refreshStatus();