Merge pull request #88 from KieIO/feature/m4-get-blog-list

Feature/m4 get blog list

pages/blogs.tsx

@@ -1,14 +1,91 @@
+import commerce from '@lib/api/commerce';
+import { GetStaticPropsContext } from 'next';
 import { Layout } from 'src/components/common';
-import { BlogsList, FeaturedCardBlog, BlogHeading, BlogBreadCrumb } from 'src/components/modules/blogs';
+import { BlogCardProps } from 'src/components/common/CardBlog/CardBlog';
+import { BlogBreadCrumb, BlogHeading, BlogsList, FeaturedCardBlog } from 'src/components/modules/blogs';
+import { DEFAULT_BLOG_PAGE_SIZE } from "src/utils/constanst.utils";
+import { getAllPromies } from 'src/utils/funtion.utils';
+import { PromiseWithKey } from 'src/utils/types.utils';
 
-export default function BlogsPage() {
+interface Props {
+    blogs?: BlogCardProps[],
+    featuredBlog?: BlogCardProps[],
+    totalItems: number
+}
+export default function BlogsPage({ blogs, featuredBlog, totalItems }:Props) {
+ 
+    let date = new Date(featuredBlog?.[0]?.createdAt ?? '' );
+    let fullDate = date.toLocaleString('en-us', { month: 'long' }) + " " + date.getDate()+","+date.getFullYear();
+ 
     return(
         <>
             <BlogBreadCrumb />
             <BlogHeading />
-            <FeaturedCardBlog />
-            <BlogsList />
+            <FeaturedCardBlog 
+            title={featuredBlog?.[0]?.title} 
+            slug={featuredBlog?.[0]?.slug} 
+            imgSrc={featuredBlog?.[0]?.imageSrc ?? ''}
+            content={featuredBlog?.[0]?.description}
+            imgAuthor={featuredBlog?.[0]?.authorAvatarAsset}
+            authorName={featuredBlog?.[0]?.authorName}
+            date={fullDate}
+            />
+            <BlogsList blogList={blogs} total={totalItems} idFeatured={featuredBlog?.[0]?.id} />
         </>
     )
 }
-BlogsPage.Layout = Layout
+
+
+export async function getStaticProps({
+  preview,
+  locale,
+  locales,
+}: GetStaticPropsContext) {
+  const config = { locale, locales }
+  let promisesWithKey = [] as PromiseWithKey[]
+  let props = {} as any;
+
+  const {featuredBlogs} = await commerce.getFeaturedBlog({
+    variables: {
+      take: 1
+    },
+    config,
+    preview,
+  })
+  
+ // Blogs
+  const idFeaturedBlog = featuredBlogs?.[0]?.id;
+  const blogsPromise = commerce.getAllBlogs({
+    variables: {
+      excludeBlogIds: [idFeaturedBlog],
+      take: DEFAULT_BLOG_PAGE_SIZE
+    },
+    config,
+    preview,
+  })
+  promisesWithKey.push({ key: 'blogsResult', promise: blogsPromise })
+
+
+  try {
+    const promises = getAllPromies(promisesWithKey)
+    const rs = await Promise.all(promises)
+
+    promisesWithKey.map((item, index) => {
+      props[item.key] = item.keyResult ? rs[index][item.keyResult] : rs[index]
+      return null
+    })
+
+    props.featuredBlog = featuredBlogs;
+    
+    console.log(props)
+    return {
+      props,
+      revalidate: 60
+    }
+  } catch (err) {
+
+  }
+}
+
+
+BlogsPage.Layout = Layout

pages/index.tsx

@@ -12,6 +12,7 @@ import { CODE_FACET_DISCOUNT, CODE_FACET_FEATURED,COLLECTION_SLUG_SPICE } from '
 import { getAllFacetValueIdsByParentCode, getAllFacetValuesForFeatuedProducts, getAllPromies, getFreshFacetId } from 'src/utils/funtion.utils';
 import { PromiseWithKey } from 'src/utils/types.utils';
 
+
 interface Props {
   featuredAndDiscountFacetsValue: FacetValue[],
   freshProducts: ProductCard[],
@@ -63,7 +64,7 @@ export async function getStaticProps({
   
 
   props.featuredAndDiscountFacetsValue = getAllFacetValuesForFeatuedProducts(facets)
-  
+
   // fresh products
   const freshProductvariables: ProductVariables = {}
   const freshFacetId = getFreshFacetId(facets)