Northern_Lights/cherry-studio
1
0
Fork 0
mirror of https://github.com/CherryHQ/cherry-studio.git synced 2026-01-06 21:35:52 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

refactor(SessionItem): replace className with isActive prop for better readability

Browse Source 
Use isActive prop instead of className to control active state styling
Add dynamic background color based on topicPosition setting
This commit is contained in:
icarus 2025-09-27 13:46:26 +08:00
parent 29242154d0
commit 6c63146556
1 changed files with 27 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
src/renderer/src/pages/home/Tabs/components/SessionItem.tsx
View File

@ -3,6 +3,7 @@ import { DeleteIcon, EditIcon } from '@renderer/components/Icons'
import { useUpdateSession } from '@renderer/hooks/agents/useUpdateSession' import { useUpdateSession } from '@renderer/hooks/agents/useUpdateSession'
import { useInPlaceEdit } from '@renderer/hooks/useInPlaceEdit' import { useInPlaceEdit } from '@renderer/hooks/useInPlaceEdit'
import { useRuntime } from '@renderer/hooks/useRuntime' import { useRuntime } from '@renderer/hooks/useRuntime'
import { useSettings } from '@renderer/hooks/useSettings'
import { SessionSettingsPopup } from '@renderer/pages/settings/AgentSettings' import { SessionSettingsPopup } from '@renderer/pages/settings/AgentSettings'
import { SessionLabel } from '@renderer/pages/settings/AgentSettings/shared' import { SessionLabel } from '@renderer/pages/settings/AgentSettings/shared'
import { AgentSessionEntity } from '@renderer/types' import { AgentSessionEntity } from '@renderer/types'
@ -46,7 +47,7 @@ const SessionItem: FC<SessionItemProps> = ({ session, agentId, isDisabled, isLoa
isDisabled={isDisabled} isDisabled={isDisabled}
isLoading={isLoading} isLoading={isLoading}
onPress={onPress} onPress={onPress}
className={cn(isActive ? 'active' : '')} isActive={isActive}
onDoubleClick={() => startEdit(session.name ?? '')}> onDoubleClick={() => startEdit(session.name ?? '')}>
<SessionLabelContainer className="name h-full w-full" title={session.name ?? session.id}> <SessionLabelContainer className="name h-full w-full" title={session.name ?? session.id}>
{isEditing && ( {isEditing && (
@ -96,22 +97,31 @@ const SessionItem: FC<SessionItemProps> = ({ session, agentId, isDisabled, isLoa
) )
} }
const ButtonContainer: React.FC<React.ComponentProps<typeof Button>> = ({ className, children, ...props }) => ( const ButtonContainer: React.FC<React.ComponentProps<typeof Button> & { isActive?: boolean }> = ({
<Button isActive,
{...props} className,
variant="light" children,
className={cn( ...props
'relative mb-2 flex h-9 flex-row justify-between p-0', }) => {
'rounded-[var(--list-item-border-radius)]', const { topicPosition } = useSettings()
'border-[0.5px] border-transparent', const activeBg = topicPosition === 'left' ? 'bg-[var(--color-list-item)]' : 'bg-foreground-100'
'w-[calc(var(--assistants-width)_-_20px)]', return (
'cursor-pointer', <Button
className?.includes('active') && 'bg-foreground-100 shadow-sm', {...props}
className variant="light"
)}> className={cn(
{children} 'relative mb-2 flex h-9 flex-row justify-between p-0',
</Button> 'rounded-[var(--list-item-border-radius)]',
) 'border-[0.5px] border-transparent',
'w-[calc(var(--assistants-width)_-_20px)]',
'cursor-pointer',
isActive ? cn(activeBg, 'shadow-sm') : undefined,
className
)}>
{children}
</Button>
)
}
const SessionLabelContainer: React.FC<React.HTMLAttributes<HTMLDivElement>> = ({ className, ...props }) => ( const SessionLabelContainer: React.FC<React.HTMLAttributes<HTMLDivElement>> = ({ className, ...props }) => (
<div <div