From 1febd78f2b5399aff98fbd027882b99e48036d78 Mon Sep 17 00:00:00 2001 From: Pas <74743263+Pasithea0@users.noreply.github.com> Date: Sun, 19 Jan 2025 00:47:32 -0700 Subject: [PATCH] Add reorder sources toggle Require reorder sources to be enabled first --- src/assets/locales/en.json | 5 ++- src/hooks/useProviderScrape.tsx | 5 ++- src/hooks/useSettingsState.ts | 16 ++++++- src/pages/Settings.tsx | 10 +++++ src/pages/parts/settings/PreferencesPart.tsx | 45 ++++++++++++++------ src/stores/preferences/index.tsx | 8 ++++ 6 files changed, 72 insertions(+), 17 deletions(-) diff --git a/src/assets/locales/en.json b/src/assets/locales/en.json index 3e5cc37f..37e12009 100644 --- a/src/assets/locales/en.json +++ b/src/assets/locales/en.json @@ -666,11 +666,12 @@ "autoplayDescription": "Automatically play the next episode in a series after reaching the end. Can be enabled by users with the browser extension, a custom proxy, or with the default setup if allowed by the host.", "autoplayLabel": "Autoplay", "sourceOrder": "Reordering sources", - "sourceOrderDescription": "Drag and drop to reorder sources. This will determine the order in which sources are checked for the media you are trying to watch. If a source is greyed out, it means the extension is required for that source.", + "sourceOrderDescription": "Drag and drop to reorder sources. This will determine the order in which sources are checked for the media you are trying to watch. If a source is greyed out, it means the extension is required for that source.

