WIP: Improve Nostr user metadata fetching

Use a multi-step process, caching results in between, while informing the user about the current steps/progress
2026-08-11 18:16:58 -06:00
parent 52742ba305
commit a9045fa413
9 changed files with 145 additions and 70 deletions
@@ -0,0 +1,50 @@
+import { Controller } from "@hotwired/stimulus"
+
+export default class extends Controller {
+  static targets = [ "status", "loading", "content" ]
+  static values  = { url: String }
+
+  connect () {
+    this.runStep("relays")
+  }
+
+  async runStep (step) {
+    const messages = {
+      relays:  "Looking up your relay list…",
+      profile: "Fetching your profile…",
+      blossom: "Fetching your media server list…",
+      render:  null
+    }
+
+    if (messages[step]) {
+      this.statusTarget.textContent = messages[step]
+    }
+
+    try {
+      const headers = (step === "render")
+        ? { "Accept": "text/html" }
+        : { "Accept": "application/json" }
+
+      const res = await fetch(`${this.urlValue}?step=${step}`, { headers })
+
+      if (!res.ok) {
+        throw new Error(`HTTP ${res.status}`)
+      }
+
+      if (step === "render") {
+        const html = await res.text()
+        this.loadingTarget.classList.add("hidden")
+        this.contentTarget.classList.remove("hidden")
+        this.contentTarget.innerHTML = html
+      } else {
+        const data = await res.json()
+        if (data.next) {
+          this.runStep(data.next)
+        }
+      }
+    } catch (error) {
+      console.warn("Nostr metadata fetch failed:", error.message)
+      this.statusTarget.textContent = "Something went wrong. Please reload."
+    }
+  }
+}