Filter and categorize sponsors/backers (#4596)

docs/_data/blocklist.json

@@ -10,7 +10,6 @@
   "mochajs",
   "my-true-media",
   "open-apk-file",
-  "pfannen-test",
   "thetoy",
   "trust-my-paper",
   "writemypaper4me",

docs/_data/supporters.js

@@ -1,15 +1,15 @@
 #!/usr/bin/env node
 
 /**
- * This script gathers metadata for supporters of Mocha from OpenCollective's API by
- * aggregating order ("donation") information.
+ * This script gathers metadata for active supporters of Mocha from OpenCollective's
+ * API by aggregating order ("donation") information.
  *
- * It's intended to be used with 11ty, but can be run directly.  Running directly
+ * It's intended to be used with 11ty, but can be run directly. Running directly
  * enables debug output.
  *
  * - gathers logo/avatar images (they are always pngs)
  * - gathers links
- * - sorts by total contributions and tier
+ * - sorts by tier and total contributions
  * - validates images
  * - writes images to a temp dir
  * @see https://docs.opencollective.com/help/contributing/development/api
@@ -28,7 +28,7 @@ const blocklist = new Set(require('./blocklist.json'));
  * In addition to the blocklist, any account slug matching this regex will not
  * be displayed on the website.
  */
-const BLOCKED_STRINGS = /(?:vpn|[ck]a[sz]ino|seo|slots|gambl(?:e|ing)|crypto)/i;
+const BLOCKED_STRINGS = /(?:[ck]a[sz]ino|seo|slots|gambl(?:e|ing)|crypto)/i;
 
 /**
  * Add a few Categories exposed by Open Collective to help moderation
@@ -48,8 +48,8 @@ const BLOCKED_CATEGORIES = [
  */
 const API_ENDPOINT = 'https://api.opencollective.com/graphql/v2';
 
-const SPONSOR_TIER = 'sponsor';
-const BACKER_TIER = 'backer';
+const SPONSOR_TIER = 'sponsors';
+const BACKER_TIER = 'backers';
 
 // if this percent of fetches completes, the build will pass
 const PRODUCTION_SUCCESS_THRESHOLD = 0.8;
@@ -58,7 +58,7 @@ const SUPPORTER_IMAGE_PATH = resolve(__dirname, '../images/supporters');
 
 const SUPPORTER_QUERY = `query account($limit: Int, $offset: Int, $slug: String) {
   account(slug: $slug) {
-    orders(limit: $limit, offset: $offset) {
+    orders(limit: $limit, offset: $offset, status: ACTIVE, filter: INCOMING) {
       limit
       offset
       totalCount
@@ -73,9 +73,8 @@ const SUPPORTER_QUERY = `query account($limit: Int, $offset: Int, $slug: String)
           type
           categories
         }
-        totalDonations {
-          value
-        }
+        tier { slug }
+        totalDonations { value }
         createdAt
       }
     }
@@ -93,10 +92,11 @@ const nodeToSupporter = node => ({
   website: node.fromAccount.website,
   imgUrlMed: node.fromAccount.imgUrlMed,
   imgUrlSmall: node.fromAccount.imgUrlSmall,
-  firstDonation: node.createdAt,
-  totalDonations: node.totalDonations.value * 100,
   type: node.fromAccount.type,
-  categories: node.fromAccount.categories
+  categories: node.fromAccount.categories,
+  tier: (node.tier && node.tier.slug) || BACKER_TIER,
+  totalDonations: node.totalDonations.value * 100,
+  firstDonation: node.createdAt
 });
 
 const fetchImage = process.env.MOCHA_DOCS_SKIP_IMAGE_DOWNLOAD
@@ -198,14 +198,13 @@ const getSupporters = async () => {
     // determine which url to use depending on tier
     .reduce(
       (supporters, supporter) => {
-        if (supporter.type === 'INDIVIDUAL') {
+        if (supporter.tier === BACKER_TIER) {
           if (supporter.name !== 'anonymous') {
             supporters[BACKER_TIER] = [
               ...supporters[BACKER_TIER],
               {
                 ...supporter,
-                avatar: encodeURI(supporter.imgUrlSmall),
-                tier: BACKER_TIER
+                avatar: encodeURI(supporter.imgUrlSmall)
               }
             ];
           }
@@ -214,8 +213,7 @@ const getSupporters = async () => {
             ...supporters[SPONSOR_TIER],
             {
               ...supporter,
-              avatar: encodeURI(supporter.imgUrlMed),
-              tier: SPONSOR_TIER
+              avatar: encodeURI(supporter.imgUrlMed)
             }
           ];
         }

docs/_includes/supporters.md

@@ -3,7 +3,7 @@
 Use Mocha at Work? Ask your manager or marketing team if they'd help [support](https://opencollective.com/mochajs#support) our project. Your company's logo will also be displayed on [npmjs.com](http://npmjs.com/package/mocha) and our [GitHub repository](https://github.com/mochajs/mocha#sponsors).
 
 <ul class="image-list" id="sponsors">
-{%- for supporter in supporters.sponsor -%}
+{%- for supporter in supporters.sponsors -%}
   <li>
     {%- if supporter.website -%}
     <a href="{{ supporter.website }}" target="_blank" rel="noopener">
@@ -21,7 +21,7 @@ Use Mocha at Work? Ask your manager or marketing team if they'd help [support](h
 Find Mocha helpful? Become a [backer](https://opencollective.com/mochajs#support) and support Mocha with a monthly donation.
 
 <ul class="image-list faded-images" id="backers">
-{%- for supporter in supporters.backer -%}
+{%- for supporter in supporters.backers -%}
   <li>
     {%- if supporter.website -%}
     <a href="{{ supporter.website }}" target="_blank" rel="noopener">

docs/index.md

@@ -8,8 +8,8 @@ Mocha is a feature-rich JavaScript test framework running on [Node.js][] and in
 
 <nav class="badges">
   <a href="https://gitter.im/mochajs/mocha"><img src="/images/join-chat.svg" height="18" alt="Gitter"></a>
-  <a href="#sponsors"><img src="https://opencollective.com/mochajs/sponsors/badge.svg" height="18" alt="OpenCollective sponsors"></a>
-  <a href="#backers"><img src="https://opencollective.com/mochajs/backers/badge.svg" height="18" alt="OpenCollective backers"></a>
+  <a href="#sponsors"><img src="https://opencollective.com/mochajs/tiers/sponsors/badge.svg" height="18" alt="OpenCollective sponsors"></a>
+  <a href="#backers"><img src="https://opencollective.com/mochajs/tiers/backers/badge.svg" height="18" alt="OpenCollective backers"></a>
 </nav>
 
 {% include supporters.md %}