Unverified Commit c439952a authored by Rhon Joe's avatar Rhon Joe Committed by GitHub

fix(web): chat input auto resize by window (#2696)

parent 2f28afeb
...@@ -9,6 +9,7 @@ import { ...@@ -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> = ({ ...@@ -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) => {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment