Recording timeline component

<lytx-recording-timeline auth-token="[auth-token]" imei="[imei]" organization-id="[organization-id]"></lytx-recording-timeline>

// app.component.view.html
<lytx-recording-timeline auth-token="TOKEN" imei="1a2b3c4d5e6" organization-id="5" ng-on-component_error="componentErrorLytxRecordingTimeline($event)"></lytx-recording-timeline>

// app.component.view.html
import './App.css';
import { useEffect, useRef } from 'react';
function App() {
  const playerRef = useRef()
  useEffect(() => {
    const element = playerRef.current
    const onComponentErrorHandler = (event) => {
      console.log('onComponentErrorHandler')
      console.error(event)
    }
    if (element) {
      element.addEventListener("componentError", onComponentErrorHandler)
    }
    return () => {
      if (element) {
        element.removeEventListener("componentError", onComponentErrorHandler)
      }
    }
  }, [playerRef])
  return (
    <div className="App">
      <lytx-recording-timeline ref={playerRef} auth-token="TOKEN" imei="1a2b3c4d5e6" organization-id="5"></lytx-recording-timeline>
    </div>
  );
}
export default App;