Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-03-11 21:27:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Merge pull request #683 from ArtificialSloth/feat-metadetails-back-button-behavior

Browse source 
feat: MetaDetails back button behavior
This commit is contained in:
Alexandru Branza 2024-09-18 18:08:27 +03:00 committed by GitHub
commit f0a2ccb83b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 44 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

61
src/routes/MetaDetails/StreamsList/StreamsList.js
View file

@ -20,8 +20,17 @@ const StreamsList = ({ className, video, ...props }) => {
setSelectedAddon(event.value);
}, []);
const backButtonOnClick = React.useCallback(() => {
window.history.back();
}, []);
if (video.deepLinks && typeof video.deepLinks.metaDetailsVideos === 'string') {
window.location.replace(video.deepLinks.metaDetailsVideos + (
typeof video.season === 'number' ?
`?${new URLSearchParams({'season': video.season})}`
:
null
));
} else {
window.history.back();
}
}, [video]);
const countLoadingAddons = React.useMemo(() => {
return props.streams.filter((stream) => stream.content.type === 'Loading').length;
}, [props.streams]);
@ -78,6 +87,30 @@ const StreamsList = ({ className, video, ...props }) => {
}, [streamsByAddon, selectedAddon]);
return (
<div className={classnames(className, styles['streams-list-container'])}>
<div className={styles['select-choices-wrapper']}>
{
video ?
<React.Fragment>
<Button className={classnames(styles['button-container'], styles['back-button-container'])} tabIndex={-1} onClick={backButtonOnClick}>
<Icon className={styles['icon']} name={'chevron-back'} />
</Button>
<div className={styles['episode-title']}>
{`S${video?.season}E${video?.episode} ${(video?.title)}`}
</div>
</React.Fragment>
:
null
}
{
Object.keys(streamsByAddon).length > 1 ?
<Multiselect
{...selectableOptions}
className={styles['select-input-container']}
/>
:
null
}
</div>
{
props.streams.length === 0 ?
<div className={styles['message-container']}>
@ -109,30 +142,6 @@ const StreamsList = ({ className, video, ...props }) => {
:
null
}
<div className={styles['select-choices-wrapper']}>
{
video ?
<React.Fragment>
<Button className={classnames(styles['button-container'], styles['back-button-container'])} tabIndex={-1} onClick={backButtonOnClick}>
<Icon className={styles['icon']} name={'chevron-back'} />
</Button>
<div className={styles['episode-title']}>
{`S${video?.season}E${video?.episode} ${(video?.title)}`}
</div>
</React.Fragment>
:
null
}
{
Object.keys(streamsByAddon).length > 1 ?
<Multiselect
{...selectableOptions}
className={styles['select-input-container']}
/>
:
null
}
</div>
<div className={styles['streams-container']}>
{filteredStreams.map((stream, index) => (
<Stream

21
src/routes/MetaDetails/VideosList/Video/Video.js
View file

@ -56,17 +56,14 @@ const Video = ({ className, id, title, thumbnail, episode, released, upcoming, w
}
});
}, [id, released, watched]);
const href = React.useMemo(() => {
return deepLinks ?
typeof deepLinks.player === 'string' ?
deepLinks.player
:
typeof deepLinks.metaDetailsStreams === 'string' ?
deepLinks.metaDetailsStreams
:
null
:
null;
const videoButtonOnClick = React.useCallback(() => {
if (deepLinks) {
if (typeof deepLinks.player === 'string') {
window.location = deepLinks.player;
} else if (typeof deepLinks.metaDetailsStreams === 'string') {
window.location.replace(deepLinks.metaDetailsStreams);
}
}
}, [deepLinks]);
const renderLabel = React.useMemo(() => function renderLabel({ className, id, title, thumbnail, episode, released, upcoming, watched, progress, scheduled, children, ...props }) {
return (
@ -171,7 +168,7 @@ const Video = ({ className, id, title, thumbnail, episode, released, upcoming, w
watched={watched}
progress={progress}
scheduled={scheduled}
href={href}
onClick={videoButtonOnClick}
{...props}
onMouseUp={popupLabelOnMouseUp}
onLongPress={popupLabelOnLongPress}