82 lines
3.9 KiB
TypeScript
82 lines
3.9 KiB
TypeScript
'use client';
|
|
|
|
import React from 'react';
|
|
import { DEFAULT_PAGE_SIZE } from '../../constants/common';
|
|
import {Languages, SearchData} from "../../types/tags";
|
|
import {BlogPost} from "../../types/blogPost";
|
|
import Link from "next/link";
|
|
import {CustomPagination} from "../view/CustomPagination";
|
|
|
|
type Props = {
|
|
searchData?: SearchData;
|
|
languages?: Languages;
|
|
basePath: string;
|
|
locale: string;
|
|
data: BlogPost[],
|
|
total: number,
|
|
pageSize: number
|
|
};
|
|
|
|
export const BlogPostsList = ({ basePath = '/', locale, pageSize = DEFAULT_PAGE_SIZE, data = [], total= 0 }: Props) => {
|
|
const currentPage = 1
|
|
const onChangePage = (page: number) => {
|
|
router.push(page === 1 ? basePath : basePath+'?page='+page);
|
|
};
|
|
|
|
return (
|
|
<div className="b-news__result-list">
|
|
<div className="b-inner">
|
|
<div className="news-list">
|
|
{data.map((item, i) => (
|
|
<li key={'blog'+i} className="list-sidebar__item">
|
|
<Link href={`/${locale}/blog/${item.slug}`} className="news-item">
|
|
<div className="news-item__image">
|
|
<img className="" src={item.listImage?.src} alt={item.listImage?.alt}/>
|
|
</div>
|
|
<div className="news-item__inner">
|
|
<div className="">
|
|
<div className="news-item__title">
|
|
{item.title}
|
|
</div>
|
|
<div className="news-item__badge">{item.category}</div>
|
|
<div className="news-item__text">
|
|
{item.excerpt}
|
|
</div>
|
|
</div>
|
|
<div className="news-item__info">
|
|
<Link href={`/${locale}/experts/${item.author?.expertId}`} className="news-item">
|
|
<div className="news-item__info__author">
|
|
<img className="" src={item.author.avatar.src} alt=""/>
|
|
<div className="news-item__info__author__inner">
|
|
<div className="news-item__info__name">{item.author.name}</div>
|
|
<div className="news-item__info__date">{item.createdAt}</div>
|
|
</div>
|
|
</div>
|
|
</Link>
|
|
<div className="news-item__info__counter">
|
|
<div className="news-item__info__like">
|
|
<img className="" src="/images/heart-outline.svg" alt=""/>
|
|
165
|
|
</div>
|
|
<div className="news-item__info__share">
|
|
<img className="" src="/images/share-social.svg" alt=""/>
|
|
Share
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</div>
|
|
{total > pageSize && (
|
|
<CustomPagination
|
|
total={total}
|
|
pageSize={pageSize}
|
|
onChange={onChangePage}
|
|
current={currentPage}
|
|
/>)}
|
|
</div>
|
|
</div>
|
|
)
|
|
} |