Filter out old events for smaller page payloads

gatsby-node.js

@@ -2,10 +2,17 @@ const _ = require('lodash')
 const path = require('path')
 const { createFilePath } = require('gatsby-source-filesystem')
 const { paginate } = require('gatsby-awesome-pagination')
+const moment = require('moment')
 
 const getOnlyPublished = edges =>
   _.filter(edges, ({ node }) => node.status === 'publish')
 
+// Used to filter out older events from queries
+const eventsNotBefore = moment()
+  .startOf('day')
+  .subtract(1, 'days')
+  .toISOString()
+
 exports.createPages = ({ actions, graphql }) => {
   const { createPage } = actions
 
@@ -275,6 +282,7 @@ exports.createPages = ({ actions, graphql }) => {
               slug: eventOrganizer.slug,
               description: eventOrganizer.description,
               association: eventOrganizer.association,
+              after: eventsNotBefore,
             },
           })
         }
@@ -440,3 +448,22 @@ exports.onCreateNode = ({ node, actions, getNode }) => {
     })
   }
 }
+
+exports.onCreatePage = ({ page, actions }) => {
+  const { createPage, deletePage } = actions
+
+  // We need to add context to a few pages
+  const pagesWithContext = ['/', '/program/']
+  if (!pagesWithContext.includes(page.path)) {
+    return
+  }
+
+  deletePage(page)
+  createPage({
+    ...page,
+    context: {
+      ...page.context,
+      after: eventsNotBefore,
+    },
+  })
+}

src/pages/index.js

@@ -23,12 +23,23 @@ export default class IndexPage extends React.Component {
         <section className="front-page-info">
           <div className="visit-us">
             <h2 className="section-title">Besøk oss</h2>
-            <p>Chateau Neuf ligger på Majorstua i Oslo, i <a href="https://www.google.no/maps/place/Slemdalsveien+15,+0369+Oslo/data=!4m2!3m1!1s0x46416dc4ab53aa7d:0x5629681f36c1c8af?sa=X&ved=2ahUKEwjR94re3unjAhUj4aYKHRLOAuwQ8gEwAHoECBQQAQ" target="_blank">Slemdalsveien 15</a>.</p>
+            <p>
+              Chateau Neuf ligger på Majorstua i Oslo, i{' '}
+              <a
+                href="https://www.google.no/maps/place/Slemdalsveien+15,+0369+Oslo/data=!4m2!3m1!1s0x46416dc4ab53aa7d:0x5629681f36c1c8af?sa=X&ved=2ahUKEwjR94re3unjAhUj4aYKHRLOAuwQ8gEwAHoECBQQAQ"
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                Slemdalsveien 15
+              </a>
+              .
+            </p>
             <div className="visit-us_links">
-              <Link to="/bli-aktiv/" className="button button-small">
+              <Link to="/praktisk/" className="button button-small">
                 Praktisk informasjon
-              </Link><br />
+              </Link>
-              <Link to="/bli-aktiv/" className="button button-small">
+              <br />
+              <Link to="/aapningstider/" className="button button-small">
                 Åpningstider
               </Link>
             </div>
@@ -39,7 +50,10 @@ export default class IndexPage extends React.Component {
                 Bli frivillig
               </Link>
               <p>
-              Chateau Neuf drives i stor grad av frivillige. Vil du være med å arrangere greier på studentersamfundet? Sjekk ut de ulike <Link to="/bli-aktiv/">foreningene</Link> som holder til på huset for å finne ut hva som passer for deg.
+                Chateau Neuf drives i stor grad av frivillige. Vil du være med å
+                arrangere greier på studentersamfundet? Sjekk ut de ulike{' '}
+                <Link to="/bli-aktiv/">foreningene</Link> som holder til på
+                huset for å finne ut hva som passer for deg.
               </p>
               <Link to="/bli-aktiv/" className="button button-small">
                 Les mer om å bli frivillig
@@ -65,8 +79,11 @@ IndexPage.propTypes = {
 }
 
 export const pageQuery = graphql`
-  query {
+  query IndexPage($after: Date!) {
-    allWordpressWpEvents(sort: { fields: start_time, order: ASC }) {
+    allWordpressWpEvents(
+      sort: { fields: start_time, order: ASC }
+      filter: { start_time: { gt: $after } }
+    ) {
       edges {
         node {
           ...EventListFields

src/pages/program.js

@@ -34,8 +34,11 @@ EventProgram.propTypes = {
 }
 
 export const pageQuery = graphql`
-  query {
+  query ProgramPage($after: Date!) {
-    allWordpressWpEvents(sort: { fields: start_time, order: ASC }) {
+    allWordpressWpEvents(
+      filter: { start_time: { gt: $after } }
+      sort: { fields: start_time, order: ASC }
+    ) {
       edges {
         node {
           ...EventListFields

src/templates/event-organizer.js

@@ -59,9 +59,12 @@ EventOrganizerPage.propTypes = {
 }
 
 export const pageQuery = graphql`
-  query EventOrganizerPage($slug: String!) {
+  query EventOrganizerPage($slug: String!, $after: Date!) {
     allWordpressWpEvents(
-      filter: { event_organizers: { elemMatch: { slug: { eq: $slug } } } }
+      filter: {
+        event_organizers: { elemMatch: { slug: { eq: $slug } } }
+        start_time: { gt: $after }
+      }
       sort: { fields: date, order: DESC }
     ) {
       totalCount