refactored how event(s) data is passed to pages/elements

app/api/events.mjs

@@ -11,11 +11,11 @@ export const events = data
 
 export function inflateEvent(event) {
   let inflatedEvent = { ...event }
-  if (inflatedEvent.talks) {
-    inflatedEvent.talks = inflatedEvent.talks.map(inflateTalk)
-    console.log('Before:', inflatedEvent.sponsor)
-    inflatedEvent.sponsors = inflatedEvent.sponsors.map(inflateSponsors)
-    console.log('After:', inflatedEvent.sponsor)
+  if (event.talks) {
+    inflatedEvent.talks = event.talks.map(inflateTalk)
+  }
+  if (event.sponsors) {
+    inflatedEvent.sponsors = event.sponsors.map(inflateSponsors)
   }
   return inflatedEvent
 }

app/api/events/$id.mjs

@@ -14,19 +14,13 @@ export async function get(req) {
         notFound: true
       }
     }
-  } else {
-  // We have to convert event from an object to an array to inflate it
-  let inflatedEvent = [event].map(inflateEvent)
-  let eventSponsors = event.sponsors
-  let eventTalks = event.talks
-
-  // In event/$id we are reusing the element <list-talks> which expects a list of events
-  return {
-    json: {
-      events: inflatedEvent,
-      sponsors: eventSponsors,
-      talks: eventTalks,
-      display
+  } 
+  else {
+    return {
+      json: {
+        event: inflateEvent(event),
+        display
+      }
     }
-  }}
+  }
 }

app/elements/events-list.mjs

@@ -1,11 +1,8 @@
 export default function EventsList({ html, state }) {
     const { store } = state
-    const allEvents = store.data.sort((a,b) => new Date(b.date) - new Date(a.date))
+    const events = store.data.sort((a,b) => new Date(b.date) - new Date(a.date))
 
-    let now = new Date().toISOString().split('T')[0]
-    let pastEvents  = allEvents.filter(e => e.date < now)
-
-    if (pastEvents.length > 0) {
+    if (events.length > 0) {
       return html`
       <style>
       @media only screen and (min-width: 768px) {
@@ -24,7 +21,7 @@ export default function EventsList({ html, state }) {
       }
     </style>
     <ul>
-        ${pastEvents.map(
+        ${events.map(
             e => `
             <li >
               <a href="/events/${e.id}">

app/elements/list-sponsors.mjs

@@ -1,6 +1,9 @@
 export default function ListSponsors({ html, state = {} }) {
   const { store = {} } = state
-  const { sponsors } = store
+  let { event, sponsors } = store
+  if (event) {
+    sponsors = event.sponsors
+  }
   if (sponsors.length > 0) {
     return html`
       <style>

app/elements/list-talks.mjs

@@ -1,8 +1,10 @@
 export default function ListTalks({ html, state = {} }) {
   const { store, attrs } = state
-  const { events } = store
+  let { events, event } = store
   let { event_id } = attrs
-  let event = events.find(e => e.id === event_id)
+  if (event_id && events) {
+    event = events.find(e => e.id === event_id)
+  }
   let { talks } = event
   return html`
     <style>

app/elements/view-event.mjs

@@ -3,11 +3,8 @@ import { marked } from 'marked'
 export default function ViewEvent({ html, state = {} }) {
   const { attrs, store } = state
   let { events } = store
-  console.log(events)
   let { id } = attrs
-  console.log(id)
   let event = events.find(e => e.id === id)
-  console.log(event)
   return html`
     <h3>${event.title}</h3>
     <p>${marked(event.description)}</p>

app/pages/events/$id.mjs

@@ -2,8 +2,7 @@ import { marked } from "marked"
 
 export default function ({ html, state = {} }) {
   let { store = {} } = state
-  let event = store.events[0]
-  let display = store.display
+  let { event, display } = store
   let DEFAULT_LOCATION = "The Collective Seattle, 400 Dexter Ave N, Seattle, WA 98109"
   let {
     id,

app/pages/talks/$id.mjs

@@ -24,7 +24,6 @@ export default function ({ html, state = {} }) {
     // set the "photo" property with an absolute path (so that the <person-detail> element will work)
     let speakerClone = { ...speaker }
     speakerClone.photo = '/_public/images/speakers/' + speaker.photo
-    //console.log(speakerClone)
     const speakerProps = Object.keys(speakerClone).map(key => `${key}="${speakerClone[key]}"`).join(' ')
     return html`
       <style>

app/pages/workshops/$id.mjs

@@ -24,7 +24,6 @@ export default function ({ html, state = {} }) {
     // set the "photo" property with an absolute path (so that the <person-detail> element will work)
     let speakerClone = { ...speaker }
     speakerClone.photo = '/_public/images/speakers/' + speaker.photo
-    //console.log(speakerClone)
     const speakerProps = Object.keys(speakerClone).map(key => `${key}="${speakerClone[key]}"`).join(' ')
     return html`
       <style>