From 5eba5c1ffcdaee9a81e965f0570b00dd26bb38c6 Mon Sep 17 00:00:00 2001 From: ilyayudovin Date: Thu, 29 Oct 2020 21:28:52 +0300 Subject: Wait till modal slide right on close --- src/components/AvatarCrop/AvatarCrop.tsx | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) (limited to 'src/components/AvatarCrop/AvatarCrop.tsx') diff --git a/src/components/AvatarCrop/AvatarCrop.tsx b/src/components/AvatarCrop/AvatarCrop.tsx index e344edd..ef6d9c8 100644 --- a/src/components/AvatarCrop/AvatarCrop.tsx +++ b/src/components/AvatarCrop/AvatarCrop.tsx @@ -6,8 +6,8 @@ import ModalScreen from "../ModalScreen/ModalScreen"; import { getCroppedImg } from './canvasUtils' interface PropTypes { - location?: any; avatarToCrop: string; + setAvatarToCrop: (src: string) => void; callback: (file: File) => void; } @@ -23,7 +23,7 @@ const useStyles = makeStyles(theme => ({ } })); -const AvatarCrop: React.FC = ({location, avatarToCrop, callback}) => { +const AvatarCrop: React.FC = ({ avatarToCrop, setAvatarToCrop, callback }) => { const classes = useStyles(); const [crop, setCrop] = useState({x: 0, y: 0}); const [zoom, setZoom] = useState(1); @@ -42,12 +42,17 @@ const AvatarCrop: React.FC = ({location, avatarToCrop, callback}) => } }, [avatarToCrop, croppedAreaPixels]); + const handleCloseModal = useCallback( () => { + setAvatarToCrop(''); + },[]); + return ( } handleAction={handleLoadCroppedImage} isActionDisabled={false} + handleCloseModal={handleCloseModal} >