aylac.top
juli.ee
+71
-76
src/components/backlinks.tsx
+71
-76
src/components/backlinks.tsx
···
24
24
const Backlinks = (props: { target: string }) => {
25
25
const fetchBacklinks = async () => {
26
26
const res = await getAllBacklinks(props.target);
27
-
setBacklinks(linksBySource(res.links));
28
-
return res;
27
+
return linksBySource(res.links);
29
28
};
30
29
31
30
const [response] = createResource(fetchBacklinks);
32
-
const [backlinks, setBacklinks] = createSignal<any>();
33
31
34
32
const [show, setShow] = createSignal<{
35
33
collection: string;
···
38
36
} | null>();
39
37
40
38
return (
41
-
<Show when={response()}>
42
-
<div class="flex w-full flex-col gap-1 text-sm wrap-anywhere">
43
-
<For each={backlinks()}>
44
-
{({ collection, path, counts }) => (
39
+
<div class="flex w-full flex-col gap-1 text-sm wrap-anywhere">
40
+
<Show when={response()?.length === 0}>
41
+
<p>No backlinks found.</p>
42
+
</Show>
43
+
<For each={response()}>
44
+
{({ collection, path, counts }) => (
45
+
<div>
45
46
<div>
46
-
<div>
47
-
<div title="Collection containing linking records" class="flex items-center gap-1">
48
-
<span class="iconify lucide--book-text shrink-0"></span>
49
-
{collection}
50
-
</div>
51
-
<div title="Record path where the link is found" class="flex items-center gap-1">
52
-
<span class="iconify lucide--route shrink-0"></span>
53
-
{path.slice(1)}
54
-
</div>
47
+
<div title="Collection containing linking records" class="flex items-center gap-1">
48
+
<span class="iconify lucide--book-text shrink-0"></span>
49
+
{collection}
50
+
</div>
51
+
<div title="Record path where the link is found" class="flex items-center gap-1">
52
+
<span class="iconify lucide--route shrink-0"></span>
53
+
{path.slice(1)}
55
54
</div>
56
-
<div class="ml-4.5">
57
-
<p>
58
-
<button
59
-
class="text-blue-400 hover:underline active:underline"
60
-
title="Show linking records"
61
-
onclick={() =>
62
-
(
63
-
show()?.collection === collection &&
64
-
show()?.path === path &&
65
-
!show()?.showDids
66
-
) ?
67
-
setShow(null)
68
-
: setShow({ collection, path, showDids: false })
69
-
}
70
-
>
71
-
{counts.records} record{counts.records < 2 ? "" : "s"}
72
-
</button>
73
-
{" from "}
74
-
<button
75
-
class="text-blue-400 hover:underline active:underline"
76
-
title="Show linking DIDs"
77
-
onclick={() =>
78
-
(
79
-
show()?.collection === collection &&
80
-
show()?.path === path &&
81
-
show()?.showDids
82
-
) ?
83
-
setShow(null)
84
-
: setShow({ collection, path, showDids: true })
85
-
}
86
-
>
87
-
{counts.distinct_dids} DID
88
-
{counts.distinct_dids < 2 ? "" : "s"}
89
-
</button>
90
-
</p>
91
-
<Show when={show()?.collection === collection && show()?.path === path}>
92
-
<Show when={show()?.showDids}>
93
-
{/* putting this in the `dids` prop directly failed to re-render. idk how to solidjs. */}
94
-
<p class="w-full font-semibold">Distinct identities</p>
95
-
<BacklinkItems
96
-
target={props.target}
97
-
collection={collection}
98
-
path={path}
99
-
dids={true}
100
-
/>
101
-
</Show>
102
-
<Show when={!show()?.showDids}>
103
-
<p class="w-full font-semibold">Records</p>
104
-
<BacklinkItems
105
-
target={props.target}
106
-
collection={collection}
107
-
path={path}
108
-
dids={false}
109
-
/>
110
-
</Show>
55
+
</div>
56
+
<div class="ml-4.5">
57
+
<p>
58
+
<button
59
+
class="text-blue-400 hover:underline active:underline"
60
+
title="Show linking records"
61
+
onclick={() =>
62
+
(
63
+
show()?.collection === collection &&
64
+
show()?.path === path &&
65
+
!show()?.showDids
66
+
) ?
67
+
setShow(null)
68
+
: setShow({ collection, path, showDids: false })
69
+
}
70
+
>
71
+
{counts.records} record{counts.records < 2 ? "" : "s"}
72
+
</button>
73
+
{" from "}
74
+
<button
75
+
class="text-blue-400 hover:underline active:underline"
76
+
title="Show linking DIDs"
77
+
onclick={() =>
78
+
show()?.collection === collection && show()?.path === path && show()?.showDids ?
79
+
setShow(null)
80
+
: setShow({ collection, path, showDids: true })
81
+
}
82
+
>
83
+
{counts.distinct_dids} DID
84
+
{counts.distinct_dids < 2 ? "" : "s"}
85
+
</button>
86
+
</p>
87
+
<Show when={show()?.collection === collection && show()?.path === path}>
88
+
<Show when={show()?.showDids}>
89
+
{/* putting this in the `dids` prop directly failed to re-render. idk how to solidjs. */}
90
+
<p class="w-full font-semibold">Distinct identities</p>
91
+
<BacklinkItems
92
+
target={props.target}
93
+
collection={collection}
94
+
path={path}
95
+
dids={true}
96
+
/>
97
+
</Show>
98
+
<Show when={!show()?.showDids}>
99
+
<p class="w-full font-semibold">Records</p>
100
+
<BacklinkItems
101
+
target={props.target}
102
+
collection={collection}
103
+
path={path}
104
+
dids={false}
105
+
/>
111
106
</Show>
112
-
</div>
107
+
</Show>
113
108
</div>
114
-
)}
115
-
</For>
116
-
</div>
117
-
</Show>
109
+
</div>
110
+
)}
111
+
</For>
112
+
</div>
118
113
);
119
114
};
120
115