finxol.io
1import { getAvatar, getUsers, resolveAliases } from "./atproto"
2
3
4const users = await getUsers()
5
6let cleared = false
7
8const spinner = document.getElementById("users__spinner")
9
10const list = document.createElement("div")
11for (const user of users) {
12 if (!user.active) {
13 continue;
14 }
15
16 if (!cleared) {
17 document.querySelector("section.users > p")?.remove()
18 cleared = true
19 }
20
21 const handleElement = document.createElement("div")
22 handleElement.textContent = user.did
23
24 const handle = (await resolveAliases(user.did))?.at(0)?.replace("at://", "") || user.did
25
26 const container = document.createElement("div")
27 container.innerHTML = `
28 <img src="${await getAvatar(user.did)}" alt="${handle}" />
29 <div class="info">
30 <a href="https://pdsls.dev/at://${user.did}" class="handle" target="_blank">
31 ${handle}
32 </a>
33 </div>
34 `
35 list.appendChild(container)
36}
37
38
39const doc = document.querySelector("section.users")
40if (!doc) {
41 throw new Error("Could not find section.users")
42}
43doc.appendChild(list)
44
45spinner?.remove()