A React component library for rendering common AT Protocol records for applications such as Bluesky and Leaflet.
1export interface ParsedAtUri {
2 did: string;
3 collection: string;
4 rkey: string;
5}
6
7export function parseAtUri(uri?: string): ParsedAtUri | undefined {
8 if (!uri || !uri.startsWith('at://')) return undefined;
9 const withoutScheme = uri.slice('at://'.length);
10 const [did, collection, rkey] = withoutScheme.split('/');
11 if (!did || !collection || !rkey) return undefined;
12 return { did, collection, rkey };
13}
14
15export function toBlueskyPostUrl(target: ParsedAtUri): string | undefined {
16 if (target.collection !== 'app.bsky.feed.post') return undefined;
17 return `https://bsky.app/profile/${target.did}/post/${target.rkey}`;
18}
19
20export function formatDidForLabel(did: string): string {
21 return did.replace(/^did:(plc:)?/, '');
22}
23
24const ABSOLUTE_URL_PATTERN = /^[a-zA-Z][a-zA-Z\d+\-.]*:/;
25
26export function normalizeLeafletBasePath(basePath?: string): string | undefined {
27 if (!basePath) return undefined;
28 const trimmed = basePath.trim();
29 if (!trimmed) return undefined;
30 const withScheme = ABSOLUTE_URL_PATTERN.test(trimmed) ? trimmed : `https://${trimmed}`;
31 try {
32 const url = new URL(withScheme);
33 url.hash = '';
34 return url.href.replace(/\/?$/, '');
35 } catch {
36 return undefined;
37 }
38}
39
40export function leafletRkeyUrl(basePath: string | undefined, rkey: string): string | undefined {
41 const normalized = normalizeLeafletBasePath(basePath);
42 if (!normalized) return undefined;
43 return `${normalized}/${encodeURIComponent(rkey)}`;
44}