fix(EpisodePicker): set season and episode from url

This commit is contained in:
Botzy 2025-02-10 14:18:13 +02:00
parent 6b30b90893
commit 34808d6014
3 changed files with 18 additions and 16 deletions

View file

@ -1,6 +1,6 @@
// Copyright (C) 2017-2025 Smart code 203358507
import React, { forwardRef, useCallback, useState } from 'react';
import React, { ChangeEvent, forwardRef, useCallback, useState } from 'react';
import { type KeyboardEvent, type InputHTMLAttributes } from 'react';
import classnames from 'classnames';
import styles from './styles.less';
@ -55,7 +55,7 @@ const NumberInput = forwardRef<HTMLInputElement, Props>(({ defaultValue, ...prop
{props.showButtons ? <Button
className={styles['btn']}
onClick={handleDecrease}
disabled={props.disabled || typeof props.min !== 'undefined' ? value <= props.min : false}>
disabled={props.disabled || (props.min !== undefined ? value <= props.min : false)}>
<Icon className={styles['icon']} name={'remove'} />
</Button> : null}
<div className={classnames(styles['number-display'], props.showButtons ? styles['with-btns'] : '')}>
@ -67,12 +67,12 @@ const NumberInput = forwardRef<HTMLInputElement, Props>(({ defaultValue, ...prop
value={value}
{...props}
className={classnames(props.className, styles['value'], { 'disabled': props.disabled })}
onChange={(event) => setValue(event.value)}
onChange={(event: ChangeEvent<HTMLInputElement>) => setValue(parseInt(event.target.value))}
onKeyDown={onKeyDown}
/>
</div>
{props.showButtons ? <Button
className={styles['btn']} onClick={handleIncrease} disabled={props.disabled || typeof props.max !== 'undefined' ? value >= props.max : false}>
className={styles['btn']} onClick={handleIncrease} disabled={props.disabled || (props.max !== undefined ? value >= props.max : false)}>
<Icon className={styles['icon']} name={'add'} />
</Button> : null}
</div>

View file

@ -10,21 +10,23 @@ type Props = {
seriesId: string;
onSubmit: (season: number, episode: number) => void;
};
export const EpisodePicker = ({ className, seriesId, onSubmit }: Props) => {
export const EpisodePicker = ({ className, onSubmit }: Props) => {
const { t } = useTranslation();
const splitPath = window.location.hash.split('/');
const videoId = decodeURIComponent(splitPath[splitPath.length - 1]);
const [initialSeason, initialEpisode] = React.useMemo(() => {
const [, season, episode] = seriesId ? seriesId.split(':') : [];
const initialSeason = isNaN(parseInt(season)) ? 1 : parseInt(season);
const initialEpisode = isNaN(parseInt(episode)) ? 1 : parseInt(episode);
const [, pathSeason, pathEpisode] = videoId ? videoId.split(':') : [];
const initialSeason = isNaN(parseInt(pathSeason)) ? 1 : parseInt(pathSeason);
const initialEpisode = isNaN(parseInt(pathEpisode)) ? 1 : parseInt(pathEpisode);
return [initialSeason, initialEpisode];
}, [seriesId]);
const seasonRef = useRef(null);
const episodeRef = useRef(null);
}, [videoId]);
const seasonRef = useRef<HTMLInputElement>(null);
const episodeRef = useRef<HTMLInputElement>(null);
const handleSubmit = React.useCallback(() => {
const season = seasonRef.current?.value;
const episode = episodeRef.current?.value;
if (typeof onSubmit === 'function') onSubmit(season, episode);
const season = seasonRef.current?.value || 1;
const episode = episodeRef.current?.value || 1;
if (typeof onSubmit === 'function' && !isNaN(season) && !isNaN(parseInt(episode))) onSubmit(season, episode);
}, [onSubmit, seasonRef, episodeRef]);
return <div className={className}>

View file

@ -128,14 +128,14 @@ const StreamsList = ({ className, video, onEpisodeSearch, ...props }) => {
{
props.streams.length === 0 ?
<div className={styles['message-container']}>
<SeasonEpisodePicker seriesId={video?.id} onSubmit={handleEpisodePicker} />
<SeasonEpisodePicker onSubmit={handleEpisodePicker} />
<Image className={styles['image']} src={require('/images/empty.png')} alt={' '} />
<div className={styles['label']}>No addons were requested for streams!</div>
</div>
:
props.streams.every((streams) => streams.content.type === 'Err') ?
<div className={styles['message-container']}>
<SeasonEpisodePicker seriesId={video?.id} onSubmit={handleEpisodePicker} />
<SeasonEpisodePicker onSubmit={handleEpisodePicker} />
{video?.upcoming && <div className={styles['label']}>{t('UPCOMING')}...</div>}
<Image className={styles['image']} src={require('/images/empty.png')} alt={' '} />
<div className={styles['label']}>{t('NO_STREAM')}</div>