分集图片设置落库

web/src/components/useManualScrapeDialogState.ts

@@ -2,6 +2,7 @@ import { useCallback, useEffect, useMemo, useState, type Dispatch, type SetState
 import toast from 'react-hot-toast'
 
 import { mediaAPI, type ManualScrapeCandidate } from '../api/library'
+import { useEpisodeArtworkPreference } from '../hooks/useEpisodeArtworkPreference'
 import type { Media } from '../types'
 import {
   candidateKey,
@@ -103,7 +104,7 @@ export function useManualScrapeDialogState({
 function useManualScrapeFormState() {
   const [query, setQuery] = useState('')
   const [selectedProviders, setSelectedProviders] = useState<string[]>([])
-  const [includeEpisodeArtwork, setIncludeEpisodeArtwork] = useState(false)
+  const [includeEpisodeArtwork, setIncludeEpisodeArtwork] = useEpisodeArtworkPreference()
   const [searching, setSearching] = useState(false)
   const [applyingKey, setApplyingKey] = useState('')
   const [items, setItems] = useState<ManualScrapeCandidate[]>([])

web/src/hooks/useEpisodeArtworkPreference.ts

@@ -0,0 +1,53 @@
+import { useCallback, useEffect, useRef, useState, type Dispatch, type SetStateAction } from 'react'
+import toast from 'react-hot-toast'
+
+import { adminAPI } from '../api/admin'
+
+const SETTING_KEY = 'scrape.episode_images'
+
+// This is an instance-wide scraper preference. The existing admin settings
+// endpoint stores it in the Setting table, so it follows the server instead
+// of a particular browser.
+export function useEpisodeArtworkPreference(): [boolean, Dispatch<SetStateAction<boolean>>] {
+  const [enabled, setEnabledState] = useState(false)
+  const enabledRef = useRef(false)
+  const changedLocally = useRef(false)
+  const saveQueue = useRef(Promise.resolve())
+
+  useEffect(() => {
+    let active = true
+    adminAPI.listSettings()
+      .then((settings) => {
+        if (!active || changedLocally.current) return
+        const value = settings.find((setting) => setting.key === SETTING_KEY)?.value
+        const next = value === 'true' || value === '1'
+        enabledRef.current = next
+        setEnabledState(next)
+      })
+      .catch(() => {
+        if (active) {
+          toast.error('读取每集图片设置失败')
+        }
+      })
+    return () => {
+      active = false
+    }
+  }, [])
+
+  const setEnabled = useCallback((nextValue: SetStateAction<boolean>) => {
+    const next = typeof nextValue === 'function' ? nextValue(enabledRef.current) : nextValue
+    if (enabledRef.current === next) return
+    changedLocally.current = true
+    enabledRef.current = next
+    setEnabledState(next)
+
+    saveQueue.current = saveQueue.current
+      .catch(() => undefined)
+      .then(() => adminAPI.updateSetting(SETTING_KEY, String(next)))
+      .catch(() => {
+        toast.error('保存每集图片设置失败')
+      })
+  }, [])
+
+  return [enabled, setEnabled]
+}

web/src/pages/LibrariesPage.tsx

@@ -3,6 +3,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { libraryAPI } from '../api/library'
 import { toolsAPI } from '../api/tools'
 import { openManageLibrariesDialog } from '../components/manageLibrariesDialog'
+import { useEpisodeArtworkPreference } from '../hooks/useEpisodeArtworkPreference'
 import { usePinnedLibraries } from '../hooks/usePinnedLibraries'
 import {
   LibrariesContent,
@@ -21,7 +22,7 @@ export function LibrariesPage() {
   const { pinnedIds, loading: pinnedLoading, togglePin } = usePinnedLibraries()
   const [loading, setLoading] = useState(true)
   const [repairing, setRepairing] = useState(false)
-  const [repairEpisodeArtwork, setRepairEpisodeArtwork] = useState(false)
+  const [repairEpisodeArtwork, setRepairEpisodeArtwork] = useEpisodeArtworkPreference()
   const [repairMsg, setRepairMsg] = useState('')
 
   const fetchedLibIdsRef = useRef<Set<string>>(new Set())

web/src/pages/useLibraryAdminActions.tsx

@@ -6,6 +6,7 @@ import { libraryAPI } from '../api/library'
 import { mediaAPI } from '../api/library'
 import { toolsAPI } from '../api/tools'
 import { confirmAction, confirmActionResult } from '../components/confirmAction'
+import { useEpisodeArtworkPreference } from '../hooks/useEpisodeArtworkPreference'
 import type { Library, Media } from '../types'
 import { seriesTitle, type SeriesCard } from '../utils/groupSeries'
 import { LibraryMovieActions } from './LibraryMovieActions'
@@ -33,7 +34,7 @@ export function useLibraryAdminActions({
   setManualMovie,
 }: UseLibraryAdminActionsOptions) {
   const [scraping, setScraping] = useState(false)
-  const [scrapeEpisodeArtwork, setScrapeEpisodeArtwork] = useState(false)
+  const [scrapeEpisodeArtwork, setScrapeEpisodeArtwork] = useEpisodeArtworkPreference()
   const [repairing, setRepairing] = useState(false)
   const [seriesToolBusy, setSeriesToolBusy] = useState('')
   const [movieToolBusy, setMovieToolBusy] = useState('')

web/src/pages/useMediaDetailPageState.ts

@@ -6,6 +6,7 @@ import { api } from '../api/client'
 import { mediaAPI } from '../api/library'
 import { playbackAPI } from '../api/playback'
 import { confirmActionResult } from '../components/confirmAction'
+import { useEpisodeArtworkPreference } from '../hooks/useEpisodeArtworkPreference'
 import type { Media } from '../types'
 import { mediaLibraryBackTarget } from './MediaDetailPageModel'
 
@@ -42,7 +43,7 @@ export function useMediaDetailPageState({ id, navigate }: MediaDetailPageStatePa
   const [manualScrapeOpen, setManualScrapeOpen] = useState(false)
   const [metadataEditOpen, setMetadataEditOpen] = useState(false)
   const [organizeOpen, setOrganizeOpen] = useState(false)
-  const [scrapeEpisodeArtwork, setScrapeEpisodeArtwork] = useState(false)
+  const [scrapeEpisodeArtwork, setScrapeEpisodeArtwork] = useEpisodeArtworkPreference()
 
   const refresh = useMediaDetailRefresh({
     id,