fix: scroll to start of the list when selecting

This commit is contained in:
Timothy Z. 2026-05-07 14:39:14 +03:00
parent ad6d30c224
commit dabbd23cf5

View file

@ -1,6 +1,6 @@
// Copyright (C) 2017-2024 Smart code 203358507 // Copyright (C) 2017-2024 Smart code 203358507
import React, { useMemo, useCallback, useState, forwardRef, memo } from 'react'; import React, { useMemo, useCallback, useState, useRef, forwardRef, memo } from 'react';
import classNames from 'classnames'; import classNames from 'classnames';
import Icon from '@stremio/stremio-icons/react'; import Icon from '@stremio/stremio-icons/react';
import { useCore } from 'stremio/core'; import { useCore } from 'stremio/core';
@ -22,6 +22,7 @@ const SideDrawer = memo(forwardRef<HTMLDivElement, Props>(({ seriesInfo, classNa
const core = useCore(); const core = useCore();
const [season, setSeason] = useState<number>(seriesInfo?.season); const [season, setSeason] = useState<number>(seriesInfo?.season);
const [selectedVideoId, setSelectedVideoId] = useState<string | null>(null); const [selectedVideoId, setSelectedVideoId] = useState<string | null>(null);
const videosRef = useRef<HTMLDivElement>(null);
const metaItem = useMemo(() => { const metaItem = useMemo(() => {
return seriesInfo ? return seriesInfo ?
@ -47,8 +48,9 @@ const SideDrawer = memo(forwardRef<HTMLDivElement, Props>(({ seriesInfo, classNa
.sort((a, b) => (a || Number.MAX_SAFE_INTEGER) - (b || Number.MAX_SAFE_INTEGER)); .sort((a, b) => (a || Number.MAX_SAFE_INTEGER) - (b || Number.MAX_SAFE_INTEGER));
}, [props.metaItem.videos]); }, [props.metaItem.videos]);
const seasonOnSelect = useCallback((event: { value: string }) => { const seasonOnSelect = useCallback((event: { value: string | number }) => {
setSeason(parseInt(event.value)); setSeason(parseInt(String(event.value), 10));
videosRef.current?.scrollTo({ top: 0, left: 0 });
}, []); }, []);
const seasonWatched = React.useMemo(() => { const seasonWatched = React.useMemo(() => {
@ -109,7 +111,7 @@ const SideDrawer = memo(forwardRef<HTMLDivElement, Props>(({ seriesInfo, classNa
seasons={seasons} seasons={seasons}
onSelect={seasonOnSelect} onSelect={seasonOnSelect}
/> />
<div className={styles['videos']}> <div ref={videosRef} className={styles['videos']}>
{videos.map((video, index) => ( {videos.map((video, index) => (
<Video <Video
key={index} key={index}