This commit is contained in:
dzfelix 2024-08-26 23:29:30 +04:00
parent dbb74b9ccd
commit 77d3c8f66b
3 changed files with 34 additions and 56 deletions

View File

@ -1,71 +1,40 @@
import React from 'react'; import React from 'react';
import { useTranslations } from 'next-intl'; import { useTranslations } from 'next-intl';
import { unstable_setRequestLocale } from 'next-intl/server'; import {getTranslations, unstable_setRequestLocale} from 'next-intl/server';
import { i18nText } from '../../../../i18nKeys'; import { i18nText } from '../../../../i18nKeys';
import {fetchBlogPosts} from "../../../../lib/contentful/blogPosts";
import Link from "next/link";
export default function News({ params: { locale } }: { params: { locale: string }}) { export default async function News({params: {locale}}: { params: { locale: string } }) {
unstable_setRequestLocale(locale); unstable_setRequestLocale(locale);
const t = useTranslations('Main'); const t = await getTranslations('Main');
const {data, total} = await fetchBlogPosts({preview: false, sticky: true})
return ( return (
<div className="main-articles"> <div className="main-articles">
<div className="b-inner"> <div className="b-inner">
<h2 className="title-h2">{t('news')}</h2> <h2 className="title-h2">{t('news')}</h2>
<div className="row"> <div className="row">
<div className="col-lg-4 col-md-6 col-sm-6"> {data.map((item, i) => (
<div className="col-lg-4 col-md-6 col-sm-6" key={'news' + i}>
<div className="b-article"> <div className="b-article">
<div className="b-article__image"> <div className="b-article__image">
<img className="" src="/images/article.png" alt=""/> <img className="" src={item.listImage?.src} alt={item.listImage?.alt}/>
</div> </div>
<div className="b-article__inner"> <div className="b-article__inner">
<div className="b-article__title">News Headline</div> <div className="b-article__title">{item.title}</div>
<div className="b-article__text"> <div className="b-article__text">
The program not only focuses on a financial perspective, but allows you to study {item.excerpt}
performance from many angles, such as human resources management, IT, operations
management, risks etc.
</div> </div>
<a href="#" className="b-article__link">{i18nText('readMore', locale)} <Link href={`/${locale}/blog/${item.slug}`} className="b-article__link">
{i18nText('readMore', locale)}
<img className="" src="/images/chevron-forward.svg" alt=""/> <img className="" src="/images/chevron-forward.svg" alt=""/>
</a> </Link>
</div>
</div>
</div>
<div className="col-lg-4 d-none d-lg-block">
<div className="b-article">
<div className="b-article__image">
<img className="" src="/images/article.png" alt=""/>
</div>
<div className="b-article__inner">
<div className="b-article__title">News Headline</div>
<div className="b-article__text">
The program not only focuses on a financial perspective, but allows you to study
performance from many angles, such as human resources management, IT, operations
management, risks etc.
</div>
<a href="#" className="b-article__link">{i18nText('readMore', locale)}
<img className="" src="/images/chevron-forward.svg" alt=""/>
</a>
</div>
</div>
</div>
<div className="col-lg-4 d-none d-lg-block">
<div className="b-article">
<div className="b-article__image">
<img className="" src="/images/article.png" alt=""/>
</div>
<div className="b-article__inner">
<div className="b-article__title">News Headline</div>
<div className="b-article__text">
The program not only focuses on a financial perspective, but allows you to study
performance from many angles, such as human resources management, IT, operations
management, risks etc.
</div>
<a href="#" className="b-article__link">{i18nText('readMore', locale)}
<img className="" src="/images/chevron-forward.svg" alt=""/>
</a>
</div> </div>
</div> </div>
</div> </div>
))}
</div> </div>
</div> </div>
</div> </div>

View File

@ -22,7 +22,8 @@ export async function generateMetadata({ params }: BlogPostPageProps, parent: Re
} }
return { return {
title: blogPost.title title: blogPost.title,
// description: blogPost.metaDescription
} }
} }

View File

@ -68,8 +68,9 @@ interface FetchBlogPostsOptions {
local?: string local?: string
category?: string category?: string
page?: number page?: number
sticky?: boolean
} }
export async function fetchBlogPosts({ preview, category, page }: FetchBlogPostsOptions): Promise<{ export async function fetchBlogPosts({ preview, category, page, sticky }: FetchBlogPostsOptions): Promise<{
total: number; total: number;
data: BlogPost[] data: BlogPost[]
}> { }> {
@ -84,11 +85,18 @@ export async function fetchBlogPosts({ preview, category, page }: FetchBlogPosts
query['fields.category.sys.contentType.sys.id']='blogPostCategory' query['fields.category.sys.contentType.sys.id']='blogPostCategory'
} }
if(page){ if(page){
query['limit'] = pageSize query['limit'] = pageSize
query['skip'] = pageSize * (page - 1) query['skip'] = pageSize * (page - 1)
} }
if (sticky){ // только три для главной
query['fields.sticky'] = 1
query['limit'] = 3
query['skip'] = 0
}
const blogPostsResult = await contentful.getEntries<BlogPostSkeleton>(query) const blogPostsResult = await contentful.getEntries<BlogPostSkeleton>(query)
const data = blogPostsResult.items.map((blogPostEntry) => parseContentfulBlogPost(blogPostEntry) as BlogPost) const data = blogPostsResult.items.map((blogPostEntry) => parseContentfulBlogPost(blogPostEntry) as BlogPost)