Function BlogPostItem

src/theme/BlogPostItem/index.tsx:17–52

({
  children,
  className,
}: Props)

}

export default function BlogPostItem({
  children,
  className,
}: Props): JSX.Element {
  const containerClassName = useContainerClassName();
  const {
    isBlogPostPage,
    metadata: { authors, tags },
  } = useBlogPost();

  const authorNames = authors
    ? authors.map((author) => author.name).join(", ")
    : undefined;

  const tagNames = tags ? tags.map((tag) => tag.label).join(", ") : undefined;

  React.useEffect(() => {
    const pageViewData = {
      event: "Initialize_dataLayer",
      document_type: "Blog",
      document_title: document.title,
      article_author: authorNames,
      tags: tagNames,
    };
    if (isBlogPostPage) {
      pushGtmEvent(pageViewData);
    }
  }, [isBlogPostPage]);
  return (
    <BlogPostItemContainer className={clsx(containerClassName, className)}>
      <BlogPostItemHeader />
      <BlogPostItemContent>{children}</BlogPostItemContent>
      <BlogPostItemFooter />
    </BlogPostItemContainer>
  );
}