moved scroll to bottom btn to own comp
This commit is contained in:
parent
ed38a7355a
commit
892532dfa2
28
web/components/chat/ChatContainer/ScrollToBotBtn.tsx
Normal file
28
web/components/chat/ChatContainer/ScrollToBotBtn.tsx
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
import { VerticalAlignBottomOutlined } from '@ant-design/icons';
|
||||||
|
import { Button } from 'antd';
|
||||||
|
import { FC, MutableRefObject } from 'react';
|
||||||
|
import { ChatMessage } from '../../../interfaces/chat-message.model';
|
||||||
|
import styles from './ChatContainer.module.scss';
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
chatContainerRef: MutableRefObject<any>;
|
||||||
|
messages: ChatMessage[];
|
||||||
|
};
|
||||||
|
|
||||||
|
export const ScrollToBotBtn: FC<Props> = ({ chatContainerRef, messages }) => (
|
||||||
|
<div className={styles.toBottomWrap}>
|
||||||
|
<Button
|
||||||
|
type="default"
|
||||||
|
style={{ color: 'currentColor' }}
|
||||||
|
icon={<VerticalAlignBottomOutlined />}
|
||||||
|
onClick={() =>
|
||||||
|
chatContainerRef.current.scrollToIndex({
|
||||||
|
index: messages.length - 1,
|
||||||
|
behavior: 'smooth',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
>
|
||||||
|
Go to last message
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
);
|
Loading…
x
Reference in New Issue
Block a user