enhancement: update Open Collective API (#8592)

jestjs · Jun 22, 2019 · f505454 · f505454
1 parent 9f9fb7d
commit f505454
Show file tree

Hide file tree

Showing 2 changed files with 68 additions and 54 deletions.
diff --git a/website/fetchSupporters.js b/website/fetchSupporters.js
@@ -6,19 +6,22 @@ const fs = require('fs');
 const request = require('request');
 const path = require('path');
 
-const REQUIRED_KEYS = ['id'];
+const REQUIRED_KEYS = ['fromAccount', 'tier', 'totalDonations'];
 
 request(
-  'https://opencollective.com/api/groups/jest/backers',
+  'https://rest.opencollective.com/v2/jest/orders/incoming/active?limit=1000',
   (err, response, body) => {
     if (err) console.error('Failed to fetch backers: ', err);
 
     // Basic validation
-    const content = JSON.parse(body);
+    const result = JSON.parse(body);
+    if (!result || !Array.isArray(result.nodes)) {
+      throw new Error('backer info is not an array');
+    }
 
-    if (!Array.isArray(content)) throw new Error('backer info is not an array');
+    const backers = result.nodes;
 
-    for (const item of content) {
+    for (const item of backers) {
       for (const key of REQUIRED_KEYS) {
         if (!item || typeof item !== 'object')
           throw new Error(
@@ -31,10 +34,14 @@ request(
       }
     }
 
-    fs.writeFile(path.resolve(__dirname, 'backers.json'), body, err => {
-      if (err) {
-        console.error('Failed to write backers file: ', err);
-      } else console.log('Fetched 1 file: backers.json');
-    });
+    fs.writeFile(
+      path.resolve(__dirname, 'backers.json'),
+      JSON.stringify(backers),
+      err => {
+        if (err) {
+          console.error('Failed to write backers file: ', err);
+        } else console.log('Fetched 1 file: backers.json');
+      }
+    );
   }
 );
diff --git a/website/pages/en/index.js b/website/pages/en/index.js
@@ -36,6 +36,48 @@ Button.defaultProps = {
   target: '_self',
 };
 
+const Sponsor = ({
+  fromAccount: {name, slug, website, imageUrl},
+  totalDonations,
+}) => (
+  <a
+    key={slug}
+    className="sponsor-item"
+    title={`$${totalDonations.value} by ${name || slug}`}
+    target="_blank"
+    href={website || `https://opencollective.com/${slug}`}
+  >
+    {
+      <img
+        className="sponsor-avatar"
+        src={imageUrl}
+        alt={name || slug ? `${name || slug}'s avatar` : 'avatar'}
+      />
+    }
+  </a>
+);
+
+const Backer = ({
+  fromAccount: {name, slug, website, imageUrl},
+  totalDonations,
+}) => (
+  <a
+    key={slug}
+    className="backer-item"
+    title={`$${totalDonations.value} by ${name || slug}`}
+    target="_blank"
+    href={website || `https://opencollective.com/${slug}`}
+  >
+    {
+      <img
+        className="backer-avatar"
+        src={imageUrl}
+        alt={name || slug ? `${name || slug}'s avatar` : 'avatar'}
+      />
+    }
+  </a>
+);
+
 class Contributors extends React.Component {
   render() {
     return (
@@ -50,28 +92,8 @@ class Contributors extends React.Component {
         </p>
         <div>
           {backers
-            .filter(b => b.tier === 'sponsor')
-            .map(b => (
-              <a
-                key={b.id}
-                className="sponsor-item"
-                title={`$${b.totalDonations / 100} by ${b.name || b.slug}`}
-                target="_blank"
-                href={b.website || `https://opencollective.com/${b.slug}`}
-              >
-                {
-                  <img
-                    className="sponsor-avatar"
-                    src={b.avatar + '&width=96'}
-                    alt={
-                      b.name || b.slug
-                        ? `${b.name || b.slug}'s avatar`
-                        : 'avatar'
-                    }
-                  />
-                }
-              </a>
-            ))}
+            .filter(b => b.tier && b.tier.slug === 'sponsor')
+            .map(Sponsor)}
         </div>
         <h3>
           <translate>Backers</translate>
@@ -83,28 +105,13 @@ class Contributors extends React.Component {
         </p>
         <div>
           {backers
-            .filter(b => b.tier === 'backer' && !b.slug.includes('adult'))
-            .map(b => (
-              <a
-                key={b.id}
-                className="backer-item"
-                title={`$${b.totalDonations / 100} by ${b.name || b.slug}`}
-                target="_blank"
-                href={b.website || `https://opencollective.com/${b.slug}`}
-              >
-                {
-                  <img
-                    className="backer-avatar"
-                    src={b.avatar + '&width=96'}
-                    alt={
-                      b.name || b.slug
-                        ? `${b.name || b.slug}'s avatar`
-                        : 'avatar'
-                    }
-                  />
-                }
-              </a>
-            ))}
+            .filter(
+              b =>
+                b.tier &&
+                b.tier.slug === 'backer' &&
+                !b.fromAccount.slug.includes('adult')
+            )
+            .map(Backer)}
         </div>
       </div>
     );