(The default order is best for most users)", "title": "Preferences", "discover": "Discover section", "discoverDescription": "Show the Discover section on the Homepage below your bookmarked media. Enabling this can increase load times. This setting is enabled by default.", - "discoverLabel": "Discover section" + "discoverLabel": "Discover section", + "sourceOrderEnableLabel": "Custom source order" }, "reset": "Reset", "save": "Save", diff --git a/src/hooks/useProviderScrape.tsx b/src/hooks/useProviderScrape.tsx index e83973e2..b18d6d57 100644 --- a/src/hooks/useProviderScrape.tsx +++ b/src/hooks/useProviderScrape.tsx @@ -158,6 +158,7 @@ export function useScrape() { } = useBaseScrape(); const preferredSourceOrder = usePreferencesStore((s) => s.sourceOrder); + const enableSourceOrder = usePreferencesStore((s) => s.enableSourceOrder); const startScraping = useCallback( async (media: ScrapeMedia) => { @@ -184,7 +185,8 @@ export function useScrape() { const providers = getProviders(); const output = await providers.runAll({ media, - sourceOrder: preferredSourceOrder, + // Only pass sourceOrder if enableSourceOrder is true + sourceOrder: enableSourceOrder ? preferredSourceOrder : undefined, events: { init: initEvent, start: startEvent, @@ -204,6 +206,7 @@ export function useScrape() { getResult, startScrape, preferredSourceOrder, + enableSourceOrder, ], ); diff --git a/src/hooks/useSettingsState.ts b/src/hooks/useSettingsState.ts index 0e5e4128..fa8bbbe7 100644 --- a/src/hooks/useSettingsState.ts +++ b/src/hooks/useSettingsState.ts @@ -54,6 +54,7 @@ export function useSettingsState( enableAutoplay: boolean, enableDiscover: boolean, sourceOrder: string[], + enableSourceOrder: boolean, ) { const [proxyUrlsState, setProxyUrls, resetProxyUrls, proxyUrlsChanged] = useDerived(proxyUrls); @@ -105,6 +106,12 @@ export function useSettingsState( resetSourceOrder, sourceOrderChanged, ] = useDerived(sourceOrder); + const [ + enableSourceOrderState, + setenableSourceOrderState, + resetenableSourceOrder, + enableSourceOrderChanged, + ] = useDerived(enableSourceOrder); function reset() { resetTheme(); @@ -119,6 +126,7 @@ export function useSettingsState( resetEnableAutoplay(); resetEnableDiscover(); resetSourceOrder(); + resetenableSourceOrder(); } const changed = @@ -132,7 +140,8 @@ export function useSettingsState( enableThumbnailsChanged || enableAutoplayChanged || enableDiscoverChanged || - sourceOrderChanged; + sourceOrderChanged || + enableSourceOrderChanged; return { reset, @@ -192,5 +201,10 @@ export function useSettingsState( set: setSourceOrderState, changed: sourceOrderChanged, }, + enableSourceOrder: { + state: enableSourceOrderState, + set: setenableSourceOrderState, + changed: enableSourceOrderChanged, + }, }; } diff --git a/src/pages/Settings.tsx b/src/pages/Settings.tsx index c3cc2217..b3a955e2 100644 --- a/src/pages/Settings.tsx +++ b/src/pages/Settings.tsx @@ -143,6 +143,11 @@ export function SettingsPage() { const enableDiscover = usePreferencesStore((s) => s.enableDiscover); const setEnableDiscover = usePreferencesStore((s) => s.setEnableDiscover); + const enableSourceOrder = usePreferencesStore((s) => s.enableSourceOrder); + const setenableSourceOrder = usePreferencesStore( + (s) => s.setenableSourceOrder, + ); + const account = useAuthStore((s) => s.account); const updateProfile = useAuthStore((s) => s.setAccountProfile); const updateDeviceName = useAuthStore((s) => s.updateDeviceName); @@ -168,6 +173,7 @@ export function SettingsPage() { enableAutoplay, enableDiscover, sourceOrder, + enableSourceOrder, ); const availableSources = useMemo(() => { @@ -243,6 +249,7 @@ export function SettingsPage() { setTheme(state.theme.state); setSubStyling(state.subtitleStyling.state); setProxySet(state.proxyUrls.state?.filter((v) => v !== "") ?? null); + setenableSourceOrder(state.enableSourceOrder.state); if (state.profile.state) { updateProfile(state.profile.state); @@ -275,6 +282,7 @@ export function SettingsPage() { updateProfile, logout, setBackendUrl, + setenableSourceOrder, ]); return ( @@ -321,6 +329,8 @@ export function SettingsPage() { setEnableDiscover={state.enableDiscover.set} sourceOrder={availableSources} setSourceOrder={state.sourceOrder.set} + enableSourceOrder={state.enableSourceOrder.state} + setenableSourceOrder={state.enableSourceOrder.set} />
diff --git a/src/pages/parts/settings/PreferencesPart.tsx b/src/pages/parts/settings/PreferencesPart.tsx index a5aff8cf..5827c48d 100644 --- a/src/pages/parts/settings/PreferencesPart.tsx +++ b/src/pages/parts/settings/PreferencesPart.tsx @@ -25,6 +25,8 @@ export function PreferencesPart(props: { setSourceOrder: (v: string[]) => void; enableDiscover: boolean; setEnableDiscover: (v: boolean) => void; + enableSourceOrder: boolean; + setenableSourceOrder: (v: boolean) => void; }) { const { t } = useTranslation(); const sorted = sortLangCodes(appLanguageOptions.map((item) => item.code)); @@ -162,21 +164,38 @@ export function PreferencesPart(props: { ), }} /> +
+ props.setenableSourceOrder(!props.enableSourceOrder) + } + className="bg-dropdown-background hover:bg-dropdown-hoverBackground select-none my-4 cursor-pointer space-x-3 flex items-center max-w-[25rem] py-3 px-4 rounded-lg" + > + +

+ {t("settings.preferences.sourceOrderEnableLabel")} +

+
- - props.setSourceOrder(items.map((item) => item.id)) - } - /> - + {props.enableSourceOrder && ( +
+ + props.setSourceOrder(items.map((item) => item.id)) + } + /> + +
+ )} diff --git a/src/stores/preferences/index.tsx b/src/stores/preferences/index.tsx index 25831ae9..74744c2d 100644 --- a/src/stores/preferences/index.tsx +++ b/src/stores/preferences/index.tsx @@ -7,11 +7,13 @@ export interface PreferencesStore { enableAutoplay: boolean; enableDiscover: boolean; sourceOrder: string[]; + enableSourceOrder: boolean; setEnableThumbnails(v: boolean): void; setEnableAutoplay(v: boolean): void; setEnableDiscover(v: boolean): void; setSourceOrder(v: string[]): void; + setenableSourceOrder(v: boolean): void; } export const usePreferencesStore = create( @@ -21,6 +23,7 @@ export const usePreferencesStore = create( enableAutoplay: true, enableDiscover: true, sourceOrder: [], + enableSourceOrder: false, setEnableThumbnails(v) { set((s) => { s.enableThumbnails = v; @@ -41,6 +44,11 @@ export const usePreferencesStore = create( s.sourceOrder = v; }); }, + setenableSourceOrder(v) { + set((s) => { + s.enableSourceOrder = v; + }); + }, })), { name: "__MW::preferences",