feat: add a community events page

www/gatsby-config.js

@@ -28,6 +28,22 @@ if (process.env.ANALYTICS_SERVICE_ACCOUNT) {
   })
 }
 
+if (process.env.AIRTABLE_API_KEY) {
+  dynamicPlugins.push({
+    resolve: `gatsby-source-airtable`,
+    options: {
+      apiKey: process.env.AIRTABLE_API_KEY,
+      tables: [
+        {
+          baseId: `app0q5U0xkEwZaT9c`,
+          tableName: `Community Events Submitted`,
+          queryName: `CommunityEvents`,
+        },
+      ],
+    },
+  })
+}
+
 module.exports = {
   siteMetadata: {
     title: `GatsbyJS`,

www/gatsby-node.js

@@ -815,3 +815,42 @@ exports.onPostBuild = () => {
     `./public/gatsbygram.mp4`
   )
 }
+
+// XXX this should probably be a plugin or something.
+exports.sourceNodes = ({ actions: { createTypes } }) => {
+  /*
+   * NOTE: This _only_ defines the schema we currently query for. If anything in
+   * the query at `src/pages/contributing/events.js` changes, we need to make
+   * sure these types are updated as well.
+   *
+   * But why?! Why would I do something this fragile?
+   *
+   * Gather round, children, and I’ll tell you the tale of @jlengstorf being too
+   * lazy to make upstream fixes...
+   */
+  const typeDefs = `
+    type AirtableConnection {
+      nodes: [Airtable!]!
+    }
+
+    type Airtable implements Node {
+      id: ID!
+      data: AirtableData
+    }
+
+    type AirtableData {
+      Name_of_Event: String
+      Organizer_Name: String
+      Date_of_Event: Date
+      Location_of_Event: String
+      Event_URL__if_applicable_: String
+      What_type_of_event_is_this_: String
+      Organizer_s_Last_Name: String
+      Gatsby_Speaker_Approved: Boolean
+      Do_you_want_this_event_listed_on_the_gatsbyjs_org_events_page___public_page_: Boolean
+      Approved_for_Mktg_Support: Boolean
+    }
+  `
+
+  createTypes(typeDefs)
+}

www/package.json

@@ -46,6 +46,7 @@
     "gatsby-remark-prismjs": "^3.0.2",
     "gatsby-remark-responsive-iframe": "^2.0.5",
     "gatsby-remark-smartypants": "^2.0.5",
+    "gatsby-source-airtable": "^2.0.6",
     "gatsby-source-filesystem": "^2.0.1",
     "gatsby-source-npm-package-search": "^2.0.0",
     "gatsby-transformer-csv": "^2.0.0",

www/src/hooks/use-community-events.js

@@ -0,0 +1,33 @@
+import { graphql, useStaticQuery } from "gatsby"
+
+const useCommunityEvents = () => {
+  const {
+    allAirtable: { nodes },
+  } = useStaticQuery(graphql`
+    {
+      allAirtable {
+        nodes {
+          id
+          data {
+            name: Name_of_Event
+            organizer_fname: Organizer_Name
+            organizer_lname: Organizer_s_Last_Name
+            date: Date_of_Event
+            location: Location_of_Event
+            url: Event_URL__if_applicable_
+            type: What_type_of_event_is_this_
+            hasGatsbyTeamSpeaker: Gatsby_Speaker_Approved
+            visible: Do_you_want_this_event_listed_on_the_gatsbyjs_org_events_page___public_page_
+            approved: Approved_for_Mktg_Support
+          }
+        }
+      }
+    }
+  `)
+
+  const events = nodes.filter(node => node.data.visible)
+
+  return events
+}
+
+export default useCommunityEvents

www/src/pages/contributing/events.js

@@ -0,0 +1,52 @@
+import React from "react"
+import { Helmet } from "react-helmet"
+
+import Layout from "../../components/layout"
+import { itemListContributing } from "../../utils/sidebar/item-list"
+import Container from "../../components/container"
+import EmailCaptureForm from "../../components/email-capture-form"
+import DocSearchContent from "../../components/docsearch-content"
+import useCommunityEvents from "../../hooks/use-community-events"
+
+const IndexRoute = props => {
+  const events = useCommunityEvents()
+
+  return (
+    <Layout location={props.location} itemList={itemListContributing}>
+      <DocSearchContent>
+        <Container>
+          <Helmet>
+            <title>Community Events</title>
+          </Helmet>
+          <h1 id="contributing-gatsby" css={{ marginTop: 0 }}>
+            Gatsby Community Events
+          </h1>
+          <p>
+            These events feature Gatsby team members and people from the Gatsby
+            community.
+          </p>
+          <p>
+            Want to see your event featured here?{` `}
+            <a href="https://airtable.com/shrpwc99yogJm9sfI">
+              Submit your event!
+            </a>
+          </p>
+          {events.length > 0 ? (
+            <ul>
+              {events.map(event => (
+                <li key={event.id}>
+                  <pre>{JSON.stringify(event.data, null, 2)}</pre>
+                </li>
+              ))}
+            </ul>
+          ) : (
+            <p>No events are scheduled right now.</p>
+          )}
+          <EmailCaptureForm signupMessage="Want to keep up with the latest tips &amp; tricks? Subscribe to our newsletter!" />
+        </Container>
+      </DocSearchContent>
+    </Layout>
+  )
+}
+
+export default IndexRoute