import React from 'react'

export class EventsListItem extends React.Component {
  constructor(props) {
    super(props)
  }
  render () {
    return (
      <li className="list-group-item">
        <b>Name:</b> {this.props.event.name}
        <br />
        <b>Date:</b> {this.props.event.date}
        <br />
        <b>Created by:</b> {this.props.event.creator.name}
        <br />
        <b>Groups:</b> TBD
      </li>
    )
  }
}

export default EventsListItem
@@ -114,20 +114,381 @@
 (props)%0A
+    this.renderGroups = this.renderGroups.bind(this)%0A  %7D%0A  renderGroups() %7B%0A    let listing = %22%22%0A    const %7B groups %7D = this.props.event%0A    if(groups.length %3E 0) %7B%0A      groups.map((el) =%3E %7B%0A        el == groups%5Bgroups.length-1%5D ? listing += el.name : listing += %60$%7Bel.name%7D, %60%0A      %7D)%0A      return listing%0A    %7D else %7B%0A      return %22No groups invited%22%0A    %7D%0A
   %7D%0A
-
   render
@@ -766,11 +766,29 @@
 /b%3E 
-TBD
+%7Bthis.renderGroups()%7D
 %0A   

Add event-group listing