78 lines
2.1 KiB
JavaScript
78 lines
2.1 KiB
JavaScript
import PropTypes from 'prop-types'
|
|
import {useRouter} from 'next/router'
|
|
|
|
import {makeStyles} from '@material-ui/core/styles'
|
|
import {List, ListItem, ListItemText} from '@material-ui/core'
|
|
import FiberNewOutlinedIcon from '@material-ui/icons/FiberNewOutlined'
|
|
import LibraryMusicIcon from '@material-ui/icons/LibraryMusic'
|
|
|
|
import {esBrandNew} from '../../lib/date'
|
|
|
|
const useStyles = makeStyles(theme => ({
|
|
root: {
|
|
width: '100%',
|
|
maxWidth: 360,
|
|
backgroundColor: theme.palette.background.paper
|
|
}
|
|
}))
|
|
|
|
export default function MizikLis({meteEsMobilOuve, niAwtis, teks, slugTeksChwazi, meteSlugTeksChwazi}) {
|
|
const classes = useStyles()
|
|
const router = useRouter()
|
|
|
|
const handleClick = slug => {
|
|
if (meteSlugTeksChwazi) {
|
|
meteSlugTeksChwazi(slug)
|
|
}
|
|
|
|
if (slug !== slugTeksChwazi) {
|
|
if (niAwtis) {
|
|
router.push(`/teks/${slug}`).then(() => window.scrollTo(0, 0))
|
|
} else {
|
|
router.push(`/teks/${slug}#${slug}`).then(() => window.scrollTo(0, 0))
|
|
}
|
|
}
|
|
|
|
if (meteEsMobilOuve) {
|
|
meteEsMobilOuve(false)
|
|
}
|
|
}
|
|
|
|
return (
|
|
<List component='nav' className={classes.root} aria-label='mizik'>
|
|
{teks.map(({slug, tit, awtis, published_at, okiMizikID}) => (
|
|
<ListItem
|
|
key={slug}
|
|
button
|
|
id={slug}
|
|
selected={slugTeksChwazi === slug}
|
|
onClick={() => handleClick(slug)}
|
|
>
|
|
<ListItemText primary={tit} secondary={niAwtis ? awtis.map(a => a.alias).join(', ') : null} />
|
|
{okiMizikID && (
|
|
<LibraryMusicIcon style={{fontSize: 40}} color='primary' />
|
|
)}
|
|
{esBrandNew(published_at) && (
|
|
<FiberNewOutlinedIcon style={{fontSize: 40}} color='primary' />
|
|
)}
|
|
</ListItem>
|
|
))}
|
|
</List>
|
|
)
|
|
}
|
|
|
|
MizikLis.propTypes = {
|
|
meteEsMobilOuve: PropTypes.func,
|
|
niAwtis: PropTypes.bool,
|
|
teks: PropTypes.array.isRequired,
|
|
slugTeksChwazi: PropTypes.string,
|
|
meteSlugTeksChwazi: PropTypes.func
|
|
}
|
|
|
|
MizikLis.defaultProps = {
|
|
meteEsMobilOuve: null,
|
|
niAwtis: false,
|
|
slugTeksChwazi: null,
|
|
meteSlugTeksChwazi: null
|
|
}
|