Something went wrong. Try again.
a tool for shared writing and social publishing
Something went wrong. Try again.
1.8 kB · 71 lines
TSX
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172import { RichText, AppBskyFeedPost, AppBskyRichtextFacet } from "@atproto/api";
// this function is ripped straight from the bluesky-social repo// https://github.com/bluesky-social/social-app/blob/main/bskyembed/src/components/post.tsx#L119export function BlueskyRichText({ record,}: { record: AppBskyFeedPost.Record | null;}) { if (!record) return null;
const rt = new RichText({ text: record.text, facets: record.facets, });
const richText = [];
let counter = 0; for (const segment of rt.segments()) { if ( segment.link && AppBskyRichtextFacet.validateLink(segment.link).success ) { richText.push( <a key={counter} href={segment.link.uri} className="text-accent-contrast hover:underline" target="_blank" > {segment.text} </a>, ); } else if ( segment.mention && AppBskyRichtextFacet.validateMention(segment.mention).success ) { richText.push( <a key={counter} href={`https://bsky.app/profile/${segment.mention.did}`} className="text-accent-contrast hover:underline" target="_blank" > {segment.text} </a>, ); } else if ( segment.tag && AppBskyRichtextFacet.validateTag(segment.tag).success ) { richText.push( <a key={counter} href={`https://bsky.app/tag/${segment.tag.tag}`} className="text-accent-contrast hover:underline" target="_blank" > {segment.text} </a>, ); } else { richText.push(segment.text); }
counter++; }
return <p className="whitespace-pre-wrap">{richText}</p>;}