diff --git a/web/src/ui/roomview/RoomView.tsx b/web/src/ui/roomview/RoomView.tsx index fef442a..d06da39 100644 --- a/web/src/ui/roomview/RoomView.tsx +++ b/web/src/ui/roomview/RoomView.tsx @@ -13,7 +13,7 @@ // // You should have received a copy of the GNU Affero General Public License // along with this program. If not, see . -import { JSX, useRef } from "react" +import { JSX, useEffect, useState } from "react" import { RoomStateStore } from "@/api/statestore" import MessageComposer from "../composer/MessageComposer.tsx" import TypingNotifications from "../composer/TypingNotifications.tsx" @@ -30,11 +30,18 @@ interface RoomViewProps { } const RoomView = ({ room, rightPanelResizeHandle, rightPanel }: RoomViewProps) => { - const roomContextDataRef = useRef(undefined) - if (roomContextDataRef.current === undefined) { - roomContextDataRef.current = new RoomContextData(room) - } - return + const [roomContextData] = useState(() => new RoomContextData(room)) + useEffect(() => { + window.activeRoomContext = roomContextData + window.addEventListener("resize", roomContextData.scrollToBottom) + return () => { + window.removeEventListener("resize", roomContextData.scrollToBottom) + if (window.activeRoomContext === roomContextData) { + window.activeRoomContext = undefined + } + } + }, [roomContextData]) + return
diff --git a/web/src/ui/roomview/roomcontext.ts b/web/src/ui/roomview/roomcontext.ts index 13c49e9..299bb69 100644 --- a/web/src/ui/roomview/roomcontext.ts +++ b/web/src/ui/roomview/roomcontext.ts @@ -34,7 +34,7 @@ export class RoomContextData { constructor(public store: RoomStateStore) {} - scrollToBottom() { + scrollToBottom = () => { if (this.scrolledToBottom) { this.timelineBottomRef.current?.scrollIntoView() } diff --git a/web/src/vite-env.d.ts b/web/src/vite-env.d.ts index 5edc4d9..ceffa1a 100644 --- a/web/src/vite-env.d.ts +++ b/web/src/vite-env.d.ts @@ -4,11 +4,13 @@ import type Client from "@/api/client.ts" import type { GCSettings, RoomStateStore } from "@/api/statestore" import type { MainScreenContextFields } from "@/ui/MainScreenContext.ts" +import type { RoomContextData } from "@/ui/roomview/roomcontext.ts" declare global { interface Window { client: Client activeRoom?: RoomStateStore | null + activeRoomContext?: RoomContextData mainScreenContext: MainScreenContextFields openLightbox: (params: { src: string, alt: string }) => void gcSettings: GCSettings