diff options
-rw-r--r-- | src/pages/FeedPage/PollSubmission.tsx | 8 | ||||
-rw-r--r-- | src/pages/FeedPage/PollSubmissionImage.tsx | 33 |
2 files changed, 33 insertions, 8 deletions
diff --git a/src/pages/FeedPage/PollSubmission.tsx b/src/pages/FeedPage/PollSubmission.tsx index 40ca3d7..9a3a042 100644 --- a/src/pages/FeedPage/PollSubmission.tsx +++ b/src/pages/FeedPage/PollSubmission.tsx @@ -54,9 +54,11 @@ const PollSubmission: React.FC<PropTypes> = ({ user }) => { const handleClick = () => { if (expanded) { - post('/polls/', { authorId: user._id, contents }).then(res => { - console.log(res.data); - }); + if(contents.left?.url && contents.right?.url ) { + post('/polls/', {authorId: user._id, contents}).then(res => { + console.log(res.data); + }); + } } setExpanded(!expanded); }; diff --git a/src/pages/FeedPage/PollSubmissionImage.tsx b/src/pages/FeedPage/PollSubmissionImage.tsx index bf268a3..42389f6 100644 --- a/src/pages/FeedPage/PollSubmissionImage.tsx +++ b/src/pages/FeedPage/PollSubmissionImage.tsx @@ -4,6 +4,7 @@ import CloudUploadIcon from '@material-ui/icons/CloudUpload'; import { CardActionArea, CardMedia } from '@material-ui/core'; import UploadImage from '../../components/UploadImage/UploadImage'; import { Contents } from './types'; +import ClearIcon from '@material-ui/icons/Clear'; interface PropTypes { contents: Contents; @@ -18,7 +19,12 @@ const useStyles = makeStyles(theme => ({ display: 'flex', justifyContent: 'center', alignItems: 'center', - cursor: 'pointer' + cursor: 'pointer', + boxShadow: 'inset 0 0 10px;' + }, + clearIcon: { + opacity: '.4', + fontSize: 130 } })); @@ -26,9 +32,13 @@ const PollSubmissionImage: React.FC<PropTypes> = ({ setContents, which, contents const classes = useStyles(); const [display, setDisplay] = useState(false); const [image, setImage] = useState(''); + const [clearIconDisplay, setClearIconDisplay] = useState(false); const handleClick = () => { - setDisplay(!display); + image === '' + ? setDisplay(!display) + : patchUrl(''); + }; const patchUrl = (url: string) => { @@ -37,12 +47,25 @@ const PollSubmissionImage: React.FC<PropTypes> = ({ setContents, which, contents setContents({...contents}); }; + const handleMouseEnter = () => { + setClearIconDisplay(true); + }; + + const handleMouseLeave = () => { + setClearIconDisplay(false); + }; return ( <> - <CardActionArea onClick={handleClick}> - <CardMedia className={classes.images} image={image}> - <CloudUploadIcon /> + <CardActionArea onClick={handleClick} > + <CardMedia className={classes.images} image={image} onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}> + { + image === '' + ? <CloudUploadIcon fontSize='large' color='primary' /> + : clearIconDisplay + ? <ClearIcon className={classes.clearIcon} color='primary'/> + : null + } </CardMedia> </CardActionArea> <UploadImage displayD={display} setDisplayD={setDisplay} callback={patchUrl} /> |