For example:
<img width="1904" alt="Screen Shot 2021-11-05 at 11 59 05 AM" src="https://user-images.githubusercontent.com/29597/140540816-25d6d47b-7aea-4121-aeaa-565accc65b1f.png">

hoveredEvent,
    data, 
  ]);
  useLayoutEffect(() => {
    const userTimingMarksView = userTimingMarksViewRef.current;
    if (userTimingMarksView) {
      userTimingMarksView.setHoveredMark(
        hoveredEvent ? hoveredEvent.userTimingMark : null,
      );
    }
    const nativeEventsView = nativeEventsViewRef.current;
    if (nativeEventsView) {
      nativeEventsView.setHoveredEvent(
        hoveredEvent ? hoveredEvent.nativeEvent : null,
      );
    }
    const schedulingEventsView = schedulingEventsViewRef.current;
    if (schedulingEventsView) {
      schedulingEventsView.setHoveredEvent(
        hoveredEvent ? hoveredEvent.schedulingEvent : null,
      );
    }
    const suspenseEventsView = suspenseEventsViewRef.current;
    if (suspenseEventsView) {
      suspenseEventsView.setHoveredEvent(
        hoveredEvent ? hoveredEvent.suspenseEvent : null,
      );
    }
    const reactMeasuresView = reactMeasuresViewRef.current;
    if (reactMeasuresView) {