Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-04-21 07:32:02 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

feat: MetaDetails back button behavior

Browse source
This commit is contained in:
ArtificialSloth 2024-09-17 02:23:04 -04:00
parent 409ff89ef7
commit 7a66e54651
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); setSelectedAddon(event.value);
}, []); }, []);
const backButtonOnClick = React.useCallback(() => { 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(() => { const countLoadingAddons = React.useMemo(() => {
return props.streams.filter((stream) => stream.content.type === 'Loading').length; return props.streams.filter((stream) => stream.content.type === 'Loading').length;
}, [props.streams]); }, [props.streams]);
@ -78,6 +87,30 @@ const StreamsList = ({ className, video, ...props }) => {
}, [streamsByAddon, selectedAddon]); }, [streamsByAddon, selectedAddon]);
return ( return (
<div className={classnames(className, styles['streams-list-container'])}> <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 ? props.streams.length === 0 ?
<div className={styles['message-container']}> <div className={styles['message-container']}>
@ -109,30 +142,6 @@ const StreamsList = ({ className, video, ...props }) => {
: :
null 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']}> <div className={styles['streams-container']}>
{filteredStreams.map((stream, index) => ( {filteredStreams.map((stream, index) => (
<Stream <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]); }, [id, released, watched]);
const href = React.useMemo(() => { const videoButtonOnClick = React.useCallback(() => {
return deepLinks ? if (deepLinks) {
typeof deepLinks.player === 'string' ? if (typeof deepLinks.player === 'string') {
deepLinks.player window.location = deepLinks.player;
: } else if (typeof deepLinks.metaDetailsStreams === 'string') {
typeof deepLinks.metaDetailsStreams === 'string' ? window.location.replace(deepLinks.metaDetailsStreams);
deepLinks.metaDetailsStreams }
: }
null
:
null;
}, [deepLinks]); }, [deepLinks]);
const renderLabel = React.useMemo(() => function renderLabel({ className, id, title, thumbnail, episode, released, upcoming, watched, progress, scheduled, children, ...props }) { const renderLabel = React.useMemo(() => function renderLabel({ className, id, title, thumbnail, episode, released, upcoming, watched, progress, scheduled, children, ...props }) {
return ( return (
@ -171,7 +168,7 @@ const Video = ({ className, id, title, thumbnail, episode, released, upcoming, w
watched={watched} watched={watched}
progress={progress} progress={progress}
scheduled={scheduled} scheduled={scheduled}
href={href} onClick={videoButtonOnClick}
{...props} {...props}
onMouseUp={popupLabelOnMouseUp} onMouseUp={popupLabelOnMouseUp}
onLongPress={popupLabelOnLongPress} onLongPress={popupLabelOnLongPress}