misty.cafe/minty
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

remove debug logs

Browse source
This commit is contained in:
YoJames2019 2026-02-10 22:39:53 -05:00
parent 40957632d5
commit 9562103210
3 changed files with 87 additions and 133 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/app/features/call/SmallWidget.ts
View file

@ -26,7 +26,6 @@ import {
WidgetApiFromWidgetAction,
WidgetKind,
} from 'matrix-widget-api';
import { logger } from 'matrix-js-sdk/lib/logger';
import { CinnyWidget } from './CinnyWidget';
import { SmallWidgetDriver } from './SmallWidgetDriver';
@ -68,7 +67,6 @@ export const getWidgetUrl = (
const replacedParams = params.toString().replace(/%24/g, '$');
url.search = `?${replacedParams}`;
logger.info('Generated Element Call Widget URL:', url.toString());
return url;
};
@ -194,7 +192,6 @@ export class SmallWidget extends EventEmitter {
}
);
logger.info(`Widget messaging started for widgetId: ${this.mockWidget.id}`);
return this.messaging;
}
@ -319,9 +316,7 @@ export class SmallWidget extends EventEmitter {
this.eventsToFeed.add(ev);
} else {
const raw = ev.getEffectiveEvent();
this.messaging.feedEvent(raw as IRoomEvent, this.roomId ?? '').catch((e) => {
logger.error('Error sending event to widget: ', e);
});
this.messaging.feedEvent(raw as IRoomEvent, this.roomId ?? '').catch(() => null);
}
}
}
@ -333,7 +328,6 @@ export class SmallWidget extends EventEmitter {
if (this.messaging) {
this.messaging.stop(); // Example if a stop method exists
this.messaging.removeAllListeners(); // Remove listeners attached by SmallWidget
logger.info(`Widget messaging stopped for widgetId: ${this.mockWidget.id}`);
this.messaging = null;
}
}

122
src/app/pages/client/call/CallProvider.tsx
View file

@ -7,8 +7,12 @@ import React, {
ReactNode,
useEffect,
} from 'react';
import { logger } from 'matrix-js-sdk/lib/logger';
import { WidgetApiToWidgetAction, WidgetApiAction, ClientWidgetApi, IWidgetApiRequestData } from 'matrix-widget-api';
import {
WidgetApiToWidgetAction,
WidgetApiAction,
ClientWidgetApi,
IWidgetApiRequestData,
} from 'matrix-widget-api';
import { useParams } from 'react-router-dom';
import { SmallWidget } from '../../../features/call/SmallWidget';
@ -66,10 +70,15 @@ export function CallProvider({ children }: CallProviderProps) {
const [activeCallRoomId, setActiveCallRoomIdState] = useState<string | null>(null);
const [viewedCallRoomId, setViewedCallRoomIdState] = useState<string | null>(null);
const [activeClientWidgetApi, setActiveClientWidgetApiState] = useState<ClientWidgetApi | null>(null);
const [activeClientWidgetApi, setActiveClientWidgetApiState] = useState<ClientWidgetApi | null>(
null
);
const [activeClientWidget, setActiveClientWidget] = useState<SmallWidget | null>(null);
const [activeClientWidgetApiRoomId, setActiveClientWidgetApiRoomId] = useState<string | null>(null);
const [activeClientWidgetIframeRef, setActiveClientWidgetIframeRef] = useState<HTMLIFrameElement | null>(null)
const [activeClientWidgetApiRoomId, setActiveClientWidgetApiRoomId] = useState<string | null>(
null
);
const [activeClientWidgetIframeRef, setActiveClientWidgetIframeRef] =
useState<HTMLIFrameElement | null>(null);
const [isAudioEnabled, setIsAudioEnabledState] = useState<boolean>(DEFAULT_AUDIO_ENABLED);
const [isVideoEnabled, setIsVideoEnabledState] = useState<boolean>(DEFAULT_VIDEO_ENABLED);
@ -78,17 +87,12 @@ export function CallProvider({ children }: CallProviderProps) {
const { roomIdOrAlias: viewedRoomId } = useParams<{ roomIdOrAlias: string }>();
const setActiveCallRoomId = useCallback(
(roomId: string | null) => {
logger.warn(`CallContext: Setting activeCallRoomId to ${roomId}`);
setActiveCallRoomIdState(roomId);
},
[]
);
const setActiveCallRoomId = useCallback((roomId: string | null) => {
setActiveCallRoomIdState(roomId);
}, []);
const setViewedCallRoomId = useCallback(
(roomId: string | null) => {
logger.warn(`CallContext: Setting viewedCallRoomId to ${roomId}`);
setViewedCallRoomIdState(roomId);
},
[setViewedCallRoomIdState]
@ -104,7 +108,7 @@ export function CallProvider({ children }: CallProviderProps) {
setActiveClientWidgetApiState(clientWidgetApi);
setActiveClientWidget(clientWidget);
setActiveClientWidgetApiRoomId(roomId);
setActiveClientWidgetIframeRef(clientWidgetIframeRef)
setActiveClientWidgetIframeRef(clientWidgetIframeRef);
},
[]
);
@ -116,76 +120,51 @@ export function CallProvider({ children }: CallProviderProps) {
clientWidget: SmallWidget | null,
clientWidgetIframeRef: HTMLIFrameElement | null
) => {
if (activeClientWidgetApi && activeClientWidgetApi !== clientWidgetApi) {
logger.debug(`CallContext: Cleaning up listeners for previous clientWidgetApi instance.`);
}
if (roomId && clientWidgetApi) {
logger.debug(`CallContext: Registering active clientWidgetApi for room ${roomId}.`);
setActiveClientWidgetApi(clientWidgetApi, clientWidget, roomId, clientWidgetIframeRef);
} else if (roomId === activeClientWidgetApiRoomId || roomId === null) {
setActiveClientWidgetApi(null, null, null, null);
}
},
[activeClientWidgetApi, activeClientWidgetApiRoomId, setActiveClientWidgetApi]
);
const hangUp = useCallback(
() => {
setActiveClientWidgetApi(null, null, null, null);
setActiveCallRoomIdState(null);
activeClientWidgetApi?.transport.send(`${WIDGET_HANGUP_ACTION}`, {});
setIsActiveCallReady(false);
logger.debug(`CallContext: Hang up called.`);
},
[
activeClientWidgetApi?.transport,
setActiveClientWidgetApi,
]
[activeClientWidgetApiRoomId, setActiveClientWidgetApi]
);
const hangUp = useCallback(() => {
setActiveClientWidgetApi(null, null, null, null);
setActiveCallRoomIdState(null);
activeClientWidgetApi?.transport.send(`${WIDGET_HANGUP_ACTION}`, {});
setIsActiveCallReady(false);
}, [activeClientWidgetApi?.transport, setActiveClientWidgetApi]);
const sendWidgetAction = useCallback(
async <T extends IWidgetApiRequestData = IWidgetApiRequestData,>(action: WidgetApiToWidgetAction | string, data: T): Promise<void> => {
async <T extends IWidgetApiRequestData = IWidgetApiRequestData>(
action: WidgetApiToWidgetAction | string,
data: T
): Promise<void> => {
if (!activeClientWidgetApi) {
logger.warn(
`CallContext: Cannot send action '${action}', no active API clientWidgetApi registered.`
);
return Promise.reject(new Error('No active call clientWidgetApi'));
}
if (!activeClientWidgetApiRoomId || activeClientWidgetApiRoomId !== activeCallRoomId) {
logger.debug(
`CallContext: Cannot send action '${action}', clientWidgetApi room (${activeClientWidgetApiRoomId}) does not match active call room (${activeCallRoomId}). Stale clientWidgetApi?`
);
return Promise.reject(new Error('Mismatched active call clientWidgetApi'));
}
logger.debug(
`CallContext: Sending action '${action}' via active clientWidgetApi (room: ${activeClientWidgetApiRoomId}) with data:`,
data
);
await activeClientWidgetApi.transport.send(action as WidgetApiAction, data);
return Promise.resolve()
return Promise.resolve();
},
[activeClientWidgetApi, activeCallRoomId, activeClientWidgetApiRoomId]
);
const toggleAudio = useCallback(async () => {
const newState = !isAudioEnabled;
logger.debug(`CallContext: Toggling audio. New state: enabled=${newState}`);
setIsAudioEnabledState(newState);
if(isActiveCallReady) {
if (isActiveCallReady) {
try {
await sendWidgetAction(WIDGET_MEDIA_STATE_UPDATE_ACTION, {
audio_enabled: newState,
video_enabled: isVideoEnabled,
});
logger.debug(`CallContext: Successfully sent audio toggle action.`);
} catch (error) {
setIsAudioEnabledState(!newState);
throw error;
@ -195,16 +174,14 @@ export function CallProvider({ children }: CallProviderProps) {
const toggleVideo = useCallback(async () => {
const newState = !isVideoEnabled;
logger.debug(`CallContext: Toggling video. New state: enabled=${newState}`);
setIsVideoEnabledState(newState);
if(isActiveCallReady){
if (isActiveCallReady) {
try {
await sendWidgetAction(WIDGET_MEDIA_STATE_UPDATE_ACTION, {
audio_enabled: isAudioEnabled,
video_enabled: newState,
});
logger.debug(`CallContext: Successfully sent video toggle action.`);
} catch (error) {
setIsVideoEnabledState(!newState);
throw error;
@ -212,7 +189,6 @@ export function CallProvider({ children }: CallProviderProps) {
}
}, [isVideoEnabled, isAudioEnabled, sendWidgetAction, isActiveCallReady]);
useEffect(() => {
if (!activeCallRoomId && !viewedCallRoomId) {
return;
@ -227,29 +203,19 @@ export function CallProvider({ children }: CallProviderProps) {
if (isActiveCallReady && ev.detail.widgetId === activeClientWidgetApi.widget.id) {
activeClientWidgetApi.transport.reply(ev.detail, {});
}
logger.debug(
`CallContext: Received hangup action from widget in room ${activeCallRoomId}.`,
ev
);
};
const handleMediaStateUpdate = (ev: CustomEvent<MediaStatePayload>) => {
if(!isActiveCallReady) return;
if (!isActiveCallReady) return;
ev.preventDefault();
logger.debug(
`CallContext: Received media state update from widget in room ${activeCallRoomId}:`,
ev.detail
);
/* eslint-disable camelcase */
const { audio_enabled, video_enabled } = ev.detail.data ?? {};
if (typeof audio_enabled === 'boolean' && audio_enabled !== isAudioEnabled) {
logger.debug(`CallContext: Updating audio enabled state from widget: ${audio_enabled}`);
setIsAudioEnabledState(audio_enabled);
}
if (typeof video_enabled === 'boolean' && video_enabled !== isVideoEnabled) {
logger.debug(`CallContext: Updating video enabled state from widget: ${video_enabled}`);
setIsVideoEnabledState(video_enabled);
}
/* eslint-enable camelcase */
@ -272,31 +238,24 @@ export function CallProvider({ children }: CallProviderProps) {
activeClientWidgetApi.transport.reply(ev.detail, {});
const iframeDoc =
activeClientWidgetIframeRef?.contentWindow?.document ||
activeClientWidgetIframeRef?.contentWindow?.document ||
activeClientWidgetIframeRef?.contentDocument;
if(iframeDoc){
if (iframeDoc) {
const observer = new MutationObserver(() => {
const button = iframeDoc.querySelector('[data-testid="incall_leave"]');
if (button) {
button.addEventListener('click', () => {
hangUp()
hangUp();
});
}
observer.disconnect();
});
logger.debug('Join Call');
observer.observe(iframeDoc, { childList: true, subtree: true });
}
setIsActiveCallReady(true);
};
logger.debug(
`CallContext: Setting up listeners for clientWidgetApi in room ${activeCallRoomId}`
);
sendWidgetAction(WIDGET_MEDIA_STATE_UPDATE_ACTION, {
audio_enabled: isAudioEnabled,
@ -308,7 +267,6 @@ export function CallProvider({ children }: CallProviderProps) {
activeClientWidgetApi.on(`action:${WIDGET_TILE_UPDATE}`, handleOnTileLayout);
activeClientWidgetApi.on(`action:${WIDGET_ON_SCREEN_ACTION}`, handleOnScreenStateUpdate);
activeClientWidgetApi.on(`action:${WIDGET_JOIN_ACTION}`, handleJoin);
}, [
activeClientWidgetIframeRef,
activeClientWidgetApi,
@ -324,7 +282,7 @@ export function CallProvider({ children }: CallProviderProps) {
setViewedCallRoomId,
activeClientWidget?.iframe?.contentDocument,
activeClientWidget?.iframe?.contentWindow?.document,
sendWidgetAction
sendWidgetAction,
]);
const toggleChat = useCallback(async () => {
@ -349,7 +307,7 @@ export function CallProvider({ children }: CallProviderProps) {
isActiveCallReady,
toggleAudio,
toggleVideo,
toggleChat
toggleChat,
}),
[
activeCallRoomId,
@ -367,7 +325,7 @@ export function CallProvider({ children }: CallProviderProps) {
isActiveCallReady,
toggleAudio,
toggleVideo,
toggleChat
toggleChat,
]
);

90
src/app/pages/client/call/PersistentCallContainer.tsx
View file

@ -1,5 +1,4 @@
import React, { createContext, ReactNode, useCallback, useEffect, useMemo, useRef } from 'react';
import { logger } from 'matrix-js-sdk/lib/logger';
import { ClientWidgetApi } from 'matrix-widget-api';
import { Box } from 'folds';
import { useCallState } from './CallProvider';
@ -18,7 +17,8 @@ interface PersistentCallContainerProps {
children: ReactNode;
}
export const CallRefContext = createContext<React.MutableRefObject<HTMLIFrameElement | null> | null>(null);
export const CallRefContext =
createContext<React.MutableRefObject<HTMLIFrameElement | null> | null>(null);
export function PersistentCallContainer({ children }: PersistentCallContainerProps) {
const callIframeRef = useRef<HTMLIFrameElement | null>(null);
@ -36,7 +36,7 @@ export function PersistentCallContainer({ children }: PersistentCallContainerPro
const mx = useMatrixClient();
const clientConfig = useClientConfig();
const screenSize = useScreenSizeContext();
const theme = useTheme()
const theme = useTheme();
const isMobile = screenSize === ScreenSize.Mobile;
/* eslint-disable no-param-reassign */
@ -50,13 +50,11 @@ export function PersistentCallContainer({ children }: PersistentCallContainerPro
themeKind: ThemeKind | null
) => {
if (mx?.getUserId()) {
logger.debug(`PersistentCallContainer: (setupWidget) activeCallRoomId: ${activeCallRoomId} viewedId: ${viewedCallRoomId} isactive: ${isActiveCallReady}`)
if (
(activeCallRoomId !== viewedCallRoomId && isActiveCallReady) ||
(activeCallRoomId && !isActiveCallReady) ||
(!activeCallRoomId && viewedCallRoomId && !isActiveCallReady)
) {
const roomIdToSet = (skipLobby ? activeCallRoomId : viewedCallRoomId) ?? '';
if (roomIdToSet === '') {
@ -73,18 +71,22 @@ export function PersistentCallContainer({ children }: PersistentCallContainerPro
skipLobby: skipLobby.toString(),
returnToLobby: 'true',
perParticipantE2EE: 'true',
theme: themeKind
theme: themeKind,
}
);
if (
callSmallWidgetRef.current?.roomId &&
(activeClientWidget?.roomId && activeClientWidget.roomId === callSmallWidgetRef.current?.roomId)
activeClientWidget?.roomId &&
activeClientWidget.roomId === callSmallWidgetRef.current?.roomId
) {
return;
}
if (iframeRef.current && (!iframeRef.current.src || iframeRef.current.src !== newUrl.toString())) {
if (
iframeRef.current &&
(!iframeRef.current.src || iframeRef.current.src !== newUrl.toString())
) {
iframeRef.current.src = newUrl.toString();
}
@ -111,11 +113,12 @@ export function PersistentCallContainer({ children }: PersistentCallContainerPro
const widgetApiInstance = smallWidget.startMessaging(iframeElement);
widgetApiRef.current = widgetApiInstance;
registerActiveClientWidgetApi(roomIdToSet, widgetApiRef.current, smallWidget, iframeElement);
widgetApiInstance.once('ready', () => {
logger.info(`PersistentCallContainer: Widget for ${roomIdToSet} is ready.`);
});
registerActiveClientWidgetApi(
roomIdToSet,
widgetApiRef.current,
smallWidget,
iframeElement
);
}
}
},
@ -131,9 +134,8 @@ export function PersistentCallContainer({ children }: PersistentCallContainerPro
);
useEffect(() => {
if (activeCallRoomId){
if (activeCallRoomId) {
setupWidget(callWidgetApiRef, callSmallWidgetRef, callIframeRef, true, theme.kind);
logger.debug(`PersistentCallContainer: set call widget: ${callWidgetApiRef.current?.eventNames()} ${callSmallWidgetRef.current} ${callIframeRef.current?.baseURI}`)
}
}, [
theme,
@ -144,50 +146,50 @@ export function PersistentCallContainer({ children }: PersistentCallContainerPro
registerActiveClientWidgetApi,
activeCallRoomId,
viewedCallRoomId,
isActiveCallReady
isActiveCallReady,
]);
const memoizedIframeRef = useMemo(() => callIframeRef, [callIframeRef]);
return (
<CallRefContext.Provider value={memoizedIframeRef}>
<Box grow="No">
<Box grow="No">
<Box
direction="Column"
style={{
position: 'relative',
zIndex: 0,
display: isMobile && isChatOpen ? 'none' : 'flex',
width: isMobile && isChatOpen ? '0%' : '100%',
height: isMobile && isChatOpen ? '0%' : '100%',
}}
>
<Box
direction="Column"
grow="Yes"
style={{
position: 'relative',
zIndex: 0,
display: isMobile && isChatOpen ? 'none' : 'flex',
width: isMobile && isChatOpen ? '0%' : '100%',
height: isMobile && isChatOpen ? '0%' : '100%',
}}
>
<Box
grow="Yes"
<iframe
ref={callIframeRef}
style={{
position: 'relative',
position: 'absolute',
top: 0,
left: 0,
display: 'flex',
width: '100%',
height: '100%',
border: 'none',
}}
>
<iframe
ref={callIframeRef}
style={{
position: 'absolute',
top: 0,
left: 0,
display: 'flex',
width: '100%',
height: '100%',
border: 'none',
}}
title="Persistent Element Call"
sandbox="allow-forms allow-scripts allow-same-origin allow-popups allow-modals allow-downloads"
allow="microphone; camera; display-capture; autoplay; clipboard-write;"
src="about:blank"
/>
</Box>
title="Persistent Element Call"
sandbox="allow-forms allow-scripts allow-same-origin allow-popups allow-modals allow-downloads"
allow="microphone; camera; display-capture; autoplay; clipboard-write;"
src="about:blank"
/>
</Box>
</Box>
{children}
</Box>
{children}
</CallRefContext.Provider>
);
}