katproto_index / katproto_users.ts

const ESCAPE_LOOKUP: Record<string, string> = {
  "&": "&amp;",
  '"': "&quot;",
  "'": "&apos;",
  "<": "&lt;",
  ">": "&gt;",
};
const PDS = "https://katproto.girlonthemoon.xyz";

async function getKatprotoUsers() {
  const users = await fetch(PDS + "/xrpc/com.atproto.sync.listRepos")
    // type cast because no point validating for smthn like this
    // real type has more info; not needed here
    .then((res) => res.json() as Promise<{ repos: { did: string }[] }>)
    .then((res) =>
      // get display name, handle, and did for each user
      res.repos.map((repo) => ({
        display: fetch(
          `${PDS}/xrpc/com.atproto.repo.getRecord?repo=${repo.did}&collection=app.bsky.actor.profile&rkey=self`
        )
          .then((res) => res.json())
          .then((profile) => profile.value.displayName),
        // dont validate handles because I'm Lazy + trust myself
        handle: fetch(
          repo.did.startsWith("did:plc")
            ? "https://plc.directory/" + repo.did
            : `https://${repo.did.replace("did:web:", "")}/.well-known/did.json`
        )
          .then((res) => res.json())
          .then((doc) => doc.alsoKnownAs[0].replace("at://", "")),
        did: repo.did,
      }))
    )
    .then(
      async (users) =>
        await Promise.all(
          users.map(
            async (x) =>
              `<li><a href="https://bsky.app/profile/${x.did}">${await x.display}</a></li>`
          )
        )
    );

  return users.join("");
}

async function checkStatus() {
  const statusElement = document.getElementById("current-status");
  if (!statusElement) return;

  // try get `/xrpc/_health`
  const result = await fetch(PDS + "/xrpc/_health")
    .then(async (res) => ({
      status: res.status,
      statusText: res.statusText,
      res: await res.text(),
    }))
    .catch((err) => {
      // we only return undefined if we get a type error
      // this means we were blocked by permissions (cors) (upstream is offline)
      // or the device couldnt connect (main server and index is offline)
      if (err instanceof TypeError) return undefined;
      console.warn("Ignoring:", err);
      // if we didnt expect this error we want to bubble it up as normal
      throw err;
    });

  // make sure html is escaped for status text
  // this could (in theory) be anything so we should make sure its escaped properly
  // also an & could break things
  if (result) {
    result.statusText = result.statusText.replaceAll(
      /[&"'<>]/g,
      (c) => ESCAPE_LOOKUP[c]
    );
  }

  if (!result) {
    statusElement.innerHTML = "🔴 Offline";
    statusElement.title = "The server could not be reached.";
    return;
  }

  if (result.status < 200 || result.status > 299) {
    statusElement.innerHTML = `🟡 Some Issues: ${result.status} ${result.statusText}`;
    statusElement.title = result.res;
  }

  statusElement.innerHTML = `🟢 Online`;
  statusElement.title = result.res;
}

// silence errors
getKatprotoUsers().catch((err) => console.warn(err));
addEventListener("load", () => checkStatus().catch((err) => console.warn(err)));