Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-01-11 22:40:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

feature: disable season buttons

Browse source
This commit is contained in:
Timothy Z. 2024-06-27 13:07:22 +03:00
parent 1d6a6cce44
commit 6d8ecd46c2
2 changed files with 16 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
src/routes/MetaDetails/VideosList/SeasonsBar/SeasonsBar.js
View file

@ -46,9 +46,18 @@ const SeasonsBar = ({ className, seasons, season, onSelect }) => {
});
}
}, [onSelect]);
const [prevDisabled, nextDisabled] = React.useMemo(() => {
const currentIndex = seasons.indexOf(season);
return [
currentIndex === 0,
currentIndex === seasons.length - 1
];
}, [season, seasons]);
return (
<div className={classnames(className, styles['seasons-bar-container'])}>
<Button className={styles['prev-season-button']} title={'Previous season'} data-action={'prev'} onClick={prevNextButtonOnClick}>
<Button className={classnames(styles['prev-season-button'], { 'disabled': prevDisabled })} title={'Previous season'} data-action={'prev'} onClick={prevNextButtonOnClick}>
<Icon className={styles['icon']} name={'chevron-back'} />
<div className={styles['label']}>Prev</div>
</Button>
@ -60,7 +69,7 @@ const SeasonsBar = ({ className, seasons, season, onSelect }) => {
selected={selected}
onSelect={seasonOnSelect}
/>
<Button className={styles['next-season-button']} title={'Next season'} data-action={'next'} onClick={prevNextButtonOnClick}>
<Button className={classnames(styles['next-season-button'], { 'disabled': nextDisabled })} title={'Next season'} data-action={'next'} onClick={prevNextButtonOnClick}>
<div className={styles['label']}>Next</div>
<Icon className={styles['icon']} name={'chevron-forward'} />
</Button>

5
src/routes/MetaDetails/VideosList/SeasonsBar/styles.less
View file

@ -27,6 +27,11 @@
border-radius: 3rem;
padding: 0.5rem;
&.disabled {
pointer-events: none;
opacity: 0.5;
}
&:hover, &:focus {
background-color: var(--overlay-color);
}