mirror of
https://git.mirrors.martin98.com/https://github.com/langgenius/dify.git
synced 2025-08-15 20:25:52 +08:00
fix(web): chat input auto resize by window (#2696)
This commit is contained in:
parent
2f28afebb6
commit
c439952a41
@ -9,6 +9,7 @@ import {
|
|||||||
} from 'react'
|
} from 'react'
|
||||||
import { useTranslation } from 'react-i18next'
|
import { useTranslation } from 'react-i18next'
|
||||||
import { useThrottleEffect } from 'ahooks'
|
import { useThrottleEffect } from 'ahooks'
|
||||||
|
import { debounce } from 'lodash-es'
|
||||||
import type {
|
import type {
|
||||||
ChatConfig,
|
ChatConfig,
|
||||||
ChatItem,
|
ChatItem,
|
||||||
@ -81,16 +82,24 @@ const Chat: FC<ChatProps> = ({
|
|||||||
chatContainerRef.current.scrollTop = chatContainerRef.current.scrollHeight
|
chatContainerRef.current.scrollTop = chatContainerRef.current.scrollHeight
|
||||||
}
|
}
|
||||||
|
|
||||||
useThrottleEffect(() => {
|
const handleWindowResize = () => {
|
||||||
handleScrolltoBottom()
|
|
||||||
|
|
||||||
if (chatContainerRef.current && chatFooterRef.current)
|
if (chatContainerRef.current && chatFooterRef.current)
|
||||||
chatFooterRef.current.style.width = `${chatContainerRef.current.clientWidth}px`
|
chatFooterRef.current.style.width = `${chatContainerRef.current.clientWidth}px`
|
||||||
|
|
||||||
if (chatContainerInnerRef.current && chatFooterInnerRef.current)
|
if (chatContainerInnerRef.current && chatFooterInnerRef.current)
|
||||||
chatFooterInnerRef.current.style.width = `${chatContainerInnerRef.current.clientWidth}px`
|
chatFooterInnerRef.current.style.width = `${chatContainerInnerRef.current.clientWidth}px`
|
||||||
|
}
|
||||||
|
|
||||||
|
useThrottleEffect(() => {
|
||||||
|
handleScrolltoBottom()
|
||||||
|
handleWindowResize()
|
||||||
}, [chatList], { wait: 500 })
|
}, [chatList], { wait: 500 })
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
window.addEventListener('resize', debounce(handleWindowResize))
|
||||||
|
return () => window.removeEventListener('resize', handleWindowResize)
|
||||||
|
}, [])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (chatFooterRef.current && chatContainerRef.current) {
|
if (chatFooterRef.current && chatContainerRef.current) {
|
||||||
const resizeObserver = new ResizeObserver((entries) => {
|
const resizeObserver = new ResizeObserver((entries) => {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user