hook for tracking events

[tcampb]

hook for tracking events

[tcampb]

@jeetiss - CalendlyEventListener has been replaced by useCalendlyEventListener in version 4.0.0.

@Memogcia - now that the component has been converted to a hook I plan on looking into adding an option to scope the event listener to a specific scheduling widget.

Example:

<InlineWidget onDateAndTimeSelected={() => console.log('inline widget')} />
<PopupWidget onDateAndTimeSelected={() => console.log('popup widget')} />

The example above would allow you to determine which scheduling widget was used to select a date / time.

[tcampb]

Hi @blessingonuoha,

Unfortunately, Calendly's embed api does not send the selected date time data.

To retrieve this data, you'd need to use a tool like cloakist to host the Calendly scheduling page without using an iframe. This would allow you to attach a javascript event listener to the scheduling page directly. An example video of what this looks like can be found here.

[Memogcia]

Maybe also find a way to differentiate between callers, like passing a custom Id or value to the Calendly component in order to distinguish the source, for example: a group of buttons that opens the widget of Calendly. Also get that "custom value" in the CalendlyEventListener.

[blessingonuoha]

Can we grab the value of the selected date and time using the onDateAndTimeSelected handler? If not, how can it be done? on the onDateAndTimeSelected handler, it comes with a payload but when the date and time is selected the object is still empty