jaredandClaude Sonnet 4.6
0ebe24be20
- Remove revert-to-grid logic that was overriding EC's natural screenshare spotlight, causing fullscreen to show user avatars instead of the screen - Add fullscreen button to call controls (visible when screensharing) that requests fullscreen on the call embed container - Add FullscreenButton component with enter/exit SVG icons to Controls.tsx - PIP mode: sync setPipMode to CallControl; auto-enable spotlight when screenshare is active in pip so the screenshare fills the window - Make useCallControlState accept undefined control for safe use in CallEmbedProvider - Add package-lock.json to .gitignore (generated by local npm install) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
55 lines
1.6 KiB
TypeScript
55 lines
1.6 KiB
TypeScript
import {
|
|
ClientWidgetApi,
|
|
IWidgetApiAcknowledgeResponseData,
|
|
IWidgetApiRequestData,
|
|
} from 'matrix-widget-api';
|
|
import { useCallback, useEffect, useState } from 'react';
|
|
import { CallControl, CallControlEvent } from './CallControl';
|
|
import { CallControlState } from './CallControlState';
|
|
|
|
export const useClientWidgetApiEvent = <T>(
|
|
api: ClientWidgetApi | undefined,
|
|
type: string,
|
|
callback: (event: CustomEvent<T>) => void,
|
|
) => {
|
|
useEffect(() => {
|
|
api?.on(`action:${type}`, callback);
|
|
return () => {
|
|
api?.off(`action:${type}`, callback);
|
|
};
|
|
}, [api, type, callback]);
|
|
};
|
|
|
|
export const useSendClientWidgetApiAction = (api: ClientWidgetApi) => {
|
|
const sendWidgetAction = useCallback(
|
|
async <T extends IWidgetApiRequestData = IWidgetApiRequestData>(
|
|
action: string,
|
|
data: T,
|
|
): Promise<IWidgetApiAcknowledgeResponseData> => api.transport.send(action, data),
|
|
[api],
|
|
);
|
|
|
|
return sendWidgetAction;
|
|
};
|
|
|
|
const DEFAULT_CONTROL_STATE = new CallControlState(false, false, false);
|
|
|
|
export const useCallControlState = (control: CallControl | undefined): CallControlState => {
|
|
const [state, setState] = useState(control?.getState() ?? DEFAULT_CONTROL_STATE);
|
|
|
|
useEffect(() => {
|
|
if (!control) {
|
|
setState(DEFAULT_CONTROL_STATE);
|
|
return;
|
|
}
|
|
setState(control.getState());
|
|
const handleUpdate = () => setState(control.getState());
|
|
control.on(CallControlEvent.StateUpdate, handleUpdate);
|
|
return () => {
|
|
control.off(CallControlEvent.StateUpdate, handleUpdate);
|
|
};
|
|
}, [control]);
|
|
|
|
return state;
|
|
};
|