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