(null)
+ const [editingTitle, setEditingTitle] = useState(false)
+ const [titleValue, setTitleValue] = useState('')
+
+ // Selection popup state
+ const [selectionPopup, setSelectionPopup] = useState<{
+ x: number
+ y: number
+ text: string
+ messageIndex: number
+ } | null>(null)
+
+ useEffect(() => {
+ if (feedRef.current) {
+ feedRef.current.scrollTop = feedRef.current.scrollHeight
+ }
+ }, [currentChat?.messages.length])
+
+ // Detect text selection inside messages
+ const handleMouseUp = useCallback(() => {
+ const selection = window.getSelection()
+ if (!selection || selection.isCollapsed || !selection.toString().trim()) {
+ return
+ }
+
+ const text = selection.toString().trim()
+ if (text.length < 2 || text.length > 100) {
+ setSelectionPopup(null)
+ return
+ }
+
+ // Find which message the selection is in
+ const anchorNode = selection.anchorNode
+ if (!anchorNode) return
+
+ let messageEl: HTMLElement | null = null
+ let node: Node | null = anchorNode
+ while (node) {
+ if (node instanceof HTMLElement && node.classList.contains('chat-message')) {
+ messageEl = node
+ break
+ }
+ node = node.parentNode
+ }
+
+ if (!messageEl) return
+
+ const indexStr = messageEl.getAttribute('data-index')
+ if (indexStr === null) return
+
+ const range = selection.getRangeAt(0)
+ const rect = range.getBoundingClientRect()
+
+ setSelectionPopup({
+ x: rect.left + rect.width / 2 - 25,
+ y: rect.top - 40,
+ text,
+ messageIndex: parseInt(indexStr, 10),
+ })
+ }, [])
+
+ const handleMouseDown = useCallback(() => {
+ setSelectionPopup(null)
+ }, [])
+
+ useEffect(() => {
+ document.addEventListener('mousedown', handleMouseDown)
+ return () => document.removeEventListener('mousedown', handleMouseDown)
+ }, [handleMouseDown])
+
+ if (!currentChat) {
+ return Выберите чат
+ }
+
+ const ancestors = getAncestors(store, currentChatId)
+ const breadcrumbs = [...ancestors, currentChat]
+
+ return (
+
+ {/* Breadcrumb navigation */}
+
+ {breadcrumbs.map((chat, i) => (
+
+ {i > 0 && /}
+
+
+ ))}
+
+
+ {/* Chat title */}
+
+ {editingTitle ? (
+ setTitleValue(e.target.value)}
+ onBlur={() => {
+ if (titleValue.trim()) renameChat(currentChatId, titleValue.trim())
+ setEditingTitle(false)
+ }}
+ onKeyDown={(e) => {
+ if (e.key === 'Enter') {
+ if (titleValue.trim()) renameChat(currentChatId, titleValue.trim())
+ setEditingTitle(false)
+ }
+ }}
+ autoFocus
+ />
+ ) : (
+
{
+ setTitleValue(currentChat.title)
+ setEditingTitle(true)
+ }}
+ >
+ {currentChat.title}
+ {currentChat.parentId && (
+ ветка
+ )}
+
+ )}
+ {currentChat.parentId && currentChat.parentMessageIndex !== null && (
+
+ Форк от сообщения #{currentChat.parentMessageIndex + 1} в{' '}
+
+
+ )}
+
+
+ {/* Messages */}
+
+ {currentChat.messages.length === 0 && (
+
+ Начните разговор. Напишите сообщение ниже.
+
+ )}
+ {currentChat.messages.map((msg, index) => (
+
+
+
+ {msg.role === 'user'
+ ? 'Вы'
+ : msg.role === 'assistant'
+ ? 'Ассистент'
+ : 'Система'}
+
+
+ {new Date(msg.timestamp).toLocaleTimeString('ru-RU', {
+ hour: '2-digit',
+ minute: '2-digit',
+ })}
+
+ {msg.role !== 'system' && (
+
+ )}
+
+
+
+
+ {forkingIndex === index && (
+
{
+ forkChat(index, title)
+ setForkingIndex(null)
+ }}
+ onCancel={() => setForkingIndex(null)}
+ />
+ )}
+ {/* Show fork indicators */}
+ {Object.values(store.chats)
+ .filter(
+ (c) =>
+ c.parentId === currentChatId &&
+ c.parentMessageIndex === index
+ )
+ .map((forkedChat) => (
+
+ ))}
+
+ ))}
+
+
+ {/* Selection popup */}
+ {selectionPopup && (
+
{
+ forkFromSelection(selectionPopup.text, selectionPopup.messageIndex, prompt)
+ setSelectionPopup(null)
+ window.getSelection()?.removeAllRanges()
+ }}
+ onClose={() => {
+ setSelectionPopup(null)
+ window.getSelection()?.removeAllRanges()
+ }}
+ />
+ )}
+
+