Something went wrong. Try again.
Mirror of https://github.com/kualta/site — web infrastructure
Something went wrong. Try again.
TypeScript
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354import { sitePostPath } from "@/lib/bluesky/urls";
/** Load visible cards only; connects for both initial HTML and live feed rows. */class BlueskyPostThreadElement extends HTMLElement { private observer?: IntersectionObserver; private controller?: AbortController; private loaded = false; private html = ""; private refresh = () => { if (this.loaded) void this.load(); };
connectedCallback() { window.addEventListener("bluesky:reply-published", this.refresh); if (this.loaded) return; this.observer = new IntersectionObserver((entries) => { if (entries.some((entry) => entry.isIntersecting)) { this.observer?.disconnect(); void this.load(); } }); this.observer.observe(this.closest(".site-bluesky-card") ?? this); } disconnectedCallback() { queueMicrotask(() => { if (this.isConnected) return; this.observer?.disconnect(); this.controller?.abort(); window.removeEventListener("bluesky:reply-published", this.refresh); }); } private async load() { const uri = this.dataset.uri; if (!uri) return; this.controller?.abort(); const controller = (this.controller = new AbortController()); try { const response = await fetch(`${sitePostPath(uri)}/thread`, { signal: controller.signal }); if (!response.ok) return; const html = await response.text(); if (!this.isConnected || controller.signal.aborted) return; // Keep focused menus and reply drafts when the same thread is read again. if (this.html !== html) { this.innerHTML = html; this.html = html; } this.loaded = true; } catch { // A thread failure must never hide the post or its existing conversation. } }}if (!customElements.get("bluesky-post-thread")) customElements.define("bluesky-post-thread", BlueskyPostThreadElement);