mirrors/cinny
1
0
Fork 0
mirror of https://github.com/cinnyapp/cinny.git synced 2025-11-07 15:50:29 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

split into two refs

Browse source
This commit is contained in:
Gigiaj 2025-05-10 20:41:06 -05:00
parent cd233053bc
commit a1c0b79cbd
1 changed files with 10 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/app/features/room/CallView.tsx
View file

@ -4,7 +4,7 @@ import { useCallback, useEffect, useRef } from 'react';
import { Box } from 'folds';
import { RoomViewHeader } from './RoomViewHeader';
import { useCallState } from '../../pages/client/CallProvider';
import { RefContext } from '../../pages/call/PersistentCallContainer';
import { PrimaryRefContext, BackupRefContext } from '../../pages/call/PersistentCallContainer';
import { ScreenSize, useScreenSizeContext } from '../../hooks/useScreenSize';
function debounce<F extends (...args: any[]) => any>(func: F, waitFor: number) {
@ -31,26 +31,26 @@ type OriginalStyles = {
};
interface CallViewOutletContext {
iframeRef: React.RefObject<HTMLIFrameElement | null>;
primaryIframeRef: React.RefObject<HTMLIFrameElement | null>;
backupIframeRef: React.RefObject<HTMLIFrameElement | null>;
}
export function CallView({ room, eventId }: { room: Room; eventId?: string }) {
const { iframeRef, backupIframeRef } = useContext(RefContext);
const primaryIframeRef = useContext(PrimaryRefContext);
const backupIframeRef = useContext(BackupRefContext);
const iframeHostRef = useRef<HTMLDivElement>(null);
const originalIframeStylesRef = useRef<OriginalStyles | null>(null);
const { activeCallRoomId, isPrimaryIframe, isChatOpen } = useCallState();
const isViewingActiveCall = useMemo(
() => activeCallRoomId !== null && activeCallRoomId === room.roomId,
[activeCallRoomId]
[activeCallRoomId, room.roomId]
);
const screenSize = useScreenSizeContext();
const isMobile = screenSize === ScreenSize.Mobile;
const activeIframeDisplayRef =
!isPrimaryIframe || isViewingActiveCall ? iframeRef : backupIframeRef;
const activeIframeDisplayRef = isPrimaryIframe ? primaryIframeRef : backupIframeRef;
const applyFixedPositioningToIframe = useCallback(() => {
const iframeElement = activeIframeDisplayRef?.current;
@ -86,16 +86,18 @@ export function CallView({ room, eventId }: { room: Room; eventId?: string }) {
iframeElement.style.visibility = 'visible';
iframeElement.style.pointerEvents = 'auto';
}
}, [activeIframeDisplayRef, iframeHostRef]);
}, [activeIframeDisplayRef, room]);
const debouncedApplyFixedPositioning = useCallback(debounce(applyFixedPositioningToIframe, 50), [
applyFixedPositioningToIframe,
primaryIframeRef,
backupIframeRef,
]);
useEffect(() => {
const iframeElement = activeIframeDisplayRef?.current;
const hostElement = iframeHostRef?.current;
if (isPrimaryIframe || (isViewingActiveCall && iframeElement && hostElement)) {
if (!isPrimaryIframe || (isViewingActiveCall && iframeElement && hostElement)) {
applyFixedPositioningToIframe();
const resizeObserver = new ResizeObserver(debouncedApplyFixedPositioning);