import Webcam from 'react-webcam'
import { useRef } from 'react'
import { IconCamera } from '@tabler/icons-react'

export default function WebcamPhoto({ onPhoto }:any){
  const webcamRef = useRef<any>()
  function takePicture(){
    const image = webcamRef.current!.getScreenshot()
    onPhoto(image)
  }

  return <>
    <Webcam videoConstraints={{ facingMode: "user" }} ref={webcamRef} />
    <button className="btn btn-primary" onClick={takePicture}><IconCamera /></button>
  </>
}