resium | React components for 🌏 Cesium | Frontend Framework library

I have successfully implemented the tutorial on how to build a flight tracker. I would like to be able to access the index of my data at a current time in my app. In other words, when cesium is showing the animation of the airplane following the flight path, how can I get the current index that the airplane is at? (the index of my data).

I have two entities, one under a loop to generate all the points of the path and another where I load an airplane model. I need to sync other parts of my app with the current state of Cesium. (If I pause Cesium, I need to pause other things, etc.)

Im using Resium. btw. This is my airplane model. It animates according to the position property which is derived from const positionProperty = new SampledPositionProperty();

I have been trying to implement Cesium in ReactJs application where various factories are shown in the cesium viewer and polygon grids are drawn on the factory co-ordinates. Everything is working fine but one thing is making confusion. I am trying to set dynamic camera height relative to my factory, That means The bigger the factory the higher the camera so that the whole factory is covered by the Camera on the first Load.

For this purpose, I was trying to use the component from Resium (React component of Cesium).

My Code is something like this bellow: