diff --git a/src/routes/Player/SubtitlesMenu/SubtitleVariant/SubtitleVariant.tsx b/src/routes/Player/SubtitlesMenu/SubtitleVariant/SubtitleVariant.tsx index 9ee6e1a9c..4033a4543 100644 --- a/src/routes/Player/SubtitlesMenu/SubtitleVariant/SubtitleVariant.tsx +++ b/src/routes/Player/SubtitlesMenu/SubtitleVariant/SubtitleVariant.tsx @@ -27,31 +27,18 @@ type Props = { onSelect: (track: SubtitlesTrack) => void, }; +const hasValidLabel = (label?: string) => label && label.length > 0 && !label.startsWith('http'); + const SubtitleVariant = ({ track, selected, onSelect }: Props) => { const { t } = useTranslation(); const toast = useToast(); const buttonRef = useRef(null); const triggers = useMemo(() => [buttonRef], []); - const downloadUrl = useMemo(() => { - return track.fallbackUrl || track.url; - }, [track.fallbackUrl, track.url]); - - const variantLabel = useMemo(() => { - return (track.label && track.label.length > 0 && !track.label.startsWith('http')) - ? track.label - : languages.label(track.lang); - }, [track.label, track.lang]); - - const downloadFileName = useMemo(() => { - return (track.label && track.label.length > 0 && !track.label.startsWith('http')) - ? track.label - : `subtitle-${track.lang || 'unknown'}`; - }, [track.label, track.lang]); - - const canCopyUrl = useMemo(() => { - return typeof downloadUrl === 'string' && !downloadUrl.startsWith('blob:'); - }, [downloadUrl]); + const downloadUrl = track.fallbackUrl || track.url; + const variantLabel = hasValidLabel(track.label) ? track.label : languages.label(track.lang); + const downloadFileName = hasValidLabel(track.label) ? track.label : `subtitle-${track.lang || 'unknown'}`; + const canCopyUrl = typeof downloadUrl === 'string' && !downloadUrl.startsWith('blob:'); const onSelectClick = useCallback(() => { onSelect(track); diff --git a/src/routes/Player/SubtitlesMenu/SubtitlesMenu.js b/src/routes/Player/SubtitlesMenu/SubtitlesMenu.js index 751362ba9..d72f3cd76 100644 --- a/src/routes/Player/SubtitlesMenu/SubtitlesMenu.js +++ b/src/routes/Player/SubtitlesMenu/SubtitlesMenu.js @@ -113,7 +113,7 @@ const SubtitlesMenu = React.memo(React.forwardRef((props, ref) => { props.onExtraSubtitlesTrackSelected(track.id); } } - }, [subtitlesTracksForLanguage, props.onSubtitlesTrackSelected, props.onExtraSubtitlesTrackSelected]); + }, [props.onSubtitlesTrackSelected, props.onExtraSubtitlesTrackSelected]); const onSubtitlesDelayChanged = React.useCallback((value) => { if (typeof props.selectedExtraSubtitlesTrackId === 'string') { if (props.extraSubtitlesDelay !== null && !isNaN(props.extraSubtitlesDelay)) {