forked from
pds.ls/pdsls
atproto explorer
add spinning wheel to getRepo
+14
-6
+14
-6
src/views/repo.tsx
+14
-6
src/views/repo.tsx
···
13
13
14
14
const RepoView = () => {
15
15
const params = useParams();
16
+
const [downloading, setDownloading] = createSignal(false);
16
17
const [didDoc, setDidDoc] = createSignal<DidDocument>();
17
18
const [backlinks, setBacklinks] = createSignal<{
18
19
links: LinkData;
···
49
50
50
51
const downloadRepo = async () => {
51
52
try {
53
+
setDownloading(true);
52
54
const response = await fetch(
53
55
`${pds}/xrpc/com.atproto.sync.getRepo?did=${did}`,
54
56
);
···
69
71
} catch (error) {
70
72
console.error("Download failed:", error);
71
73
}
74
+
setDownloading(false);
72
75
};
73
76
74
77
return (
···
166
169
<div class="i-tabler-external-link ml-0.5 text-xs" />
167
170
</a>
168
171
</Show>
169
-
<button
170
-
onclick={() => downloadRepo()}
171
-
class="text-lightblue-500 flex w-fit items-center hover:underline"
172
-
>
173
-
Export repo
174
-
</button>
172
+
<div class="flex items-center gap-1">
173
+
<button
174
+
onclick={() => downloadRepo()}
175
+
class="text-lightblue-500 flex w-fit items-center hover:underline"
176
+
>
177
+
Export repo
178
+
</button>
179
+
<Show when={downloading()}>
180
+
<div class="i-line-md-loading-twotone-loop" />
181
+
</Show>
182
+
</div>
175
183
<Show when={backlinks()}>
176
184
{(backlinks) => (
177
185
<div class="mt-2 border-t border-neutral-500 pt-2">