Something went wrong. Try again.
a tool for shared writing and social publishing
Something went wrong. Try again.
1.3 kB · 53 lines
TSX
at main
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354import { atUriToUrl, classifyAtUri } 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, href, icon: iconUrl, children, className = "",}: { atURI: string; href?: string; icon?: string; children: React.ReactNode; className?: string;}) { const { isPublication, isDocument } = classifyAtUri(atURI);
// Show publication icon, or service-provided icon const iconSrc = isPublication || isDocument ? `/api/pub_icon?at_uri=${encodeURIComponent(atURI)}` : iconUrl ?? null;
const icon = iconSrc ? ( <img src={iconSrc} className="inline-block w-4 h-4 rounded-full mr-1 mt-[3px] align-text-top" alt="" width="20" height="20" loading="lazy" /> ) : null;
const linkHref = href || atUriToUrl(atURI);
return ( <a href={linkHref} target="_blank" rel="noopener noreferrer" className={`mention ${isPublication ? "font-bold" : ""} ${isDocument ? "italic" : ""} ${className}`} > {icon} {children} </a> );}