Function PostItemCard

packages/shared/src/components/post/PostItemCard.tsx:44–206

({
  postItem,
  showButtons = true,
  clickable = true,
  onHide,
  className,
  showVoteActions = false,
  logOrigin = Origin.Feed,
  indexes,
}: PostItemCardProps)

);

export default function PostItemCard({
  postItem,
  showButtons = true,
  clickable = true,
  onHide,
  className,
  showVoteActions = false,
  logOrigin = Origin.Feed,
  indexes,
}: PostItemCardProps): ReactElement {
  const { timestampDb, post } = postItem;
  const { source } = post;
  const sourceImage = source?.image ?? '';
  const onHideClick = (e: MouseEvent) => {
    e.stopPropagation();
    e.preventDefault();
    if (!onHide || !timestampDb) {
      return;
    }
    onHide({ postId: post.id, timestamp: timestampDb });
  };
  const article = post?.sharedPost ?? post;
  const isUserSource = isSourceUserSource(source);

  const { toggleUpvote, toggleDownvote } = useReadHistoryVotePost();

  const classes = classNames(
    'relative flex w-full flex-row py-3 pl-9 pr-5',
    showVoteActions ? 'items-start tablet:items-center' : 'items-center',
    clickable && 'hover:cursor-pointer hover:bg-surface-hover',
    className,
  );

  const title = post?.title || post?.sharedPost?.title;

  return (
    <article className={classNames(!clickable && classes)}>
      <ConditionalWrapper
        condition={clickable}
        wrapper={(children) => (
          <Link href={post.commentsPermalink}>
            <a className={classes} title="Go to post">
              {children}
            </a>
          </Link>
        )}
      >
        <>
          <Image
            src={article.image}
            alt={post.title}
            className="h-16 w-16 rounded-16 object-cover laptop:w-24"
            loading="lazy"
            fallbackSrc={cloudinaryPostImageCoverPlaceholder}
          />
          <SourceShadow
            className={classNames(
              showVoteActions && 'top-8',