fix(chat): chat bottom input container calcultion
- Removed the rateLimitNoticeRef from ChatInterface, simplifying the height calculation. - Updated RateLimitNotice component to eliminate the ref prop, streamlining its implementation. Signed-off-by: Innei <tukon479@gmail.com>
This commit is contained in:
parent
7ca97e0208
commit
e0a2e6c49c
|
|
@ -283,15 +283,12 @@ const ChatInterfaceContent = ({ centerInputOnEmpty }: ChatInterfaceProps) => {
|
|||
|
||||
const [bottomPanelHeight, setBottomPanelHeight] = useState<number>(0)
|
||||
const bottomPanelRef = useRef<HTMLDivElement | null>(null)
|
||||
const rateLimitNoticeRef = useRef<HTMLDivElement | null>(null)
|
||||
|
||||
useLayoutEffect(() => {
|
||||
if (!bottomPanelRef.current || !rateLimitNoticeRef.current) {
|
||||
if (!bottomPanelRef.current) {
|
||||
return
|
||||
}
|
||||
setBottomPanelHeight(
|
||||
(bottomPanelRef.current?.offsetHeight ?? 0) + (rateLimitNoticeRef.current?.offsetHeight ?? 0),
|
||||
)
|
||||
setBottomPanelHeight(bottomPanelRef.current.offsetHeight)
|
||||
|
||||
const resizeObserver = new ResizeObserver(() => {
|
||||
if (!bottomPanelRef.current) {
|
||||
|
|
@ -416,7 +413,7 @@ const ChatInterfaceContent = ({ centerInputOnEmpty }: ChatInterfaceProps) => {
|
|||
"bottom-1/2 translate-y-[calc(100%+1rem)] duration-200",
|
||||
)}
|
||||
>
|
||||
<RateLimitNotice ref={rateLimitNoticeRef} error={error} chatConfig={configuration} />
|
||||
<RateLimitNotice error={error} chatConfig={configuration} />
|
||||
<ChatShortcutsRow
|
||||
onSelect={(shortcutData) => {
|
||||
const tempEditor = createEditor({
|
||||
|
|
|
|||
|
|
@ -8,7 +8,6 @@ import { useSettingModal } from "~/modules/settings/modal/useSettingModal"
|
|||
import { parseAIError } from "../../utils/error"
|
||||
|
||||
interface RateLimitNoticeProps {
|
||||
ref?: React.Ref<HTMLDivElement>
|
||||
error?: Error
|
||||
chatConfig?: ConfigResponse
|
||||
className?: string
|
||||
|
|
@ -18,7 +17,7 @@ interface RateLimitNoticeProps {
|
|||
* RateLimitNotice component
|
||||
* Displays rate limit information above the input in a subtle, non-alarming way
|
||||
*/
|
||||
export const RateLimitNotice = ({ ref, error, chatConfig, className }: RateLimitNoticeProps) => {
|
||||
export const RateLimitNotice = ({ error, chatConfig, className }: RateLimitNoticeProps) => {
|
||||
const message = React.useMemo(() => {
|
||||
if (error) {
|
||||
return buildErrorMessage(error)
|
||||
|
|
@ -40,7 +39,6 @@ export const RateLimitNotice = ({ ref, error, chatConfig, className }: RateLimit
|
|||
|
||||
return (
|
||||
<m.div
|
||||
ref={ref}
|
||||
initial={{ opacity: 0, y: -10 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
exit={{ opacity: 0, y: -10 }}
|
||||
|
|
|
|||
Loading…
Reference in New Issue