using async/await to implement getInitialProps

pages/index.js

@@ -5,41 +5,40 @@ import Information from '../components/Information.js'
 import {loadFirebase} from '../lib/db.js'
 
 export default class Index extends React.Component {
-  static getInitialProps = () =>
-    loadFirebase().firestore().collection('agencies')
+  static getInitialProps = async () => {
+    const snapshot = await loadFirebase().firestore().collection('agencies')
       .limit(10)
       .get()
-      .then(snapshot => {
-        let data = []
-        snapshot.forEach((doc) => {
-          data.push({
-            id: doc.id,
-            ...doc.data()
-          })            
-        })
-        return { agencies: data }
+    let data = []
+    snapshot.forEach((doc) => {
+      data.push({
+        id: doc.id,
+        ...doc.data()
       })
+    })
+    return { agencies: data }
+  }
   render() {
     const agencies = this.props.agencies
     return <Layout>
       <Hero/>
       <div id="agencies">
         <h2>Most trusted agencies in Stockholm</h2>
-        <p>We the brand asked for offers for our 
-          Sample Real Project and had an extra round of 
-          design fixes - that's our way of ranking these 
+        <p>We the brand asked for offers for our
+          Sample Real Project and had an extra round of
+          design fixes - that's our way of ranking these
           agencies.</p>
-        {(agencies && agencies.length > 0) 
+        {(agencies && agencies.length > 0)
           ? <ul>
-            {agencies.map(agency => 
+            {agencies.map(agency =>
               <li key="{agency.id}">
-            <h3>{agency.name} has a ranking of 
+                <h3>{agency.name} has a ranking of
             <em>{agency.ranking}!</em></h3></li>)}
-          </ul> 
+          </ul>
           : <p><strong>Have nothing!!</strong></p>}
-          <hr/>
+        <hr/>
       </div>
-      <Information/> 
+      <Information/>
     </Layout>
   }
 }