import { useState } from 'react'
import { useDispatch } from 'react-redux'
import { Link as RouterLink } from 'react-router-dom'
import PropTypes from 'prop-types'
import {
Button,
Card,
CardActionArea,
CardActions,
CardContent,
CardHeader,
CardMedia,
Snackbar,
Tooltip,
Typography
} from '@material-ui/core'
import { makeStyles } from '@material-ui/core/styles'
import DeleteIcon from '@material-ui/icons/Delete'
import ShareIcon from '@material-ui/icons/Share'
import MuiAlert from '@material-ui/lab/Alert'
import { deleteSchematic } from '../../redux/dashboardSlice'
import { getDate } from '../../utils/GalleryUtils'
const useStyles = makeStyles((theme) => ({
media: {
height: 0,
paddingTop: '56.25%' // 16:9
},
rating: {
marginTop: theme.spacing(1),
marginLeft: 'auto'
}
}))
function Alert (props) {
return
}
// Schematic delete snackbar
function SimpleSnackbar ({ open, close, sch }) {
const dispatch = useDispatch()
return (
>
}
>
{'Delete ' + sch.name + ' ?'}
)
}
SimpleSnackbar.propTypes = {
open: PropTypes.bool,
close: PropTypes.func,
sch: PropTypes.object
}
// Display schematic updated status (e.g : updated 2 hours ago...)
function timeSince (jsonDate) {
const json = jsonDate
const date = new Date(json)
const seconds = Math.floor((new Date() - date) / 1000)
let interval = Math.floor(seconds / 31536000)
if (interval > 1) {
return interval + ' years'
}
interval = Math.floor(seconds / 2592000)
if (interval > 1) {
return interval + ' months'
}
interval = Math.floor(seconds / 86400)
if (interval > 1) {
return interval + ' days'
}
interval = Math.floor(seconds / 3600)
if (interval > 1) {
return interval + ' hours'
}
interval = Math.floor(seconds / 60)
if (interval > 1) {
return interval + ' minutes'
}
return Math.floor(seconds) + ' seconds'
}
// Card displaying overview of onCloud saved schematic.
export default function SchematicCard ({ sch }) {
const classes = useStyles()
// To handle delete schematic snackbar
const [snacOpen, setSnacOpen] = useState(false)
const handleSnacClick = () => {
setSnacOpen(true)
}
const handleSnacClose = (event, reason) => {
if (reason === 'clickaway') {
return
}
setSnacOpen(false)
}
return (
<>
{/* User saved Schematic Overview Card */}
{sch.description}
{/* Display updated status */}
Updated {timeSince(sch.save_time)} ago...
{/* Display delete option */}
{ handleSnacClick() }}
/>
{/* Display share status */}
>
)
}
SchematicCard.propTypes = {
sch: PropTypes.object
}