function BlogListPageContent()

in src/theme/BlogListPage/index.tsx [62:98]


function BlogListPageContent(props: Props): JSX.Element {
  const { metadata, items } = props;
  const { viewType, toggleViewType } = useViewType();
  const isCardView = viewType === "card";
  const isListView = viewType === "list";
  return (
    <BlogLayout>
      <BlogHeaderContent />
      {/* switch list and card */}
      <div className="bloghome__swith-view">
        <CardFilter
          onClick={() => toggleViewType("card")}
          className={viewType === "card" ? "bloghome__switch--selected" : "bloghome__switch"}
        />
        <ListFilter
          onClick={() => toggleViewType("list")}
          className={viewType === "list" ? "bloghome__switch--selected" : "bloghome__switch"}
        />
      </div>
      <div className="bloghome__posts">
        {isCardView && (
          <div className="bloghome__posts-card">
            <BlogPostItems items={items} />
          </div>
        )}

        {isListView && (
            <BlogPostLisView items={items} />
        )}
        <BlogListPaginator metadata={metadata} />
      </div>



    </BlogLayout>
  );
}