diff options
author | eug-vs <eug-vs@keemail.me> | 2020-08-14 02:45:20 +0300 |
---|---|---|
committer | eug-vs <eug-vs@keemail.me> | 2020-08-14 02:48:11 +0300 |
commit | fca54f49bb3541f726da1becffaa60197835ca68 (patch) | |
tree | 08dfa96410207f5621989c3cb0ea930624af1bee /src/containers/PollCreation/PollCreationImage.tsx | |
parent | 88d3c411efbf5f6ac74fa67e38c154f1e53d4938 (diff) | |
download | which-ui-fca54f49bb3541f726da1becffaa60197835ca68.tar.gz |
refactor: resolve eslint errors
Diffstat (limited to 'src/containers/PollCreation/PollCreationImage.tsx')
-rw-r--r-- | src/containers/PollCreation/PollCreationImage.tsx | 96 |
1 files changed, 0 insertions, 96 deletions
diff --git a/src/containers/PollCreation/PollCreationImage.tsx b/src/containers/PollCreation/PollCreationImage.tsx deleted file mode 100644 index d619a8e..0000000 --- a/src/containers/PollCreation/PollCreationImage.tsx +++ /dev/null @@ -1,96 +0,0 @@ -import React, { useState } from 'react'; -import { makeStyles } from '@material-ui/core/styles'; -import { - CardActionArea, - CardMedia, - Typography, - CircularProgress -} from '@material-ui/core'; -import { Check, CancelOutlined } from '@material-ui/icons'; - -import AttachLink from '../../components/AttachLink/AttachLink'; -import FileUpload from '../../components/FileUpload/FileUpload'; - -interface PropTypes { - callback: (file?: File | string) => void; - progress?: number; -} - -const useStyles = makeStyles({ - root: { - display: 'flex', - justifyContent: 'center', - flexDirection: 'column', - alignItems: 'center', - width: '50%' - }, - clearIcon: { - opacity: '.5', - fontSize: 50 - }, - media: { - height: '100%', - width: '100%', - display: 'flex', - justifyContent: 'center', - alignItems: 'center' - }, - darkOverlay: { - backgroundColor: 'rgba(0, 0, 0, 0.45)', - color: 'white', - position: 'absolute', - top: 0, - left: 0, - transitionDuration: '0.5s' - }, - invisible: { - backgroundColor: 'rgba(0, 0, 0, 0)', - }, - icon: { - color: 'white' - } -}); - - -const PollCreationImage: React.FC<PropTypes> = ({ callback, progress }) => { - const classes = useStyles(); - const [url, setUrl] = useState<string>(); - - const handleClear = (): void => { - setUrl(undefined); - callback(undefined); - }; - - const childrenCallback = (fileUrl: string, file?: File) => { - setUrl(fileUrl); - callback(file || fileUrl); - }; - - const Upload = ( - <div className={classes.root}> - <FileUpload callback={childrenCallback} /> - <Typography variant="h6"> or </Typography> - <AttachLink callback={childrenCallback} /> - </div> - ); - - const Media = ( - <CardActionArea onClick={handleClear} className={classes.root} disabled={Boolean(progress)}> - <CardMedia image={url} className={classes.media}> - <div className={`${classes.media} ${classes.darkOverlay} ${progress === 100 && classes.invisible}`}> - { - progress - ? progress < 100 - ? <CircularProgress variant="static" value={progress} className={classes.icon} /> - : <Check className={classes.icon} fontSize="large" /> - : <CancelOutlined className={classes.icon} fontSize="large" /> - } - </div> - </CardMedia> - </CardActionArea> - ); - - return url ? Media : Upload; -}; - -export default PollCreationImage; |