import { useRef, useState } from 'react'
import AvatarEditor from 'react-avatar-editor'
import Button from 'react-bootstrap/Button'
import BootstrapForm from 'react-bootstrap/Form'
import Upload from './upload'
import EditImage from '../svgs/image-edit-fill.svg'
import Moon from '../svgs/moon-fill.svg'
import { useShowModal } from './modal'
export default function Avatar ({ onSuccess }) {
const [uploading, setUploading] = useState()
const ref = useRef()
const [scale, setScale] = useState(1)
const showModal = useShowModal()
const Body = ({ onClose, file, upload }) => {
return (
setScale(parseFloat(e.target.value))}
min={1} max={2} step='0.05'
defaultValue={scale}
/>
)
}
return (
{uploading
?
: }
}
onError={e => {
console.log(e)
setUploading(false)
}}
onSelect={(file, upload) => {
showModal(onClose => )
}}
onSuccess={async key => {
onSuccess && onSuccess(key)
setUploading(false)
}}
onStarted={() => {
setUploading(true)
}}
/>
)
}