mirror of
https://github.com/CherryHQ/cherry-studio.git
synced 2025-12-25 03:10:08 +08:00
fix: chat navigation triggering (#6774)
* fix: exclude MessageEditor * fix: more accurate triggering area
This commit is contained in:
parent
41bc118426
commit
fda4ca88c1
@ -18,7 +18,17 @@ import styled from 'styled-components'
|
||||
import ChatFlowHistory from './ChatFlowHistory'
|
||||
|
||||
// Exclude some areas from the navigation
|
||||
const EXCLUDED_SELECTORS = ['.MessageFooter', '.code-toolbar', '.ant-collapse-header', '.group-menu-bar', '.code-block']
|
||||
const EXCLUDED_SELECTORS = [
|
||||
'.MessageFooter',
|
||||
'.code-toolbar',
|
||||
'.ant-collapse-header',
|
||||
'.group-menu-bar',
|
||||
'.code-block',
|
||||
'.message-editor'
|
||||
]
|
||||
|
||||
// Gap between the navigation bar and the right element
|
||||
const RIGHT_GAP = 16
|
||||
|
||||
interface ChatNavigationProps {
|
||||
containerId: string
|
||||
@ -264,10 +274,10 @@ const ChatNavigation: FC<ChatNavigationProps> = ({ containerId }) => {
|
||||
const triggerWidth = 60 // Same as the width in styled component
|
||||
|
||||
// Safe way to calculate position when using calc expressions
|
||||
let rightOffset = 16 // Default right offset
|
||||
let rightOffset = RIGHT_GAP // Default right offset
|
||||
if (showRightTopics) {
|
||||
// When topics are shown on right, we need to account for topic list width
|
||||
rightOffset = 16 + 300 // Assuming topic list width is 300px, adjust if different
|
||||
rightOffset += 275 // --topic-list-width
|
||||
}
|
||||
|
||||
const rightPosition = window.innerWidth - rightOffset - triggerWidth
|
||||
@ -280,7 +290,7 @@ const ChatNavigation: FC<ChatNavigationProps> = ({ containerId }) => {
|
||||
const isInTriggerArea =
|
||||
!isInExcludedArea &&
|
||||
e.clientX > rightPosition &&
|
||||
e.clientX < rightPosition + triggerWidth &&
|
||||
e.clientX < rightPosition + triggerWidth + RIGHT_GAP &&
|
||||
e.clientY > topPosition &&
|
||||
e.clientY < topPosition + height
|
||||
|
||||
@ -412,7 +422,7 @@ interface NavigationContainerProps {
|
||||
|
||||
const NavigationContainer = styled.div<NavigationContainerProps>`
|
||||
position: fixed;
|
||||
right: 16px;
|
||||
right: ${RIGHT_GAP}px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%) translateX(${(props) => (props.$isVisible ? 0 : '100%')});
|
||||
z-index: 999;
|
||||
|
||||
@ -172,7 +172,7 @@ const MessageBlockEditor: FC<Props> = ({ message, onSave, onResend, onCancel })
|
||||
}
|
||||
|
||||
return (
|
||||
<EditorContainer onDragOver={(e) => e.preventDefault()} onDrop={handleDrop}>
|
||||
<EditorContainer className="message-editor" onDragOver={(e) => e.preventDefault()} onDrop={handleDrop}>
|
||||
{editedBlocks
|
||||
.filter((block) => block.type === MessageBlockType.MAIN_TEXT)
|
||||
.map((block) => (
|
||||
|
||||
Loading…
Reference in New Issue
Block a user