desertthunder.dev
learn and share notes on atproto (wip) 馃
malfestio.stormlightlabs.org/
readability
solid
axum
atproto
srs
1import type { Note } from "$lib/model";
2import { A } from "@solidjs/router";
3import type { Component } from "solid-js";
4import { For, Show } from "solid-js";
5
6type BacklinksPanelProps = { backlinks: Note[] };
7
8/**
9 * Panel showing notes that link TO the current note (incoming references)
10 */
11export const BacklinksPanel: Component<BacklinksPanelProps> = (props) => {
12 return (
13 <div class="space-y-2">
14 <h3 class="text-sm font-semibold text-slate-400 uppercase tracking-wide">
15 Backlinks
16 <Show when={props.backlinks.length > 0}>
17 <span class="ml-1 text-slate-500">({props.backlinks.length})</span>
18 </Show>
19 </h3>
20 <Show when={props.backlinks.length > 0} fallback={<p class="text-sm text-slate-500 italic">No incoming links</p>}>
21 <ul class="space-y-1">
22 <For each={props.backlinks}>
23 {(note) => (
24 <li>
25 <A
26 href={`/notes/${note.id}`}
27 class="text-sm text-slate-300 hover:text-blue-400 flex items-center gap-1 transition-colors">
28 <span class="i-ri-arrow-left-up-line text-emerald-500" />
29 {note.title || "Untitled"}
30 </A>
31 </li>
32 )}
33 </For>
34 </ul>
35 </Show>
36 </div>
37 );
38};
39
40export default BacklinksPanel;