Function PickRow

packages/shared/src/features/daily/CoverGrid.tsx:161–317

({
  post,
  position,
  onExpand,
  onBookmark,
  onVoteMutate,
}: {
  post: Post;
  position: number;
  onExpand: () => void;
  onBookmark: () => void;
  onVoteMutate: UseVotePostProps['onMutate'];
})

};

const PickRow = ({
  post,
  position,
  onExpand,
  onBookmark,
  onVoteMutate,
}: {
  post: Post;
  position: number;
  onExpand: () => void;
  onBookmark: () => void;
  onVoteMutate: UseVotePostProps['onMutate'];
}): ReactElement => {
  const { source } = post;
  const { title } = useSmartTitle(post);
  const summary = post.summary || post.sharedPost?.summary;
  const [isExpanded, setIsExpanded] = useState(false);
  const panelId = `daily-pick-${post.id}`;
  const impressionRef = useLogImpression(
    {
      type: FeedItemType.Post,
      post,
      page: 0,
      index: position,
      dataUpdatedAt: 0,
    },
    position,
    1,
    0,
    position,
    DAILY_FEED_NAME,
    undefined,
    undefined,
    Origin.DailyPage,
  );

  const onToggle = () => {
    const willOpen = !isExpanded;
    setIsExpanded(willOpen);
    if (willOpen) {
      onExpand();
    }
  };

  return (
    <li ref={impressionRef}>
      <button
        type="button"
        onClick={onToggle}
        aria-expanded={isExpanded}
        aria-controls={panelId}
        className={classNames(
          'group flex w-full items-center gap-4 px-4 py-4 text-left transition-colors tablet:px-5',
          !isExpanded && 'hover:bg-surface-float',
        )}
      >
        <Typography
          tag={TypographyTag.H3}