({
item,
index,
row,
column,
columns,
openNewTab,
postMenuIndex,
user,
feedName,
ranking,
toggleUpvote,
toggleDownvote,
onPostClick,
onShare,
onCopyLinkClick,
toggleBookmark,
onMenuClick,
onCommentClick,
onReadArticleClick,
virtualizedNumCards,
wideColSpan,
searchLogExtra,
}: FeedItemComponentProps)
| 260 | }; |
| 261 | |
| 262 | function FeedItemComponent({ |
| 263 | item, |
| 264 | index, |
| 265 | row, |
| 266 | column, |
| 267 | columns, |
| 268 | openNewTab, |
| 269 | postMenuIndex, |
| 270 | user, |
| 271 | feedName, |
| 272 | ranking, |
| 273 | toggleUpvote, |
| 274 | toggleDownvote, |
| 275 | onPostClick, |
| 276 | onShare, |
| 277 | onCopyLinkClick, |
| 278 | toggleBookmark, |
| 279 | onMenuClick, |
| 280 | onCommentClick, |
| 281 | onReadArticleClick, |
| 282 | virtualizedNumCards, |
| 283 | wideColSpan, |
| 284 | searchLogExtra, |
| 285 | }: FeedItemComponentProps): ReactElement | null { |
| 286 | const { logEvent } = useLogContext(); |
| 287 | const inViewRef = useLogImpression({ |
| 288 | item, |
| 289 | index, |
| 290 | columns, |
| 291 | column, |
| 292 | row, |
| 293 | feedName, |
| 294 | ranking, |
| 295 | highlightColSpan: wideColSpan, |
| 296 | searchLogExtra, |
| 297 | }); |
| 298 | |
| 299 | const { shouldUseListFeedLayout, shouldUseListMode } = useFeedLayout(); |
| 300 | const { boostedBy } = useFeedCardContext(); |
| 301 | |
| 302 | if (item.type === FeedItemType.Highlight) { |
| 303 | const HighlightTag = |
| 304 | shouldUseListFeedLayout || shouldUseListMode |
| 305 | ? HighlightList |
| 306 | : HighlightGrid; |
| 307 | const highlightIds = getHighlightIds(item.highlights); |
| 308 | |
| 309 | return ( |
| 310 | <HighlightTag |
| 311 | ref={inViewRef} |
| 312 | highlights={item.highlights} |
| 313 | onReadAllClick={() => { |
| 314 | logEvent( |
| 315 | feedHighlightsLogEvent(LogEvent.Click, { |
| 316 | columns: virtualizedNumCards, |
| 317 | column, |
| 318 | row, |
| 319 | feedName, |
nothing calls this directly
no test coverage detected