From f39a262eb5c093385548a2e9cd51e9d030fe8389 Mon Sep 17 00:00:00 2001 From: Gigiaj Date: Tue, 15 Apr 2025 22:08:03 -0500 Subject: [PATCH] remove iframe from RoomView as it isn't needed there (since you cant have persistence that way) --- src/app/features/room/RoomView.tsx | 134 +++-------------------------- 1 file changed, 10 insertions(+), 124 deletions(-) diff --git a/src/app/features/room/RoomView.tsx b/src/app/features/room/RoomView.tsx index 46c62f62..f6ce2f20 100644 --- a/src/app/features/room/RoomView.tsx +++ b/src/app/features/room/RoomView.tsx @@ -26,6 +26,8 @@ import { useSetting } from '../../state/hooks/settings'; import { useAccessibleTagColors, usePowerLevelTags } from '../../hooks/usePowerLevelTags'; import { useTheme } from '../../hooks/useTheme'; import { createVirtualWidget, Edget, getWidgetData, getWidgetUrl } from './SmallWidget'; +import { PersistentCallContainer } from '../../pages/call/PersistentCallContainer'; +import { CallActivationEffect } from '../../pages/call/CallActivation'; // --- Constants --- const FN_KEYS_REGEX = /^F\d+$/; @@ -77,9 +79,6 @@ export function RoomView({ room, eventId }: { room: Room; eventId?: string }) { // Refs const roomInputRef = useRef(null); const roomViewRef = useRef(null); // Ref for the main Page container - const iframeRef = useRef(null); // Ref for the iframe element - const widgetApiRef = useRef(null); // Ref to store the widget API instance - const edgetRef = useRef(null); // Ref to store the Edget instance // State & Hooks const [hideActivity] = useSetting(settingsAtom, 'hideActivity'); @@ -123,136 +122,23 @@ export function RoomView({ room, eventId }: { room: Room; eventId?: string }) { ) ); - // Effect to setup and cleanup the widget API for call rooms - useEffect(() => { - // Only run if it's a call room - if (isCall) { - const iframeElement = iframeRef.current; - // Ensure iframe element exists before proceeding - if (!iframeElement) { - logger.warn(`Iframe element not found for room ${roomId}, cannot initialize widget.`); - return; - } - - logger.info(`Setting up Element Call widget for room ${roomId}`); - const userId = mx.getUserId() ?? ''; // Ensure userId is not null - const url = getWidgetUrl(mx, roomId); // Generate the widget URL - - // 1. Create the virtual widget definition - const app = createVirtualWidget( - mx, - `element-call-${roomId}`, - userId, - 'Element Call', - 'm.call', // Widget type - url, - false, // waitForIframeLoad - false as we manually control src loading - getWidgetData( - // Widget data - mx, - roomId, - {}, // Initial data (can be fetched if needed) - { - // Overwrite/specific data - skipLobby: true, // Example configuration - preload: false, // Set preload based on whether you want background loading - returnToLobby: false, // Example configuration - } - ), - roomId - ); - - // 2. Instantiate Edget to manage widget communication - const edget = new Edget(app); - edgetRef.current = edget; // Store instance in ref - - // 3. Start the widget messaging *before* setting the iframe src - try { - const widgetApi = edget.startMessaging(iframeElement); - widgetApiRef.current = widgetApi; // Store API instance - - // Listen for the 'ready' event from the widget API - widgetApi.once('ready', () => { - logger.info(`Element Call widget is ready for room ${roomId}.`); - // Perform actions needed once the widget confirms it's ready - // Example: widgetApi.transport.send("action", { data: "..." }); - }); - - widgetApi.on('action:im.vector.hangup', () => { - logger.info(`Received hangup action from widget in room ${roomId}.`); - // Handle hangup logic (e.g., navigate away, update room state) - }); - - // Add other necessary event listeners from the widget API - // widgetApi.on("action:some_other_action", (ev) => { ... }); - - // 4. Set the iframe src *after* messaging is initialized - logger.info(`Setting iframe src for room ${roomId}: ${url.toString()}`); - iframeElement.src = url.toString(); - } catch (error) { - logger.error(`Error initializing widget messaging for room ${roomId}:`, error); - // Handle initialization error (e.g., show an error message to the user) - } - - // 5. Return cleanup function - return () => { - logger.info(`Cleaning up Element Call widget for room ${roomId}`); - // Stop messaging and clean up resources - if (edgetRef.current) { - edgetRef.current.stopMessaging(); - edgetRef.current = null; - } - widgetApiRef.current = null; // Clear API ref - - // Clear iframe src to stop activity and free resources - if (iframeRef.current) { - iframeRef.current.src = 'about:blank'; - logger.info(`Cleared iframe src for room ${roomId}`); - } - }; - } else { - // If not a call room, ensure any previous call state is cleaned up - // (This might be redundant if component unmounts/remounts correctly, but safe) - if (widgetApiRef.current && iframeRef.current) { - logger.info(`Room ${roomId} is no longer a call room, ensuring cleanup.`); - if (edgetRef.current) { - edgetRef.current.stopMessaging(); - edgetRef.current = null; - } - widgetApiRef.current = null; - iframeRef.current.src = 'about:blank'; - } - } - - // Explicitly return undefined if not a call room or no cleanup needed initially - return undefined; - }, [isCall, mx, roomId, editor]); // Dependencies: run effect if these change - // --- Render Logic --- // Render Call View if (isCall) { - // Initial src is set to about:blank. The useEffect hook will set the actual src later. return ( - {/* Box grows to fill available space */} - -