refactor(home/Tabs): replace redux state with local state for active tab

Simplify tab state management by using useState instead of redux
Remove unused imports and clean up useEffect dependencies
This commit is contained in:
icarus 2025-09-20 20:24:24 +08:00
parent d1067bb6b3
commit c70a5d63aa
2 changed files with 4 additions and 26 deletions

View File

@ -4,12 +4,10 @@ import { useRuntime } from '@renderer/hooks/useRuntime'
import { useNavbarPosition, useSettings } from '@renderer/hooks/useSettings'
import { useShowTopics } from '@renderer/hooks/useStore'
import { EVENT_NAMES, EventEmitter } from '@renderer/services/EventService'
import { useAppDispatch } from '@renderer/store'
import { setActiveTabIdAction } from '@renderer/store/runtime'
import { Assistant, Topic } from '@renderer/types'
import { Tab } from '@renderer/types/chat'
import { classNames, uuid } from '@renderer/utils'
import { FC, useCallback, useEffect } from 'react'
import { FC, useEffect, useState } from 'react'
import { useTranslation } from 'react-i18next'
import styled from 'styled-components'
@ -47,21 +45,9 @@ const HomeTabs: FC<Props> = ({
const { t } = useTranslation()
const { chat } = useRuntime()
const { activeTabId: tab, activeTopicOrSession } = chat
const dispatch = useAppDispatch()
const setTab = useCallback(
(tab: Tab) => {
dispatch(setActiveTabIdAction(tab))
},
[dispatch]
)
useEffect(() => {
setTab(position === 'left' ? _tab || 'assistants' : 'topic')
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [])
const { activeTopicOrSession } = chat
const [tab, setTab] = useState<Tab>(position === 'left' ? _tab || 'assistants' : 'topic')
const borderStyle = '0.5px solid var(--color-border)'
const border =
position === 'left'
@ -113,7 +99,6 @@ const HomeTabs: FC<Props> = ({
if (position === 'left' && topicPosition === 'right' && tab === 'topic') {
setTab('assistants')
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [position, tab, topicPosition, forceToSeeAllTab])
return (
@ -137,7 +122,7 @@ const HomeTabs: FC<Props> = ({
{position === 'right' && topicPosition === 'right' && (
<CustomTabs>
<TabItem active={tab === 'topic'} onClick={() => setTab('topic')}>
{t('common.topics')}
{activeTopicOrSession === 'topic' ? t('common.topics') : t('agent.session.label_other')}
</TabItem>
<TabItem active={tab === 'settings'} onClick={() => setTab('settings')}>
{t('settings.title')}

View File

@ -1,7 +1,6 @@
import { createSlice, PayloadAction } from '@reduxjs/toolkit'
import { AppLogo, UserAvatar } from '@renderer/config/env'
import type { MinAppType, Topic, WebSearchStatus } from '@renderer/types'
import { Tab } from '@renderer/types/chat'
import type { UpdateInfo } from 'builder-util-runtime'
export interface ChatState {
@ -15,7 +14,6 @@ export interface ChatState {
activeSessionId: Record<string, string | null>
/** meanwhile active Assistants or Agents */
activeTopicOrSession: 'topic' | 'session'
activeTabId: Tab
/** topic ids that are currently being renamed */
renamingTopics: string[]
/** topic ids that are newly renamed */
@ -86,7 +84,6 @@ const initialState: RuntimeState = {
chat: {
isMultiSelectMode: false,
selectedMessageIds: [],
activeTabId: 'assistants',
activeTopic: null,
activeAgentId: null,
activeTopicOrSession: 'topic',
@ -162,9 +159,6 @@ const runtimeSlice = createSlice({
const { agentId, sessionId } = action.payload
state.chat.activeSessionId[agentId] = sessionId
},
setActiveTabIdAction: (state, action: PayloadAction<Tab>) => {
state.chat.activeTabId = action.payload
},
setActiveTopicOrSessionAction: (state, action: PayloadAction<'topic' | 'session'>) => {
state.chat.activeTopicOrSession = action.payload
},
@ -208,7 +202,6 @@ export const {
setActiveTopic,
setActiveAgentId,
setActiveSessionIdAction,
setActiveTabIdAction,
setActiveTopicOrSessionAction,
setRenamingTopics,
setNewlyRenamedTopics,