diff --git a/src/assets/locales/en.json b/src/assets/locales/en.json index f10859ad..f88f6746 100644 --- a/src/assets/locales/en.json +++ b/src/assets/locales/en.json @@ -368,6 +368,7 @@ "customChoice": "Drop or upload file", "customizeLabel": "Customize", "offChoice": "Off", + "OpenSubtitlesChoice": "OpenSubtitles", "settings": { "backlink": "Custom subtitles", "delay": "Subtitle delay", diff --git a/src/components/player/atoms/Settings.tsx b/src/components/player/atoms/Settings.tsx index f3947d7f..9d45a559 100644 --- a/src/components/player/atoms/Settings.tsx +++ b/src/components/player/atoms/Settings.tsx @@ -62,7 +62,7 @@ function SettingsOverlay({ id }: { id: string }) { id={id} path="/captions/opensubtitles" width={343} - height={450} + height={431} > diff --git a/src/components/player/atoms/settings/CaptionsView.tsx b/src/components/player/atoms/settings/CaptionsView.tsx index 07b5707f..3d669db6 100644 --- a/src/components/player/atoms/settings/CaptionsView.tsx +++ b/src/components/player/atoms/settings/CaptionsView.tsx @@ -29,6 +29,7 @@ export function CaptionOption(props: { loading?: boolean; onClick?: () => void; error?: React.ReactNode; + chevron?: boolean; }) { return ( onDrop(event)} > -
+
-
+ router.navigate("/captions/opensubtitles")} + selected={useSubtitleStore((s) => s.isOpenSubtitles)} + chevron + > + {t("player.menus.subtitles.OpenSubtitlesChoice")} + {content} diff --git a/src/components/player/atoms/settings/opensubtitles.tsx b/src/components/player/atoms/settings/opensubtitles.tsx index eb5fca02..2fab45aa 100644 --- a/src/components/player/atoms/settings/opensubtitles.tsx +++ b/src/components/player/atoms/settings/opensubtitles.tsx @@ -127,33 +127,8 @@ export function OpenSubtitlesCaptionView({ id }: { id: string }) { return ( <>
-
-
- - - {t("player.menus.subtitles.dropSubtitleFile")} - -
-
- - router.navigate("/captions")} - rightSide={ - - } - > - {t("player.menus.subtitles.title")} + router.navigate("/captions")}> + {t("player.menus.subtitles.OpenSubtitlesChoice")}
diff --git a/src/components/player/hooks/useCaptions.ts b/src/components/player/hooks/useCaptions.ts index 4bbdae4f..52184058 100644 --- a/src/components/player/hooks/useCaptions.ts +++ b/src/components/player/hooks/useCaptions.ts @@ -19,6 +19,7 @@ export function useCaptions() { ); const setCaption = usePlayerStore((s) => s.setCaption); const lastSelectedLanguage = useSubtitleStore((s) => s.lastSelectedLanguage); + const setIsOpenSubtitles = useSubtitleStore((s) => s.setIsOpenSubtitles); const captionList = usePlayerStore((s) => s.captionList); const getHlsCaptionList = usePlayerStore((s) => s.display?.getCaptionList); @@ -77,11 +78,13 @@ export function useCaptions() { captionToSet.srtData = srtData; } + setIsOpenSubtitles(!!caption.opensubtitles); setCaption(captionToSet); resetSubtitleSpecificSettings(); setLanguage(caption.language); }, [ + setIsOpenSubtitles, setLanguage, captions, setCaption, @@ -101,9 +104,10 @@ export function useCaptions() { ); const disable = useCallback(async () => { + setIsOpenSubtitles(false); setCaption(null); setLanguage(null); - }, [setCaption, setLanguage]); + }, [setCaption, setLanguage, setIsOpenSubtitles]); const selectLastUsedLanguage = useCallback(async () => { const language = lastSelectedLanguage ?? "en"; diff --git a/src/components/player/internals/ContextMenu/Links.tsx b/src/components/player/internals/ContextMenu/Links.tsx index 616647a9..9b49db88 100644 --- a/src/components/player/internals/ContextMenu/Links.tsx +++ b/src/components/player/internals/ContextMenu/Links.tsx @@ -123,14 +123,34 @@ export function SelectableLink(props: { children?: ReactNode; disabled?: boolean; error?: ReactNode; + chevron?: boolean; }) { let rightContent; if (props.selected) { + if (props.chevron) { + rightContent = ( + + + + + ); + } else { + rightContent = ( + + ); + } + } else if (props.chevron) { rightContent = ( - + ); } if (props.error) diff --git a/src/stores/subtitles/index.ts b/src/stores/subtitles/index.ts index eaac0cb2..fab66644 100644 --- a/src/stores/subtitles/index.ts +++ b/src/stores/subtitles/index.ts @@ -36,11 +36,13 @@ export interface SubtitleStore { }; enabled: boolean; lastSelectedLanguage: string | null; + isOpenSubtitles: boolean; styling: SubtitleStyling; overrideCasing: boolean; delay: number; updateStyling(newStyling: Partial): void; setLanguage(language: string | null): void; + setIsOpenSubtitles(isOpenSubtitles: boolean): void; setCustomSubs(): void; setOverrideCasing(enabled: boolean): void; setDelay(delay: number): void; @@ -56,6 +58,7 @@ export const useSubtitleStore = create( lastSelectedLanguage: null, }, lastSelectedLanguage: null, + isOpenSubtitles: false, overrideCasing: false, delay: 0, styling: { @@ -96,6 +99,11 @@ export const useSubtitleStore = create( if (lang) s.lastSelectedLanguage = lang; }); }, + setIsOpenSubtitles(isOpenSubtitles) { + set((s) => { + s.isOpenSubtitles = isOpenSubtitles; + }); + }, setCustomSubs() { set((s) => { s.enabled = true;