diff --git a/apps/site/src/App.tsx b/apps/site/src/App.tsx index 55d0f87..48da1be 100644 --- a/apps/site/src/App.tsx +++ b/apps/site/src/App.tsx @@ -67,9 +67,17 @@ function App() { const [message, setMessage] = useState(""); + useEffect(() => { + window.scrollTo({ + left: 0, + top: document.body.scrollHeight, + behavior: "instant", + }); + }, []); + return (
- + {(item: Conversation, key: number) => ( = ({ children, className, classNames, - withScroll, }) => { const { sidebar, messageInput, messages, others } = useChat({ children, - withScroll, }); const classes = useClassNames({ className, classNames }); const isMobile = useMediaQuery("(max-width: 768px)"); diff --git a/lib/components/chat/hooks/useChat.ts b/lib/components/chat/hooks/useChat.ts index 0a15838..cc3fa8a 100644 --- a/lib/components/chat/hooks/useChat.ts +++ b/lib/components/chat/hooks/useChat.ts @@ -1,4 +1,4 @@ -import React, { ReactNode, ReactElement, useMemo, useEffect } from "react"; +import React, { ReactNode, ReactElement, useMemo } from "react"; import { Sidebar } from "../../../components/sidebar/sidebar"; import { MessageInput } from "../../../components/message/message-input"; import { Messages } from "../../../components/message/messages"; @@ -12,7 +12,6 @@ type UseChatReturn = { type UseChatProps = { children: ReactNode; - withScroll?: boolean; }; const isSidebarElement = (child: ReactNode): child is ReactElement => { @@ -27,10 +26,7 @@ const isMessagesElement = (child: ReactNode): child is ReactElement => { return React.isValidElement(child) && child.type === Messages; }; -export const useChat = ({ - children, - withScroll, -}: UseChatProps): UseChatReturn => { +export const useChat = ({ children }: UseChatProps): UseChatReturn => { const childrenAsArray = useMemo(() => { return Array.isArray(children) ? children : [children]; }, [children]); @@ -56,16 +52,6 @@ export const useChat = ({ ); }, [childrenAsArray]); - useEffect(() => { - if (withScroll) { - window.scrollTo({ - left: 0, - top: document.body.scrollHeight, - behavior: "instant", - }); - } - }, []); - return { sidebar, messageInput, diff --git a/lib/types.ts b/lib/types.ts index b38253a..b469f9b 100644 --- a/lib/types.ts +++ b/lib/types.ts @@ -5,10 +5,6 @@ export type ChatProps = { * The children of the chat component */ children?: ReactNode; - /** - * Whether to scroll to the bottom of the chat when the component is mounted - */ - withScroll?: boolean; /** * The className of the chat component */