Split showcase into FB and non-FB (#315)

website/pages/en/users.js

@@ -5,40 +5,69 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-const React = require("react");
+const React = require('react');
 
-const CompLibrary = require("../../core/CompLibrary.js");
+const CompLibrary = require('../../core/CompLibrary.js');
 const Container = CompLibrary.Container;
 
-const siteConfig = require(process.cwd() + "/siteConfig.js");
+const siteConfig = require(process.cwd() + '/siteConfig.js');
 
 class Users extends React.Component {
   render() {
-    const showcase = siteConfig.users.map((user, i) => {
+    const fbShowcase = siteConfig.users
-      return (
+      .filter(user => {
-        <a href={user.infoLink} key={i}>
+        return user.fbOpenSource === true;
-          <img src={user.image} title={user.caption} />
+      })
-        </a>
+      .map((user, i) => {
-      );
+        return (
-    });
+          <a href={user.infoLink} key={i}>
+            <img src={user.image} title={user.caption} />
+          </a>
+        );
+      });
+
+    const showcase = siteConfig.users
+      .filter(user => {
+        return !user.fbOpenSource;
+      })
+      .map((user, i) => {
+        return (
+          <a href={user.infoLink} key={i}>
+            <img src={user.image} title={user.caption} />
+          </a>
+        );
+      });
 
     return (
       <div className="mainContainer">
-        <Container padding={["bottom", "top"]}>
+        <Container padding={['bottom', 'top']}>
           <div className="showcaseSection">
             <div className="prose">
-              <h1>Who Is Using Docusaurus?</h1>
+              <h1>Who is using Docusaurus?</h1>
-              <p>This project is used by many open source projects including...</p>
+              <p>
+                Docusaurus powers some of Facebook's popular{' '}
+                <a href="https://code.facebook.com/projects/">
+                  open source projects
+                </a>.
+              </p>
+            </div>
+            <div className="logos">{fbShowcase}</div>
+            <div className="prose">
+              <p>
+                Docusaurus is also used by open source projects of all sizes.
+              </p>
             </div>
             <div className="logos">{showcase}</div>
             <div className="prose">
-              <p>Are you using this project?</p>
+              <p>Is your project using Docusaurus?</p>
+              <p>
+                Edit this page with a{' '}
+                <a href="https://github.com/facebook/docusaurus/edit/master/website/siteConfig.js">
+                  Pull Request
+                </a>{' '}
+                to add your logo.
+              </p>
             </div>
-            <a
-              href="https://github.com/facebook/docusaurus/edit/master/website/siteConfig.js"
-              className="button">
-              Add your project
-            </a>
           </div>
         </Container>
       </div>

website/siteConfig.js

@@ -8,104 +8,112 @@
 /* List of projects/orgs using your project for the users page */
 const users = [
   {
-    caption: "Prettier",
+    caption: 'Prettier',
-    image: "/img/prettier.png",
+    image: '/img/prettier.png',
-    infoLink: "https://www.prettier.io",
+    infoLink: 'https://www.prettier.io',
-    pinned: true
+    fbOpenSource: false,
+    pinned: true,
   },
   {
-    caption: "FastText",
+    caption: 'FastText',
-    image: "/img/fasttext.png",
+    image: '/img/fasttext.png',
-    infoLink: "https://fasttext.cc",
+    infoLink: 'https://fasttext.cc',
-    pinned: true
+    fbOpenSource: true,
+    pinned: true,
   },
   {
-    caption: "Jest",
+    caption: 'Jest',
-    image: "/img/jest.png",
+    image: '/img/jest.png',
-    infoLink: "https://facebook.github.io/jest/",
+    infoLink: 'https://facebook.github.io/jest/',
-    pinned: true
+    fbOpenSource: true,
+    pinned: true,
   },
   {
-    caption: "Reason React",
+    caption: 'Reason React',
-    image: "/img/reason-react.svg",
+    image: '/img/reason-react.svg',
-    infoLink: "https://reasonml.github.io/reason-react/",
+    infoLink: 'https://reasonml.github.io/reason-react/',
-    pinned: true
+    fbOpenSource: true,
+    pinned: true,
   },
   {
-    caption: "MakeItOpen",
+    caption: 'MakeItOpen',
-    image: "/img/makeitopen.png",
+    image: '/img/makeitopen.png',
-    infoLink: "http://makeitopen.com/",
+    infoLink: 'http://makeitopen.com/',
-    pinned: true
+    fbOpenSource: true,
+    pinned: true,
   },
   {
-    caption: "React Native",
+    caption: 'React Native',
-    image: "/img/react-native.svg",
+    image: '/img/react-native.svg',
-    infoLink: "https://facebook.github.io/react-native",
+    infoLink: 'https://facebook.github.io/react-native',
-    pinned: true
+    fbOpenSource: true,
+    pinned: true,
   },
   {
-    caption: "Relay",
+    caption: 'Relay',
-    image: "/img/relay.svg",
+    image: '/img/relay.svg',
-    infoLink: "https://facebook.github.io/relay/",
+    infoLink: 'https://facebook.github.io/relay/',
-    pinned: true
+    fbOpenSource: true,
+    pinned: true,
   },
   {
-    caption: "Bucklescript",
+    caption: 'Bucklescript',
-    image: "/img/bucklescript.svg",
+    image: '/img/bucklescript.svg',
-    infoLink: "https://bucklescript.github.io/",
+    infoLink: 'https://bucklescript.github.io/',
-    pinned: true
+    fbOpenSource: true,
+    pinned: true,
   },
   {
-    caption: "Docusaurus",
+    caption: 'Docusaurus',
-    image: "/img/docusaurus.svg",
+    image: '/img/docusaurus.svg',
-    infoLink: "https://www.docusaurus.io",
+    infoLink: 'https://www.docusaurus.io',
-    pinned: true
+    fbOpenSource: true,
-  }
+    pinned: true,
+  },
 ];
 
 const siteConfig = {
-  title: "Docusaurus",
+  title: 'Docusaurus',
-  tagline: "Easy to Maintain Open Source Documentation Websites",
+  tagline: 'Easy to Maintain Open Source Documentation Websites',
-  url: "https://docusaurus.io",
+  url: 'https://docusaurus.io',
-  baseUrl: "/",
+  baseUrl: '/',
-  organizationName: "facebook",
+  organizationName: 'facebook',
-  projectName: "Docusaurus",
+  projectName: 'Docusaurus',
-  cname: "docusaurus.io",
+  cname: 'docusaurus.io',
   noIndex: false,
   users,
-  editUrl:
+  editUrl: 'https://github.com/facebook/docusaurus/edit/master/docs/',
-    "https://github.com/facebook/docusaurus/edit/master/docs/",
   headerLinks: [
-    { doc: "installation", label: "Docs" },
+    {doc: 'installation', label: 'Docs'},
-    { page: "help", label: "Help" },
+    {page: 'help', label: 'Help'},
-    { page: "about-slash", label: "About /"},
+    {page: 'about-slash', label: 'About /'},
-    { blog: true, label: "Blog" },
+    {blog: true, label: 'Blog'},
     {
-      href: "https://github.com/facebook/docusaurus",
+      href: 'https://github.com/facebook/docusaurus',
-      label: "GitHub"
+      label: 'GitHub',
-    }
+    },
   ],
-  headerIcon: "img/docusaurus.svg",
+  headerIcon: 'img/docusaurus.svg',
-  footerIcon: "img/docusaurus_monochrome.svg",
+  footerIcon: 'img/docusaurus_monochrome.svg',
-  favicon: "img/docusaurus.ico",
+  favicon: 'img/docusaurus.ico',
   algolia: {
-    apiKey: "3eb9507824b8be89e7a199ecaa1a9d2c",
+    apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
-    indexName: "docusaurus"
+    indexName: 'docusaurus',
   },
   colors: {
-    primaryColor: "#2E8555",
+    primaryColor: '#2E8555',
-    secondaryColor: "#205C3B"
+    secondaryColor: '#205C3B',
   },
-  translationRecruitingLink: "https://crowdin.com/project/docusaurus",
+  translationRecruitingLink: 'https://crowdin.com/project/docusaurus',
-  copyright: "Copyright © " + new Date().getFullYear() + " Facebook Inc.",
+  copyright: 'Copyright © ' + new Date().getFullYear() + ' Facebook Inc.',
   highlight: {
-    theme: "solarized-dark"
+    theme: 'solarized-dark',
   },
-  scripts: ["https://buttons.github.io/buttons.js"],
+  scripts: ['https://buttons.github.io/buttons.js'],
-  gaTrackingId: "UA-44373548-31",
+  gaTrackingId: 'UA-44373548-31',
-  facebookAppId: "1615782811974223",
+  facebookAppId: '1615782811974223',
-  twitter: "true",
+  twitter: 'true',
-  ogImage: "img/docusaurus.png",
+  ogImage: 'img/docusaurus.png',
 };
 
 module.exports = siteConfig;