Function FeedPost

packages/ui/src/feed-post.tsx:14–100

(props: { postId: string })

import { Link } from './ui/link';

export const FeedPost = async (props: { postId: string }) => {
	const result = await messages.load(props.postId);
	if (!result) return null;
	const { message: rootOrComment, channel: thread, parent, server } = result;
	if (
		!rootOrComment ||
		!rootOrComment.parentChannelId ||
		!rootOrComment.public ||
		server.kickedTime
	)
		return null;

	const root =
		rootOrComment.id !== thread.id
			? await findMessageByIdWithDiscordAccount(thread.id)
			: rootOrComment;
	if (!root || !root.public) return null;
	const comment = rootOrComment.id !== thread.id ? rootOrComment : null;

	const count = await channelCountsLoader.load(thread.id);

	const focused = comment ?? root;
	const discordMarkdownAsHTML = await parse(focused.content);
	const firstImage = focused.attachments.filter(isImageAttachment).at(0);

	const MainContent = () => (
		<div className={'inner'}>
			<div className="flex flex-col items-start gap-2 pb-2 text-xs sm:flex-row sm:items-center md:text-base">
				<Link
					href={`/c/${server.id}`}
					className={'flex items-center gap-2 hover:underline'}
				>
					<ServerIcon server={server} size={24} />
					<span>{server.name}</span>
				</Link>
				<div className={'flex flex-col gap-2 md:flex-row'}>
					<span className={'hidden text-sm text-muted-foreground md:block'}>
						•
					</span>
					<span className={'text-sm text-muted-foreground'}>
						Created by {root.author.name} on {getSnowflakeUTCDate(root.id)} in{' '}
						<Link
							className={'hover:underline'}
							href={`/c/${server.id}/${parent.id}`}
						>
							#{parent.name}
						</Link>
					</span>
				</div>
			</div>
			<div className={'pb-2 font-semibold'}>
				<span className={'text-lg'}>{thread.name}</span>
			</div>
			<div
				className={
					'max-h-[300px] overflow-hidden whitespace-break-spaces font-body text-primary'
				}
			>