Something went wrong. Try again.
View the firehose for an account but it looks ✨ fancy ✨ and also is not for debugging its for looking pretty. Url params are `did` and `firehose`
Something went wrong. Try again.
7.6 kB · 240 lines · Created 10mo ago
HTML
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241<!doctype html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Account status</title>
<script type="importmap"> { "imports": { "@atcute/cbor": "https://unpkg.com/@atcute/cbor/dist/index.js", "@atcute/cid": "https://unpkg.com/@atcute/cid/dist/index.js", "@atcute/multibase": "https://unpkg.com/@atcute/multibase/dist/index.js", "@atcute/uint8array": "https://unpkg.com/@atcute/uint8array/dist/index.js", "#bases/base16": "https://unpkg.com/@atcute/multibase/dist/bases/base16-web.js", "#bases/base64": "https://unpkg.com/@atcute/multibase/dist/bases/base64-web.js" } } </script> <script type="module"> const params = new URLSearchParams(new URL(window.location).search); window.user = params.get("did") ?? "did:plc:4zht3z4caxwrw3dlsybodywc"; window.pds = params.get("pds") ?? "katproto.girlonthemoon.xyz";
window.handle = await ( window.user.startsWith("did:plc") ? fetch(`https://plc.directory/${window.user}`) : fetch(`https://${window.user}/.well-known/did.json`) ) .then((res) => res.json()) .then((res) => res.alsoKnownAs ? (res.alsoKnownAs[0] ?? "handle.invalid") : "handle.invalid" );
document.querySelector("title").innerHTML = `${window.handle} • ${window.user}`; </script>
<style> html { background: repeating-linear-gradient(#fff1, #0000 5px, #fff1 10px), black; min-height: 100%; font-family: "Monaspace neon var", -moz-fixed, monospace; font-weight: bold; }
body, body * { /* override some resource://content-accessible/plaintext.css styles in ff */ white-space: pre !important; width: max-content; text-shadow: 0 0 5px lime; color: lime;
font-size: 10px;
&::selection { color: black; background-color: lime; } }
ul { margin: 0; padding: 0; list-style-type: "> "; padding-inline-start: 2ch; } </style> <script type="module"> import * as CBOR from "@atcute/cbor"; import * as CID from "@atcute/cid";
const events = document.createElement("ul");
document.body.innerHTML = `${window.user} ${window.handle} ${window.pds}\n`; document.body.append(events);
const ws = new WebSocket( "wss://" + window.pds + "/xrpc/com.atproto.sync.subscribeRepos" );
ws.addEventListener("open", () => console.info( "connected to wss://" + window.pds + "/xrpc/com.atproto.sync.subscribeRepos" ) ); ws.addEventListener("error", (err) => console.warn(err)); ws.addEventListener("close", () => console.error("Connection closed :("));
ws.addEventListener( "message", async (/** @type {{ data: Blob }} */ { data }) => { const [header, remainder] = CBOR.decodeFirst(await data.bytes()); const [payload] = CBOR.decodeFirst(remainder);
/** @type {{ * t: "#commit", * repo: string, * rev: string, * commit: { bytes: Uint8Array }, * blocks: Uint8Array, * ops: { * action: "create" | "update" | "delete", * path: string, * cid: { bytes: Uint8Array } * }[] * } | { * t: "#sync", * did: string, * rev: string, * blocks: Uint8Array * } | { * t: "#identity", * did: string, * handle: string * } | { * t: "#account", * did: string, * active: boolean, * status: string, * } | { * t: "#info", * name: string, * message: string, * }} */ const msg = { ...header, ...payload, };
switch (msg.t) { case "#commit": { console.log("#commit", msg.repo, msg.rev); break; } case "#sync": { console.log("#sync", msg.did, msg.rev); break; } case "#account": { console.log("#account", msg.did, msg.status); break; } case "#identity": { console.log("#account", msg.did, msg.handle); break; } case "#info": { console.log("#info", msg.name, msg.message); break; } }
// skip other users if ( (msg.t === "#commit" && msg.repo !== window.user) || ((msg.t === "#sync" || msg.t === "#account" || msg.t === "#identity") && msg.did !== window.user) ) return;
const li = document.createElement("li"); const pre = document.createElement("pre");
try { pre.innerText = ( msg.t === "#commit" ? [ `#commit {`, ` "repo": "${payload.repo}",`, ` "rev": "${payload.rev}",`, ` "commit": "${CID.toString(CID.decode(payload.commit.bytes))}",`, ` "ops": [`, payload.ops .map((op) => [ ` {`, ` "action": "${op.action}",`, ` "path": "${op.path}",`, ` "cid": ${op.cid ? `"${CID.toString(CID.decode(op.cid.bytes))}"` : "null"}`, `}`, ].join("\n ") ) .join(",\n"), ` ],`, `}`, ] : msg.t === "#sync" ? [ `#sync {`, ` "did": "${msg.did}",`, ` "rev": "${msg.rev}",`, `}`, ] : msg.t === "#account" ? [ `#account {`, ` "did": "${msg.did}",`, ` "active": ${msg.active},`, ` "status": "${msg.status}",`, `}`, ] : msg.t === "#identity" ? [ `#identity {`, ` "did": "${msg.did}",`, ` "handle": "${msg.handle}",`, `}`, ] : msg.t === "#info" ? [ `#info { "name": "${msg.name}", "message": "${msg.message}" }`, ] : ["#unknown {}"] ).join("\n"); } catch (err) { console.error(err, msg, data); }
if (pre.innerText === "") return;
li.append(pre); events.append(li); } ); </script> </head> <body></body></html>