From 14b3a8151a79765e537d2881331302c5c0aad9f3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Souchet=20C=C3=A9line?= <celine.souchet@bonitasoft.com>
Date: Fri, 19 Nov 2021 18:13:48 +0100
Subject: [PATCH 1/3] Add 'More' button in the 'News' section of the 'Home'
 page

---
 src/theme/sections/News.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/theme/sections/News.tsx b/src/theme/sections/News.tsx
index 1240c1c11..13575d676 100644
--- a/src/theme/sections/News.tsx
+++ b/src/theme/sections/News.tsx
@@ -26,7 +26,7 @@ const News = (): JSX.Element => {
   return (
     <Section.Container id={SECTION.news} Background={Background}>
       <Section.Header name={SECTION.news} />
-      <PostContainer posts={news} />
+      <PostContainer posts={news} pageId="news" />
     </Section.Container>
   );
 };

From 58c2191272404095227a83571a526d415d5c879d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Souchet=20C=C3=A9line?= <celine.souchet@bonitasoft.com>
Date: Fri, 19 Nov 2021 18:24:48 +0100
Subject: [PATCH 2/3] Create a template for the sections with Posts

---
 src/pages/index.tsx                     |  2 +-
 src/theme/sections/Blog.tsx             | 13 +++++----
 src/theme/sections/News.tsx             | 23 +++++++--------
 src/theme/sections/SectionWithPosts.tsx | 39 +++++++++++++++++++++++++
 4 files changed, 57 insertions(+), 20 deletions(-)
 create mode 100644 src/theme/sections/SectionWithPosts.tsx

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index a98265f6d..e1c0b930e 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -21,7 +21,7 @@ import About from '../theme/sections/About';
 import Libraries from '../theme/sections/Libraries';
 import { Blog } from '../theme/sections/Blog';
 import Footer from '../theme/components/Footer';
-import News from '../theme/sections/News';
+import { News } from '../theme/sections/News';
 import { PAGE } from '../theme/utils/constants';
 
 const HomePage = (): JSX.Element => (
diff --git a/src/theme/sections/Blog.tsx b/src/theme/sections/Blog.tsx
index 63365107e..4e2f26332 100644
--- a/src/theme/sections/Blog.tsx
+++ b/src/theme/sections/Blog.tsx
@@ -14,17 +14,18 @@
  * limitations under the License.
  */
 import React from 'react';
-import Section from '../components/Section';
 import Triangle from '../components/Triangle';
 import { SECTION } from '../utils/constants';
 import { postsContent } from '../../content/PostsContent';
-import { PostContainer } from '../components/Post';
+import { SectionWithPosts } from './SectionWithPosts';
 
 const Blog = (): JSX.Element => (
-  <Section.Container id={SECTION.blog} Background={Background}>
-    <Section.Header name={SECTION.blog} />
-    <PostContainer posts={postsContent.posts} pageId="blog" />
-  </Section.Container>
+  <SectionWithPosts
+    containerTitle={SECTION.blog}
+    Background={Background}
+    posts={postsContent.posts}
+    pageId="blog"
+  />
 );
 
 const Background = (): JSX.Element => (
diff --git a/src/theme/sections/News.tsx b/src/theme/sections/News.tsx
index 13575d676..8b258f67a 100644
--- a/src/theme/sections/News.tsx
+++ b/src/theme/sections/News.tsx
@@ -14,22 +14,19 @@
  * limitations under the License.
  */
 import React from 'react';
-import Section from '../components/Section';
 import Triangle from '../components/Triangle';
-import { PostContainer } from '../components/Post';
 import { SECTION } from '../utils/constants';
 import { newsContent } from '../../content/NewsContent';
+import { SectionWithPosts } from './SectionWithPosts';
 
-const News = (): JSX.Element => {
-  const { news } = newsContent;
-
-  return (
-    <Section.Container id={SECTION.news} Background={Background}>
-      <Section.Header name={SECTION.news} />
-      <PostContainer posts={news} pageId="news" />
-    </Section.Container>
-  );
-};
+const News = (): JSX.Element => (
+  <SectionWithPosts
+    containerTitle={SECTION.news}
+    Background={Background}
+    posts={newsContent.news}
+    pageId="news"
+  />
+);
 
 const Background = (): JSX.Element => (
   <>
@@ -62,4 +59,4 @@ const Background = (): JSX.Element => (
   </>
 );
 
-export default News;
+export { News };
diff --git a/src/theme/sections/SectionWithPosts.tsx b/src/theme/sections/SectionWithPosts.tsx
new file mode 100644
index 000000000..88fd6bf34
--- /dev/null
+++ b/src/theme/sections/SectionWithPosts.tsx
@@ -0,0 +1,39 @@
+/**
+ * Copyright 2021 Bonitasoft S.A.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import React from 'react';
+import Section from '../components/Section';
+import { SECTION } from '../utils/constants';
+import { PostContainer } from '../components/Post';
+import { PostDescription } from '../types';
+
+interface SectionWithPostsProps {
+  containerTitle: SECTION;
+  Background?: () => JSX.Element;
+  posts: PostDescription[];
+  pageId: string;
+}
+
+export const SectionWithPosts = ({
+  containerTitle,
+  Background,
+  posts,
+  pageId,
+}: SectionWithPostsProps): JSX.Element => (
+  <Section.Container id={containerTitle} Background={Background}>
+    <Section.Header name={containerTitle} />
+    <PostContainer posts={posts} pageId={pageId} />
+  </Section.Container>
+);

From 266d2b138507cad2ad9c298a9e641dc6e393252f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Souchet=20C=C3=A9line?= <celine.souchet@bonitasoft.com>
Date: Mon, 22 Nov 2021 16:28:49 +0100
Subject: [PATCH 3/3] Don't display the button if the post list has less than 7
 items

---
 src/theme/components/Post.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/theme/components/Post.tsx b/src/theme/components/Post.tsx
index 3ad3c5748..cb3c4485b 100644
--- a/src/theme/components/Post.tsx
+++ b/src/theme/components/Post.tsx
@@ -93,7 +93,7 @@ export const PostContainer = ({
           ))}
         </DownFade>
       </CardContainer>
-      {pageId && (
+      {pageId && posts.length > 6 && (
         <DownFade>
           <Flex justifyContent="center" mt="4" mb="2" fontSize={[2, 3]}>
             <Card