From cd02f6d7a3be25dc2a3eb6ee7d3898148328e90b Mon Sep 17 00:00:00 2001 From: Ashutosh Shinde Date: Sat, 6 Jan 2024 13:40:04 +0530 Subject: [PATCH 1/9] fixed #614 multiple captions of the same language all appeared as selected when selecting only one --- .../player/atoms/settings/CaptionsView.tsx | 23 ++++++++++--------- .../player/display/displayInterface.ts | 1 + src/components/player/hooks/useCaptions.ts | 19 +++++++++++++++ src/components/player/utils/captions.ts | 1 + src/stores/player/slices/source.ts | 2 ++ 5 files changed, 35 insertions(+), 11 deletions(-) diff --git a/src/components/player/atoms/settings/CaptionsView.tsx b/src/components/player/atoms/settings/CaptionsView.tsx index dc9a112f..3d89655d 100644 --- a/src/components/player/atoms/settings/CaptionsView.tsx +++ b/src/components/player/atoms/settings/CaptionsView.tsx @@ -75,6 +75,7 @@ function CustomCaptionOption() { setCaption({ language: "custom", srtData: converted, + id: "custom-caption", }); setCustomSubs(); }); @@ -115,22 +116,22 @@ function useSubtitleList(subs: CaptionListItem[], searchQuery: string) { export function CaptionsView({ id }: { id: string }) { const { t } = useTranslation(); const router = useOverlayRouter(id); - const lang = usePlayerStore((s) => s.caption.selected?.language); + const selectedCaptionId = usePlayerStore((s) => s.caption.selected?.id); const [currentlyDownloading, setCurrentlyDownloading] = useState< string | null >(null); - const { selectLanguage, disable } = useCaptions(); + const { selectCaptionById, disable } = useCaptions(); const captionList = usePlayerStore((s) => s.captionList); const [searchQuery, setSearchQuery] = useState(""); const subtitleList = useSubtitleList(captionList, searchQuery); const [downloadReq, startDownload] = useAsyncFn( - async (language: string) => { - setCurrentlyDownloading(language); - return selectLanguage(language); + async (captionId: string) => { + setCurrentlyDownloading(captionId); + return selectCaptionById(captionId); }, - [selectLanguage, setCurrentlyDownloading], + [selectCaptionById, setCurrentlyDownloading], ); const content = subtitleList.map((v, i) => { @@ -140,14 +141,14 @@ export function CaptionsView({ id }: { id: string }) { // eslint-disable-next-line react/no-array-index-key key={`${i}-${v.url}`} countryCode={v.language} - selected={lang === v.language} - loading={v.language === currentlyDownloading && downloadReq.loading} + selected={v.id === selectedCaptionId} + loading={v.id === currentlyDownloading && downloadReq.loading} error={ - v.language === currentlyDownloading && downloadReq.error + v.id === currentlyDownloading && downloadReq.error ? downloadReq.error.toString() : undefined } - onClick={() => startDownload(v.language)} + onClick={() => startDownload(v.id)} > {v.languageName} @@ -176,7 +177,7 @@ export function CaptionsView({ id }: { id: string }) { - disable()} selected={!lang}> + disable()} selected={!selectedCaptionId}> {t("player.menus.subtitles.offChoice")} diff --git a/src/components/player/display/displayInterface.ts b/src/components/player/display/displayInterface.ts index 604bdeca..8ba8480a 100644 --- a/src/components/player/display/displayInterface.ts +++ b/src/components/player/display/displayInterface.ts @@ -41,6 +41,7 @@ export interface DisplayMeta { } export interface DisplayCaption { + id: string; srtData: string; language: string; url?: string; diff --git a/src/components/player/hooks/useCaptions.ts b/src/components/player/hooks/useCaptions.ts index 9f96c41c..0f79aa51 100644 --- a/src/components/player/hooks/useCaptions.ts +++ b/src/components/player/hooks/useCaptions.ts @@ -14,12 +14,30 @@ export function useCaptions() { const lastSelectedLanguage = useSubtitleStore((s) => s.lastSelectedLanguage); const captionList = usePlayerStore((s) => s.captionList); + const selectCaptionById = useCallback( + async (captionId: string) => { + const caption = captionList.find((v) => v.id === captionId); + if (!caption) return; + const srtData = await downloadCaption(caption); + setCaption({ + id: caption.id, + language: caption.language, + srtData, + url: caption.url, + }); + resetSubtitleSpecificSettings(); + setLanguage(caption.language); + }, + [setLanguage, captionList, setCaption, resetSubtitleSpecificSettings], + ); + const selectLanguage = useCallback( async (language: string) => { const caption = captionList.find((v) => v.language === language); if (!caption) return; const srtData = await downloadCaption(caption); setCaption({ + id: caption.id, language: caption.language, srtData, url: caption.url, @@ -56,5 +74,6 @@ export function useCaptions() { selectLastUsedLanguage, toggleLastUsed, selectLastUsedLanguageIfEnabled, + selectCaptionById, }; } diff --git a/src/components/player/utils/captions.ts b/src/components/player/utils/captions.ts index abccee9f..bc2079db 100644 --- a/src/components/player/utils/captions.ts +++ b/src/components/player/utils/captions.ts @@ -80,6 +80,7 @@ export function convertProviderCaption( captions: RunOutput["stream"]["captions"], ): CaptionListItem[] { return captions.map((v) => ({ + id: v.id, language: v.language, url: v.url, needsProxy: v.hasCorsRestrictions, diff --git a/src/stores/player/slices/source.ts b/src/stores/player/slices/source.ts index 56e84f74..1e26abc2 100644 --- a/src/stores/player/slices/source.ts +++ b/src/stores/player/slices/source.ts @@ -42,12 +42,14 @@ export interface PlayerMeta { } export interface Caption { + id: string; language: string; url?: string; srtData: string; } export interface CaptionListItem { + id: string; language: string; url: string; needsProxy: boolean; From 32dd68c90e0965c0321aa5c8f16446d73703c3ea Mon Sep 17 00:00:00 2001 From: Ashutosh Shinde Date: Sat, 6 Jan 2024 23:18:54 +0530 Subject: [PATCH 2/9] updated CaptionOption key to use caption id instead of index and url in CaptionView --- src/components/player/atoms/settings/CaptionsView.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/player/atoms/settings/CaptionsView.tsx b/src/components/player/atoms/settings/CaptionsView.tsx index 3d89655d..09ab5685 100644 --- a/src/components/player/atoms/settings/CaptionsView.tsx +++ b/src/components/player/atoms/settings/CaptionsView.tsx @@ -138,8 +138,7 @@ export function CaptionsView({ id }: { id: string }) { return ( Date: Sat, 6 Jan 2024 23:19:06 +0530 Subject: [PATCH 3/9] updated selectLanguage callback to call selectCaptionById after searching for correct caption --- src/components/player/hooks/useCaptions.ts | 12 ++---------- 1 file changed, 2 insertions(+), 10 deletions(-) diff --git a/src/components/player/hooks/useCaptions.ts b/src/components/player/hooks/useCaptions.ts index 0f79aa51..424edcad 100644 --- a/src/components/player/hooks/useCaptions.ts +++ b/src/components/player/hooks/useCaptions.ts @@ -35,17 +35,9 @@ export function useCaptions() { async (language: string) => { const caption = captionList.find((v) => v.language === language); if (!caption) return; - const srtData = await downloadCaption(caption); - setCaption({ - id: caption.id, - language: caption.language, - srtData, - url: caption.url, - }); - resetSubtitleSpecificSettings(); - setLanguage(language); + selectCaptionById(caption.id); }, - [setLanguage, captionList, setCaption, resetSubtitleSpecificSettings], + [captionList, selectCaptionById], ); const disable = useCallback(async () => { From 803668b49289effa63b11ef95e023156e7340f2b Mon Sep 17 00:00:00 2001 From: Ashutosh Shinde Date: Tue, 9 Jan 2024 10:43:20 +0530 Subject: [PATCH 4/9] added return value of selectCaptionById from selectLanguage function --- src/components/player/hooks/useCaptions.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/player/hooks/useCaptions.ts b/src/components/player/hooks/useCaptions.ts index 424edcad..458c704a 100644 --- a/src/components/player/hooks/useCaptions.ts +++ b/src/components/player/hooks/useCaptions.ts @@ -35,7 +35,7 @@ export function useCaptions() { async (language: string) => { const caption = captionList.find((v) => v.language === language); if (!caption) return; - selectCaptionById(caption.id); + return selectCaptionById(caption.id); }, [captionList, selectCaptionById], ); From dc67ef0c3a8867c1555e9d847862ae1703cfdd96 Mon Sep 17 00:00:00 2001 From: Astrid Date: Tue, 9 Jan 2024 20:50:27 +0100 Subject: [PATCH 5/9] remove unused vars --- src/pages/parts/auth/AccountCreatePart.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/pages/parts/auth/AccountCreatePart.tsx b/src/pages/parts/auth/AccountCreatePart.tsx index 674a3be6..6f8b9ad4 100644 --- a/src/pages/parts/auth/AccountCreatePart.tsx +++ b/src/pages/parts/auth/AccountCreatePart.tsx @@ -5,7 +5,6 @@ import { Avatar } from "@/components/Avatar"; import { Button } from "@/components/buttons/Button"; import { ColorPicker, initialColor } from "@/components/form/ColorPicker"; import { IconPicker, initialIcon } from "@/components/form/IconPicker"; -import { Icon, Icons } from "@/components/Icon"; import { LargeCard, LargeCardButtons, From dec967418bcf1b9ba5efb5ca32de623f1ec89852 Mon Sep 17 00:00:00 2001 From: Astrid Date: Tue, 9 Jan 2024 20:50:45 +0100 Subject: [PATCH 6/9] Mark cursor-not-allowed as important so that cursor-pointer gets overridden --- src/components/buttons/Button.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/buttons/Button.tsx b/src/components/buttons/Button.tsx index ed0eebf8..70e2c780 100644 --- a/src/components/buttons/Button.tsx +++ b/src/components/buttons/Button.tsx @@ -41,7 +41,7 @@ export function Button(props: Props) { props.padding ?? "px-4 py-3", props.className, colorClasses, - props.disabled ? "cursor-not-allowed bg-opacity-60 text-opacity-60" : null, + props.disabled ? "!cursor-not-allowed bg-opacity-60 text-opacity-60" : null, ); if (props.disabled) From ffea08f3d93a936f4cf2de5a37649bc37512ae0c Mon Sep 17 00:00:00 2001 From: William Oldham Date: Tue, 9 Jan 2024 21:02:39 +0000 Subject: [PATCH 7/9] Remove ARM-32 bit from Docker build --- .github/workflows/deploying.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/deploying.yml b/.github/workflows/deploying.yml index ebf9d131..e07a60a5 100644 --- a/.github/workflows/deploying.yml +++ b/.github/workflows/deploying.yml @@ -173,7 +173,7 @@ jobs: uses: docker/build-push-action@v5 with: push: true - platforms: linux/amd64,linux/arm64,linux/arm + platforms: linux/amd64,linux/arm64 context: . labels: ${{ steps.meta.outputs.labels }} tags: ${{ steps.meta.outputs.tags }} From caa82e15a3d5bc2c5eb3e9f3b710b90278d65281 Mon Sep 17 00:00:00 2001 From: Isra Date: Tue, 9 Jan 2024 21:14:03 -0600 Subject: [PATCH 8/9] Instructions --- src/assets/locales/en.json | 4 ++-- src/pages/parts/settings/ConnectionsPart.tsx | 11 ++++++++--- 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/src/assets/locales/en.json b/src/assets/locales/en.json index 9329ec0e..425f6c32 100644 --- a/src/assets/locales/en.json +++ b/src/assets/locales/en.json @@ -393,14 +393,14 @@ }, "connections": { "server": { - "description": "If you would like to connect to a custom backend to store your data, enable this and provide the URL.", + "description": "If you would like to connect to a custom backend to store your data, enable this and provide the URL. <0>Instructions.", "label": "Custom server", "urlLabel": "Custom server URL" }, "title": "Connections", "workers": { "addButton": "Add new worker", - "description": "To make the application function, all traffic is routed through proxies. Enable this if you want to bring your own workers.", + "description": "To make the application function, all traffic is routed through proxies. Enable this if you want to bring your own workers. <0>Instructions.", "emptyState": "No workers yet, add one below", "label": "Use custom proxy workers", "urlLabel": "Worker URLs", diff --git a/src/pages/parts/settings/ConnectionsPart.tsx b/src/pages/parts/settings/ConnectionsPart.tsx index 007a6220..11aa8171 100644 --- a/src/pages/parts/settings/ConnectionsPart.tsx +++ b/src/pages/parts/settings/ConnectionsPart.tsx @@ -1,10 +1,11 @@ import { Dispatch, SetStateAction, useCallback } from "react"; -import { useTranslation } from "react-i18next"; +import { Trans, useTranslation } from "react-i18next"; import { Button } from "@/components/buttons/Button"; import { Toggle } from "@/components/buttons/Toggle"; import { Icon, Icons } from "@/components/Icon"; import { SettingsCard } from "@/components/layout/SettingsCard"; +import { MwLink } from "@/components/text/Link"; import { AuthInputBox } from "@/components/text-inputs/AuthInputBox"; import { Divider } from "@/components/utils/Divider"; import { Heading1 } from "@/components/utils/Text"; @@ -52,7 +53,9 @@ function ProxyEdit({ proxyUrls, setProxyUrls }: ProxyEditProps) { {t("settings.connections.workers.label")}

- {t("settings.connections.workers.description")} + + Google +

@@ -118,7 +121,9 @@ function BackendEdit({ backendUrl, setBackendUrl }: BackendEditProps) { {t("settings.connections.server.label")}

- {t("settings.connections.server.description")} + + Google +

From b11a7016be6874956a5f33e4d25ad90cc3064ab4 Mon Sep 17 00:00:00 2001 From: Isra Date: Tue, 9 Jan 2024 21:18:41 -0600 Subject: [PATCH 9/9] Actual links --- src/pages/parts/settings/ConnectionsPart.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/src/pages/parts/settings/ConnectionsPart.tsx b/src/pages/parts/settings/ConnectionsPart.tsx index 11aa8171..e9183764 100644 --- a/src/pages/parts/settings/ConnectionsPart.tsx +++ b/src/pages/parts/settings/ConnectionsPart.tsx @@ -54,7 +54,9 @@ function ProxyEdit({ proxyUrls, setProxyUrls }: ProxyEditProps) {

- Google + + Proxy documentation +

@@ -122,7 +124,9 @@ function BackendEdit({ backendUrl, setBackendUrl }: BackendEditProps) {

- Google + + Backend documentation +