Something went wrong. Try again.
a tool for shared writing and social publishing
Something went wrong. Try again.
1.4 kB · 46 lines
TSX
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647import { AtUri } from "@atproto/api";import { atUriToUrl } from "src/utils/mentionUtils";
/** * Component for rendering at-uri mentions (publications and documents) as clickable links. * NOTE: This component's styling and behavior should match the ProseMirror schema rendering * in components/Blocks/TextBlock/schema.ts (atMention mark). If you update one, update the other. */export function AtMentionLink({ atURI, children, className = "",}: { atURI: string; children: React.ReactNode; className?: string;}) { const aturi = new AtUri(atURI); const isPublication = aturi.collection === "pub.leaflet.publication"; const isDocument = aturi.collection === "pub.leaflet.document";
// Show publication icon if available const icon = isPublication || isDocument ? ( <img src={`/api/pub_icon?at_uri=${encodeURIComponent(atURI)}`} className="inline-block w-5 h-5 rounded-full mr-1 align-text-top" alt="" width="20" height="20" loading="lazy" /> ) : null;
return ( <a href={atUriToUrl(atURI)} target="_blank" rel="noopener noreferrer" className={`text-accent-contrast hover:underline cursor-pointer ${isPublication ? "font-bold" : ""} ${isDocument ? "italic" : ""} ${className}`} > {icon} {children} </a> );}