import { useRef } from "react";
import EcgPanel from "./lib/components/ECGPanel";
import { mvScales, mmScales } from "./lib/scales";

import useRemoteDataset  from "./hooks/useRemoteDataset"

const dynamicData = {};

const App = ({ }) => {
  
    const helpersRef = useRef();
    const datasetRef = useRef(dynamicData);
    const wsSource = "ws://localhost:4000";
    const { startAcq, pauseAcq, dataBufferSize } = useRemoteDataset(wsSource, datasetRef); 

  return (
    <>
      <div> EKG VIEWER REACT</div>
      
      <EcgPanel
        debug={true}
        datasetRef={datasetRef}
        mvScale={mvScales[3]}
        msScale={mmScales[3]}
        startAcq={startAcq}
        pauseAcq={pauseAcq}
        dataBufferSize={dataBufferSize}
        helpersRef={helpersRef}
      />


      <div>
        <button onClick={() => {
          try{
            helpersRef.current.play();

          } catch(err){
            console.log(err);
          }
        }}>Start</button>
      </div>
    </>
  )
}
export default App;