baileytownsend.dev
Shows how to get repo export and walk it in TypeScript
walktherepo.wisp.place
1<script lang="ts">
2 import {
3 CompositeHandleResolver,
4 DohJsonHandleResolver,
5 WellKnownHandleResolver,
6 CompositeDidDocumentResolver,
7 PlcDidDocumentResolver,
8 WebDidDocumentResolver,
9 } from '@atcute/identity-resolver';
10 import { isHandle } from '@atcute/lexicons/syntax';
11 import { getPdsEndpoint } from '@atcute/identity';
12
13
14 const handleResolver = new CompositeHandleResolver({
15 methods: {
16 dns: new DohJsonHandleResolver({ dohUrl: 'https://cloudflare-dns.com/dns-query' }),
17 http: new WellKnownHandleResolver(),
18 },
19 });
20
21
22 const didResolver = new CompositeDidDocumentResolver({
23 methods: {
24 plc: new PlcDidDocumentResolver(),
25 web: new WebDidDocumentResolver(),
26 },
27 });
28
29 let handleToLookUp = $state('');
30 let error: string | null = $state(null);
31 let slowpoke = $state(false);
32
33 let { resolvedResult } = $props();
34
35
36 const searchForUser = async (event: Event) => {
37 event.preventDefault();
38 error = null;
39 try {
40 let handle = handleToLookUp.replace(/^@/, '').toLowerCase();
41 if (!isHandle(handle)) {
42 error = 'Not a valid handle';
43 return;
44 }
45 let did = await handleResolver.resolve(handle);
46
47 const didDoc = await didResolver.resolve(did);
48 const pdsUrl = getPdsEndpoint(didDoc);
49
50 resolvedResult(did, handle, pdsUrl, slowpoke);
51 }catch(e){
52 if (e instanceof Error) {
53 error = e.message;
54 }
55 }
56 };
57
58
59</script>
60
61<form onsubmit={searchForUser} class="space-y-4">
62 <fieldset class="fieldset w-full">
63 <label class="label" for="search">ATProto Handle</label>
64 <input
65 bind:value={handleToLookUp}
66 id="search"
67 type="text"
68 placeholder="alice.bsky.social"
69 class="input input-bordered w-full"
70 />
71 </fieldset>
72
73 <fieldset class="fieldset bg-base-100 border-base-300 rounded-box w-64 border p-4">
74 <legend class="fieldset-legend">Slow Poke</legend>
75 <label class="label">
76 <input type="checkbox" bind:checked={slowpoke} class="toggle" />
77 uses web calls to walk the repo to show you the speed difference
78 </label>
79 </fieldset>
80
81 {#if error}
82 <div class="alert alert-error">
83 <svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" viewBox="0 0 24 24">
84 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" />
85 </svg>
86 <span>Error: {error}</span>
87 </div>
88 {/if}
89
90 <div class="form-control mt-6">
91 <button class="btn btn-primary">
92 Walk by {slowpoke ? 'API Calls' : 'Repo Export'}
93 </button>
94 </div>
95</form>