bug: fix show featured blogs

This commit is contained in:
Quangnhankie
2021-10-20 10:56:34 +07:00
parent 7ea734d0ad
commit 5b5aeec0d2
4 changed files with 31 additions and 12 deletions

View File

@@ -6,7 +6,8 @@ import { getAllBlogsQuery } from '../../utils/queries/get-all-blog-query'
export type BlogVariables = { export type BlogVariables = {
excludeBlogIds?: string[], excludeBlogIds?: string[],
take?: number, take?: number,
skip?:number skip?:number,
isFeatured?:{eq?:Boolean},
} }
export default function getAllBlogsOperation({ export default function getAllBlogsOperation({
@@ -35,6 +36,9 @@ export default function getAllBlogsOperation({
options: { options: {
take: vars.take, take: vars.take,
skip: vars.skip, skip: vars.skip,
filter: {
isFeatured: vars.isFeatured
}
}, },
} }
const { data } = await config.fetch<GetAllBlogsQuery>(query, { const { data } = await config.fetch<GetAllBlogsQuery>(query, {

View File

@@ -10,9 +10,9 @@ import { BlogCardProps } from 'src/components/common/CardBlog/CardBlog';
import { REVALIDATE_TIME } from 'src/utils/constanst.utils' import { REVALIDATE_TIME } from 'src/utils/constanst.utils'
interface Props { interface Props {
blog:{blogDetail?: BlogCardProps}, blog:{blogDetail?: BlogCardProps},
relevantBlogs:{blogDetail?:BlogCardProps[]} relevant:{relevantBlogs?:BlogCardProps[]}
} }
export default function BlogDetailPage({blog,relevantBlogs}:Props) { export default function BlogDetailPage({blog,relevant}:Props) {
let date = new Date(blog?.blogDetail?.createdAt ?? '' ); let date = new Date(blog?.blogDetail?.createdAt ?? '' );
let fullDate = date.toLocaleString('en-us', { month: 'long' }) + " " + date.getDate()+","+date.getFullYear(); let fullDate = date.toLocaleString('en-us', { month: 'long' }) + " " + date.getDate()+","+date.getFullYear();
@@ -27,7 +27,7 @@ export default function BlogDetailPage({blog,relevantBlogs}:Props) {
authorName={blog?.blogDetail?.authorName} authorName={blog?.blogDetail?.authorName}
date={fullDate} date={fullDate}
/> />
{relevantBlogs.relevantBlogs?.length> 0 && <RelevantBlogPosts data={relevantBlogs.relevantBlogs} title="You will like also" bgcolor="cream"/>} {relevant.relevantBlogs?.length> 0 && <RelevantBlogPosts data={relevant.relevantBlogs} title="You will like also" bgcolor="cream"/>}
</> </>
) )
} }
@@ -64,7 +64,7 @@ export async function getStaticProps({
config, config,
preview, preview,
}) })
promisesWithKey.push({ key: 'relevantBlogs', promise: relevantBlogs}) promisesWithKey.push({ key: 'relevant', promise: relevantBlogs})
}else { }else {
props.relevantBlogs = []; props.relevantBlogs = [];

View File

@@ -46,7 +46,12 @@ export async function getStaticProps({
const {featuredBlogs} = await commerce.getFeaturedBlog({ const {featuredBlogs} = await commerce.getFeaturedBlog({
variables: { variables: {
take: DEFAULT_BLOG_PAGE_SIZE take: DEFAULT_BLOG_PAGE_SIZE,
filter: {
isFeatured: {
eq:true
}
}
}, },
config, config,
preview, preview,
@@ -57,7 +62,12 @@ export async function getStaticProps({
const blogsPromise = commerce.getAllBlogs({ const blogsPromise = commerce.getAllBlogs({
variables: { variables: {
excludeBlogIds: [idFeaturedBlog], excludeBlogIds: [idFeaturedBlog],
take: DEFAULT_BLOG_PAGE_SIZE take: DEFAULT_BLOG_PAGE_SIZE,
filter: {
isFeatured: {
eq:false
}
}
}, },
config, config,
preview, preview,

View File

@@ -22,7 +22,12 @@ const BlogsList = ({ blogList,total,idFeatured }:BlogsListProps) => {
const DEFAULT_BLOGS_ARGS = { const DEFAULT_BLOGS_ARGS = {
excludeBlogIds: [idFeatured], excludeBlogIds: [idFeatured],
options:{ options:{
skip: 1, take: DEFAULT_BLOG_PAGE_SIZE take: DEFAULT_BLOG_PAGE_SIZE,
filter: {
isFeatured: {
eq:false
}
}
} }
} }
@@ -34,6 +39,7 @@ const BlogsList = ({ blogList,total,idFeatured }:BlogsListProps) => {
const onPageChange = (page:number) => { const onPageChange = (page:number) => {
router.push({ router.push({
pathname: ROUTE.BLOGS, pathname: ROUTE.BLOGS,
@@ -65,7 +71,6 @@ const BlogsList = ({ blogList,total,idFeatured }:BlogsListProps) => {
data = blogs data = blogs
} }
return ( return (
<section> <section>
<div className={s.wrapper}> <div className={s.wrapper}>
@@ -73,10 +78,10 @@ const BlogsList = ({ blogList,total,idFeatured }:BlogsListProps) => {
<div className={s.list}> <div className={s.list}>
{ {
data?.map((product,index)=> { data?.map((blog,index)=> {
return( return(
<div className={s.card} key={`${product.title}-${index}`}> <div className={s.card} key={`${blog.title}-${index}`}>
{product.isPublish && <CardBlog {...product} /> } {blog.isPublish && !blog.isFeatured && <CardBlog {...blog} /> }
</div> </div>
) )
}) })