fix: missing ExportMenuOptions in persist leads to useSelector re-render a lot (#4593)

* fix: missing ExportMenuOptions in persist leads to useSelector re-render

* chore: cleanup

src/renderer/src/pages/home/Messages/MessageMenubar.tsx

@@ -70,20 +70,7 @@ const MessageMenubar: FC<Props> = (props) => {
 
   const isUserMessage = message.role === 'user'
 
-  const exportMenuOptions = useSelector(
-    (state: RootState) =>
-      state.settings.exportMenuOptions || {
-        image: true,
-        markdown: true,
-        markdown_reason: true,
-        notion: true,
-        yuque: true,
-        joplin: true,
-        obsidian: true,
-        siyuan: true,
-        docx: true
-      }
-  )
+  const exportMenuOptions = useSelector((state: RootState) => state.settings.exportMenuOptions)
 
   const onCopy = useCallback(
     (e: React.MouseEvent) => {

src/renderer/src/pages/home/Tabs/TopicsTab.tsx

@@ -156,20 +156,7 @@ const Topics: FC<Props> = ({ assistant: _assistant, activeTopic, setActiveTopic
     [setActiveTopic]
   )
 
-  const exportMenuOptions = useSelector(
-    (state: RootState) =>
-      state.settings.exportMenuOptions || {
-        image: true,
-        markdown: true,
-        markdown_reason: true,
-        notion: true,
-        yuque: true,
-        joplin: true,
-        obsidian: true,
-        siyuan: true,
-        docx: true
-      }
-  )
+  const exportMenuOptions = useSelector((state: RootState) => state.settings.exportMenuOptions)
 
   const getTopicMenuItems = useCallback(
     (topic: Topic) => {

src/renderer/src/pages/settings/DataSettings/ExportMenuSettings.tsx

@@ -13,20 +13,7 @@ const ExportMenuOptions: FC = () => {
   const { theme } = useTheme()
   const dispatch = useAppDispatch()
 
-  const exportMenuOptions = useSelector(
-    (state: RootState) =>
-      state.settings.exportMenuOptions || {
-        image: true,
-        markdown: true,
-        markdown_reason: true,
-        notion: true,
-        yuque: true,
-        joplin: true,
-        obsidian: true,
-        siyuan: true,
-        docx: true
-      }
-  )
+  const exportMenuOptions = useSelector((state: RootState) => state.settings.exportMenuOptions)
 
   const handleToggleOption = (option: string, checked: boolean) => {
     dispatch(

src/renderer/src/store/index.ts

@@ -42,7 +42,7 @@ const persistedReducer = persistReducer(
   {
     key: 'cherry-studio',
     storage,
-    version: 92,
+    version: 93,
     blacklist: ['runtime', 'messages'],
     migrate
   },

src/renderer/src/store/migrate.ts

@@ -13,7 +13,7 @@ import { createMigrate } from 'redux-persist'
 import { RootState } from '.'
 import { INITIAL_PROVIDERS, moveProvider } from './llm'
 import { mcpSlice } from './mcp'
-import { DEFAULT_SIDEBAR_ICONS } from './settings'
+import { DEFAULT_SIDEBAR_ICONS, initialState as settingsInitialState } from './settings'
 
 // remove logo base64 data to reduce the size of the state
 function removeMiniAppIconsFromState(state: RootState) {
@@ -1173,6 +1173,17 @@ const migrateConfig = {
     } catch (error) {
       return state
     }
+  },
+  '93': (state: RootState) => {
+    try {
+      if (!state?.settings?.exportMenuOptions) {
+        state.settings.exportMenuOptions = settingsInitialState.exportMenuOptions
+        return state
+      }
+      return state
+    } catch (error) {
+      return state
+    }
   }
 }
 

src/renderer/src/store/settings.ts

@@ -125,7 +125,7 @@ export interface SettingsState {
 
 export type MultiModelMessageStyle = 'horizontal' | 'vertical' | 'fold' | 'grid'
 
-const initialState: SettingsState = {
+export const initialState: SettingsState = {
   showAssistants: true,
   showTopics: true,
   sendMessageShortcut: 'Enter',