How to use custom timeline without re-rendering map every time the data changes

CesiumJS
1

The graphData field here will update to render different boxes on the Cesium map. Which works perfectly until I want to edit the timeline time range. If I remove clockViewModel here everything is fine. But with that field, every time I change graphData the map reloads. Is there a way I can change graphData, while keeping a custom timeline, without reloading the map?

<Viewer
    id="wdt-map-viz-cesium"
    clockViewModel={myClock}
    >
     <Camera/>
        <CameraFlyTo
            destination={startCoordinates}
            orientation={startOrientation}
            duration={0}
        />
    {
      graphData && graphArray
        ? (
          graphData.map((rule, index) => (
            <Entity
              key={rule.apc}
              position={Cartesian3.fromDegrees(
                rule.location.longitude,
                rule.location.latitude,
                graphArray[index].offset,
              )}
              name={rule.apc}
              description={`<div>Days to deploy: ${rule.daysToDeploy}</br>`}
              box={graphArray[index]}
            />
          ))
        ) : ''
    }
  </Viewer>