fix: wire chat toggle and ready composer in LiveKit conference window

- Add showChat state to LiveKitConferenceEmbeddedPage and let MediaCallRoomSection toggle it.
- Pass onClose to ConferenceChat so the header close button also hides the chat panel.
- Open the room in LegacyRoomManager from ConferenceRoom so RoomBody's composer becomes ready.

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Author: rodrigok

apps/meteor/client/views/conference/ConferenceRoom.tsx

@@ -4,7 +4,9 @@ import { LayoutContext, useLayout, useStream, useUserId } from '@rocket.chat/ui-
 import type { ReactElement } from 'react';
 import { lazy, Suspense, useEffect, useMemo } from 'react';
 
+import { LegacyRoomManager } from '../../../app/ui-utils/client';
 import { SubscriptionsCachedStore } from '../../cachedStores';
+import { Rooms } from '../../stores';
 import RoomSkeleton from '../room/RoomSkeleton';
 
 const RoomProvider = lazy(() => import('../room/providers/RoomProvider'));
@@ -19,6 +21,7 @@ const ConferenceRoom = ({ rid }: ConferenceRoomProps): ReactElement => {
 	const subscribeToNotifyUser = useStream('notify-user');
 	const layoutContext = useLayout();
 	const layoutContextEmbedded = useMemo(() => ({ ...layoutContext, isEmbedded: true }), [layoutContext]);
+	const room = Rooms.use((state) => state.get(rid));
 
 	useEffect(() => {
 		if (!uid) {
@@ -34,6 +37,14 @@ const ConferenceRoom = ({ rid }: ConferenceRoomProps): ReactElement => {
 		});
 	}, [rid, subscribeToNotifyUser, uid]);
 
+	useEffect(() => {
+		if (!room) {
+			return;
+		}
+
+		LegacyRoomManager.open({ typeName: room.t + room.name, rid: room._id });
+	}, [room]);
+
 	return (
 		<LayoutContext.Provider value={layoutContextEmbedded}>
 			<Box display='flex' w='full' h='full'>

apps/meteor/client/views/conference/LiveKitConferenceEmbeddedPage.tsx

@@ -3,7 +3,7 @@ import { Box } from '@rocket.chat/fuselage';
 import { useUserDisplayName } from '@rocket.chat/ui-client';
 import { useRouteParameter, useSearchParameter, useSetModal, useUser, useUserAvatarPath } from '@rocket.chat/ui-contexts';
 import { MediaCallRoomSection, useMediaCallView } from '@rocket.chat/ui-voip';
-import { useEffect, useMemo, useRef, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 
 import ConferenceChat from './ConferenceChat';
 import ConferenceDisconnectedModal from './ConferenceDisconnectedModal';
@@ -40,6 +40,10 @@ const LiveKitConferenceEmbeddedPage = () => {
 	const wasConnected = useRef(false);
 	const hasJoined = useRef(false);
 
+	const [showChat, setShowChat] = useState(true);
+	const toggleChat = useCallback(() => setShowChat((prev) => !prev), []);
+	const closeChat = useCallback(() => setShowChat(false), []);
+
 	useEffect(() => {
 		if (sessionState.state === 'ongoing') {
 			wasConnected.current = true;
@@ -107,11 +111,13 @@ const LiveKitConferenceEmbeddedPage = () => {
 
 	return (
 		<Box bg='surface-light' w='full' h='full' display='flex' overflow='hidden'>
-			<Box display='flex' flexDirection='column' flexShrink={0} width={400} h='full' borderInlineEndWidth={1} borderColor='stroke-light'>
-				<ConferenceChat rid={room.rid} loading={room.loading} />
-			</Box>
+			{showChat && (
+				<Box display='flex' flexDirection='column' flexShrink={0} width={400} h='full' borderInlineEndWidth={1} borderColor='stroke-light'>
+					<ConferenceChat rid={room.rid} loading={room.loading} onClose={closeChat} />
+				</Box>
+			)}
 			<Box flexGrow={1} display='flex' flexDirection='column' position='relative' minWidth={0} minHeight={0}>
-				<MediaCallRoomSection showChat={false} onToggleChat={() => undefined} user={ownUser} hideChatToggle />
+				<MediaCallRoomSection showChat={showChat} onToggleChat={toggleChat} user={ownUser} />
 			</Box>
 		</Box>
 	);