mirror of
https://github.com/CherryHQ/cherry-studio.git
synced 2026-01-01 17:59:09 +08:00
fix(TopicMessages): fix topic style (#9178)
* fix(TopicMessages): fix topic style
This commit is contained in:
parent
1bf380a921
commit
bf30bf28a9
@ -3,6 +3,7 @@ import { HStack } from '@renderer/components/Layout'
|
||||
import SearchPopup from '@renderer/components/Popups/SearchPopup'
|
||||
import { MessageEditingProvider } from '@renderer/context/MessageEditingContext'
|
||||
import useScrollPosition from '@renderer/hooks/useScrollPosition'
|
||||
import { useSettings } from '@renderer/hooks/useSettings'
|
||||
import { getAssistantById } from '@renderer/services/AssistantService'
|
||||
import { EVENT_NAMES, EventEmitter } from '@renderer/services/EventService'
|
||||
import { isGenerating, locateToMessage } from '@renderer/services/MessagesService'
|
||||
@ -10,6 +11,7 @@ import NavigationService from '@renderer/services/NavigationService'
|
||||
import { useAppDispatch } from '@renderer/store'
|
||||
import { loadTopicMessagesThunk } from '@renderer/store/thunk/messageThunk'
|
||||
import { Topic } from '@renderer/types'
|
||||
import { classNames } from '@renderer/utils'
|
||||
import { Button, Divider, Empty } from 'antd'
|
||||
import { t } from 'i18next'
|
||||
import { Forward } from 'lucide-react'
|
||||
@ -26,6 +28,7 @@ const TopicMessages: FC<Props> = ({ topic, ...props }) => {
|
||||
const navigate = NavigationService.navigate!
|
||||
const { handleScroll, containerRef } = useScrollPosition('TopicMessages')
|
||||
const dispatch = useAppDispatch()
|
||||
const { messageStyle } = useSettings()
|
||||
|
||||
useEffect(() => {
|
||||
topic && dispatch(loadTopicMessagesThunk(topic.id))
|
||||
@ -48,9 +51,9 @@ const TopicMessages: FC<Props> = ({ topic, ...props }) => {
|
||||
return (
|
||||
<MessageEditingProvider>
|
||||
<MessagesContainer {...props} ref={containerRef} onScroll={handleScroll}>
|
||||
<ContainerWrapper>
|
||||
<ContainerWrapper className={messageStyle}>
|
||||
{topic?.messages.map((message) => (
|
||||
<div key={message.id} style={{ position: 'relative' }}>
|
||||
<MessageWrapper key={message.id} className={classNames([messageStyle, message.role])}>
|
||||
<MessageItem message={message} topic={topic} hideMenuBar={true} />
|
||||
<Button
|
||||
type="text"
|
||||
@ -60,7 +63,7 @@ const TopicMessages: FC<Props> = ({ topic, ...props }) => {
|
||||
icon={<Forward size={16} />}
|
||||
/>
|
||||
<Divider style={{ margin: '8px auto 15px' }} variant="dashed" />
|
||||
</div>
|
||||
</MessageWrapper>
|
||||
))}
|
||||
{isEmpty && <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />}
|
||||
{!isEmpty && (
|
||||
@ -91,4 +94,11 @@ const ContainerWrapper = styled.div`
|
||||
flex-direction: column;
|
||||
`
|
||||
|
||||
const MessageWrapper = styled.div`
|
||||
position: relative;
|
||||
&.bubble.user {
|
||||
padding-top: 26px;
|
||||
}
|
||||
`
|
||||
|
||||
export default TopicMessages
|
||||
|
||||
Loading…
Reference in New Issue
Block a user