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>
);
}