handle repeating (child) events

src/assets/blocks/civicrm-content/components/SelectEventControl.js

@@ -21,6 +21,46 @@ const EventOption = (props) => {
     )
 }
 
+const getChildEvents = (eventId) => {
+    return CRM.api3('RecurringEntity', 'get', {
+        sequential: 1,
+        parent_id: eventId,
+        entity_table: 'civicrm_event',
+        'options.limit': 0,
+        'api.Event.get': {
+            id: '$value.entity_id',
+            return: [
+                'title',
+                'summary',
+                'event_type.label',
+                'start_date',
+                'end_date',
+            ],
+        },
+    }).then((result) => {
+        if (!result?.count) return null
+
+        let childEvents = result.values.map((entity) => {
+            const event = {
+                ...entity['api.Event.get'].values[0],
+            }
+            return {
+                ...event,
+                label: event.title,
+                value: event.id,
+            }
+        })
+
+        for (let i = 0; i < childEvents.length; i++) {
+            childEvents[i].title = childEvents[i].label = `${
+                childEvents[i].label
+            } (${i + 1} of ${childEvents.length})`
+        }
+
+        return childEvents
+    })
+}
+
 const SelectEventControl = ({ id, setAttributes }) => {
     const [events, setEvents] = useState([])
     const [event, setEvent] = useState({})
@@ -38,23 +78,36 @@ const SelectEventControl = ({ id, setAttributes }) => {
                 ['is_active', '=', '1'],
                 ['is_template', '=', '0'],
             ],
+            orderBy: {
+                id: 'DESC',
+            },
         }).then((result) => {
             if (!result && !result.length) return
 
-            const options = result.map((event) => ({
+            let options = result.map((event) => ({
                 ...event,
                 label: event.title,
                 value: event.id,
             }))
 
-            setEvents([...events, ...options])
+            result.map((event) => {
+                getChildEvents(event.id).then((childEvents) => {
+                    if (childEvents) {
+                        options = options.map((event) => {
+                            const replace = childEvents.find(
+                                (e) => e.id == event.id
+                            )
+
+                            return replace ? replace : event
+                        })
+                    }
+
+                    setEvents([...events, ...options])
+                })
+            })
         })
     }, [])
 
-    const test = () => {
-        events.map((event) => event)
-    }
-
     useEffect(() => {
         setEvent(events.filter((event) => event.id == id)[0])
     }, [events, id])