refactor(translate): migrate auto copy preference setting to usePreference

Move auto copy setting from redux store to preference system for better consistency

packages/shared/data/preference/preferenceSchemas.ts

@@ -395,6 +395,8 @@ export interface PreferenceSchemas {
     'topic.tab.show': boolean
     // redux/settings/showTopicTime
     'topic.tab.show_time': boolean
+    // redux/translate/settings
+    'translate.settings.auto_copy': boolean
     // redux/settings/customCss
     'ui.custom_css': string
     // redux/settings/navbarPosition
@@ -654,6 +656,7 @@ export const DefaultPreferences: PreferenceSchemas = {
     'topic.tab.pin_to_top': false,
     'topic.tab.show': true,
     'topic.tab.show_time': false,
+    'translate.settings.auto_copy': false,
     'ui.custom_css': '',
     'ui.navbar.position': 'top',
     'ui.sidebar.icons.invisible': [],

src/renderer/src/hooks/useTranslate.ts

@@ -1,14 +1,10 @@
 import { usePreference } from '@data/hooks/usePreference'
 import { loggerService } from '@logger'
 import { builtinLanguages, UNKNOWN } from '@renderer/config/translate'
-import { useAppSelector } from '@renderer/store'
-import type { TranslateState } from '@renderer/store/translate'
-import { updateSettings } from '@renderer/store/translate'
 import type { TranslateLanguage } from '@renderer/types'
 import { runAsyncFunction } from '@renderer/utils'
 import { getTranslateOptions } from '@renderer/utils/translate'
 import { useCallback, useEffect, useState } from 'react'
-import { useDispatch } from 'react-redux'
 
 const logger = loggerService.withContext('useTranslate')
 
@@ -21,12 +17,9 @@ const logger = loggerService.withContext('useTranslate')
  */
 export default function useTranslate() {
   const [prompt] = usePreference('feature.translate.model_prompt')
-  const settings = useAppSelector((state) => state.translate.settings)
   const [translateLanguages, setTranslateLanguages] = useState<TranslateLanguage[]>(builtinLanguages)
   const [isLoaded, setIsLoaded] = useState(false)
 
-  const dispatch = useDispatch()
-
   useEffect(() => {
     runAsyncFunction(async () => {
       const options = await getTranslateOptions()
@@ -53,18 +46,9 @@ export default function useTranslate() {
     [isLoaded, translateLanguages]
   )
 
-  const handleUpdateSettings = useCallback(
-    (update: Partial<TranslateState['settings']>) => {
-      dispatch(updateSettings(update))
-    },
-    [dispatch]
-  )
-
   return {
     prompt,
-    settings,
     translateLanguages,
-    getLanguageByLangcode,
-    updateSettings: handleUpdateSettings
+    getLanguageByLangcode
   }
 }

src/renderer/src/pages/translate/TranslatePage.tsx

@@ -1,6 +1,7 @@
 import { PlusOutlined, SendOutlined, SwapOutlined } from '@ant-design/icons'
 import { Button, Flex, Tooltip } from '@cherrystudio/ui'
 import { useCache } from '@data/hooks/useCache'
+import { usePreference } from '@data/hooks/usePreference'
 import { loggerService } from '@logger'
 import { Navbar, NavbarCenter } from '@renderer/components/app/Navbar'
 import { CopyIcon } from '@renderer/components/Icons'
@@ -63,8 +64,8 @@ const TranslatePage: FC = () => {
   // hooks
   const { t } = useTranslation()
   const { translateModel, setTranslateModel } = useDefaultModel()
-  const { prompt, getLanguageByLangcode, settings } = useTranslate()
-  const { autoCopy } = settings
+  const { prompt, getLanguageByLangcode } = useTranslate()
+  const [autoCopy] = usePreference('translate.settings.auto_copy')
   const { shikiMarkdownIt } = useCodeStyle()
   const { onSelectFile, selecting, clearFiles } = useFiles({ extensions: [...imageExts, ...textExts] })
   const { ocr } = useOcr()

src/renderer/src/pages/translate/TranslateSettings.tsx

@@ -1,4 +1,5 @@
 import { Button, ColFlex, Flex, HelpTooltip, RowFlex, Switch, Tooltip } from '@cherrystudio/ui'
+import { usePreference } from '@data/hooks/usePreference'
 import LanguageSelect from '@renderer/components/LanguageSelect'
 import db from '@renderer/databases'
 import useTranslate from '@renderer/hooks/useTranslate'
@@ -41,8 +42,8 @@ const TranslateSettings: FC<{
 }) => {
   const { t } = useTranslation()
   const [localPair, setLocalPair] = useState<[TranslateLanguage, TranslateLanguage]>(bidirectionalPair)
-  const { getLanguageByLangcode, settings, updateSettings } = useTranslate()
-  const { autoCopy } = settings
+  const { getLanguageByLangcode } = useTranslate()
+  const [autoCopy, setAutoCopy] = usePreference('translate.settings.auto_copy')
 
   useEffect(() => {
     setLocalPair(bidirectionalPair)
@@ -83,7 +84,7 @@ const TranslateSettings: FC<{
               isSelected={autoCopy}
               color="primary"
               onValueChange={(isSelected) => {
-                updateSettings({ autoCopy: isSelected })
+                setAutoCopy(isSelected)
               }}
             />
           </RowFlex>