From ec73efce96676eafe0d4e202cd274501af21d2e1 Mon Sep 17 00:00:00 2001
From: jinhojang6 <jinho5051@gmail.com>
Date: Sat, 13 Jun 2020 01:51:20 +0900
Subject: [PATCH] Add authors for nimbus

---
 public/static/css/main.scss      | 21 +++++++++++++++++----
 src/Actions/HomeActions/index.ts | 16 +++++++++++++---
 src/Components/Blogs/Nimbus.tsx  |  5 +++--
 3 files changed, 33 insertions(+), 9 deletions(-)

diff --git a/public/static/css/main.scss b/public/static/css/main.scss
index 450084b..4a13c9d 100644
--- a/public/static/css/main.scss
+++ b/public/static/css/main.scss
@@ -78,10 +78,6 @@ li {
                     background-position: center;
                 }
             }
-            .author{
-                color: grey;
-                font-size: 1rem;
-            }
             h4{
                 margin: 15px 0;
             }
@@ -95,6 +91,23 @@ li {
     }
 }
 
+.author{
+    font-size: 1rem;
+    margin-bottom: 10px;
+}
+
+.author-name{
+    display: inline-block;
+    background: #e7e7e7;
+    padding: 2px 6px;
+    border-radius: 5px;
+}
+
+.description{
+    color: grey;
+    font-size: 1rem;
+}
+
 .post-title {
     margin: 10px 0;
     color: black !important;
diff --git a/src/Actions/HomeActions/index.ts b/src/Actions/HomeActions/index.ts
index 3bcb8ff..ef1edf4 100644
--- a/src/Actions/HomeActions/index.ts
+++ b/src/Actions/HomeActions/index.ts
@@ -19,7 +19,7 @@ const CORS_PROXY = "https://cors-fix.status.im/";
 const embarkBlog = "https://blog.embarklabs.io/atom.xml";
 const embarkOldBlog = "https://framework.embarklabs.io/atom.xml";
 
-const nimbusBlog = "https://our.status.im/ghost/api/v2/content/posts/?key=10e7f8c1f793d2945ea1177076&filter=tag:nim";
+const nimbusBlog = "https://our.status.im/ghost/api/v2/content/posts/?key=10e7f8c1f793d2945ea1177076&filter=tag:nim&limit=all&include=authors";
 
 let embarkData: any = '';
 let parsedEmbarkData:any = [];
@@ -27,6 +27,15 @@ let parsedEmbarkData:any = [];
 let nimbusData: any = '';
 let parsedNimbusData:any = [];
 
+interface NimbusBlog {
+    title: string; 
+    published_at: string; 
+    primary_author: any; 
+    excerpt: string; 
+    feature_image: string; 
+    url: string;
+}
+
 export const FetchEmbark = async () => {
     await fetch(`${CORS_PROXY}`+ `${embarkBlog}`)
     .then(response => response.text())
@@ -82,16 +91,17 @@ export const FetchNimbus = async () => {
     .then(response => response.json())
     .then(data => {
         nimbusData = data.posts
-        nimbusData.forEach((entry: { title: string; published_at: string; excerpt: string; feature_image: string; url: string; }) => {
+        nimbusData.forEach((entry: NimbusBlog) => {
             const postData: any = {}
             postData.title = entry.title;
             postData.published_at = entry.published_at;
             postData.excerpt = entry.excerpt;
+            postData.author = entry.primary_author.name;
             postData.feature_image = entry.feature_image;
             postData.url = entry.url;
             parsedNimbusData.push(postData);
         })
-    });
+    })
 }
 
 export const HomeActions = {
diff --git a/src/Components/Blogs/Nimbus.tsx b/src/Components/Blogs/Nimbus.tsx
index 2e83016..3b76db0 100644
--- a/src/Components/Blogs/Nimbus.tsx
+++ b/src/Components/Blogs/Nimbus.tsx
@@ -23,12 +23,13 @@ const Nimbus = () => {
                     <div className="row">
                         <div className="col-md-12">
                             <ul>
-                                {nimbusData.map((data: { url: string ; title: string; published_at: string; excerpt: string; }, i: any) => (
+                                {nimbusData.map((data: { url: string ; title: string; published_at: string; excerpt: string; author: string;}, i: any) => (
                                     <li key={i}>
                                         <div className="post">
                                             <div className="meta"><time>{data.published_at.substring(0,10)}</time> / <a href="https://nimbus.team/">Nimbus</a></div>
                                             <h4 ><a className="post-title" href={data.url}>{data.title}</a></h4>
-                                            <div className="author" style={{ paddingRight: '10px' }}>{reduceExcerpt(data.excerpt)}</div>
+                                            <div className="author" style={{ paddingRight: '10px' }}>By <div className="author-name">{data.author}</div></div>
+                                            <div className="description" style={{ paddingRight: '10px' }}>{reduceExcerpt(data.excerpt)}</div>
                                         </div>                                    
                                     </li>
                                 ))}