import React, { Fragment } from 'react';
import Paragraph from './blog-micro-components/Paragraph';
import H1 from './blog-micro-components/H1';
import Image from './blog-micro-components/Image';
import ArticleAuthorSection from './ArticleAuthorSection';

const BlogHeadingSection = ({ data }) => {
  return (
    <Fragment>
      <ArticleAuthorSection
        data={{
          Author: data.Author,
          AuthorTitle: data.AuthorTitle,
          AuthorImage: data.AuthorImage,
        }}
      />
      <H1 data={data.ArticleTitle} />
      <Paragraph data={data.ArticleDescription} />
      <Image data={data.ArticleImage} />
    </Fragment>
  );
};

export default BlogHeadingSection;