Fix widgets getting stuck in loading states (#31314)
* Refer to ClientWidgetApi as "widget API" rather than "messaging" * Rename StopGapWidgetDriver to ElementWidgetDriver * Rename StopGapWidget to WidgetMessaging * Fix WidgetMessaging's lifetime by storing it in WidgetMessagingStore (Rather than storing just the raw ClientWidgetApi objects.) * Unfail test * use an error * cleanup start * Add docs * Prettier * link to store * remove a let * More logging, split up loop * Add a test demonstrating a regression in Call.start * Restore Call.start to a single, robust event loop * Fix test failure by resetting the messaging store * Expand on the WidgetMessaging doc comment * Add additional tests to buff up coverage * Add a test for the sticker picker opening the IM. * reduce copy paste --------- Co-authored-by: Half-Shot <will@half-shot.uk> Co-authored-by: Timo K <toger5@hotmail.de>
This commit is contained in:
Robin
GitHub
@@ -1055,9 +1055,9 @@ export default class LegacyCallHandler extends TypedEventEmitter<LegacyCallHandl
|
||||
const jitsiWidgets = roomInfo.widgets.filter((w) => WidgetType.JITSI.matches(w.type));
|
||||
jitsiWidgets.forEach((w) => {
|
||||
const messaging = WidgetMessagingStore.instance.getMessagingForUid(WidgetUtils.getWidgetUid(w));
|
||||
if (!messaging) return; // more "should never happen" words
|
||||
if (!messaging?.widgetApi) return; // more "should never happen" words
|
||||
|
||||
messaging.transport.send(ElementWidgetActions.HangupCall, {});
|
||||
messaging.widgetApi.transport.send(ElementWidgetActions.HangupCall, {});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@@ -41,12 +41,12 @@ async function createLiveStream(matrixClient: MatrixClient, roomId: string): Pro
|
||||
|
||||
export async function startJitsiAudioLivestream(
|
||||
matrixClient: MatrixClient,
|
||||
widgetMessaging: ClientWidgetApi,
|
||||
widgetApi: ClientWidgetApi,
|
||||
roomId: string,
|
||||
): Promise<void> {
|
||||
const streamId = await createLiveStream(matrixClient, roomId);
|
||||
|
||||
await widgetMessaging.transport.send(ElementWidgetActions.StartLiveStream, {
|
||||
await widgetApi.transport.send(ElementWidgetActions.StartLiveStream, {
|
||||
rtmpStreamKey: AUDIOSTREAM_DUMMY_URL + streamId,
|
||||
});
|
||||
}
|
||||
|
||||
@@ -7,7 +7,7 @@ Please see LICENSE files in the repository root for full details.
|
||||
*/
|
||||
|
||||
import React, { type JSX, type ComponentProps, useContext } from "react";
|
||||
import { type ClientWidgetApi, type IWidget, MatrixCapabilities } from "matrix-widget-api";
|
||||
import { type IWidget, MatrixCapabilities } from "matrix-widget-api";
|
||||
import { logger } from "matrix-js-sdk/src/logger";
|
||||
import { type ApprovalOpts, WidgetLifecycle } from "@matrix-org/react-sdk-module-api/lib/lifecycles/WidgetLifecycle";
|
||||
import { type MatrixClient, type Room } from "matrix-js-sdk/src/matrix";
|
||||
@@ -28,7 +28,7 @@ import MatrixClientContext from "../../../contexts/MatrixClientContext";
|
||||
import { Container, WidgetLayoutStore } from "../../../stores/widgets/WidgetLayoutStore";
|
||||
import { getConfigLivestreamUrl, startJitsiAudioLivestream } from "../../../Livestream";
|
||||
import { ModuleRunner } from "../../../modules/ModuleRunner";
|
||||
import { ElementWidget } from "../../../stores/widgets/StopGapWidget";
|
||||
import { ElementWidget, type WidgetMessaging } from "../../../stores/widgets/WidgetMessaging";
|
||||
import { useScopedRoomContext } from "../../../contexts/ScopedRoomContext.tsx";
|
||||
|
||||
interface IProps extends Omit<ComponentProps<typeof IconizedContextMenu>, "children"> {
|
||||
@@ -69,10 +69,10 @@ const showDeleteButton = (canModify: boolean, onDeleteClick: undefined | (() =>
|
||||
return !!onDeleteClick || canModify;
|
||||
};
|
||||
|
||||
const showSnapshotButton = (widgetMessaging: ClientWidgetApi | undefined): boolean => {
|
||||
const showSnapshotButton = (widgetMessaging: WidgetMessaging | undefined): boolean => {
|
||||
return (
|
||||
SettingsStore.getValue("enableWidgetScreenshots") &&
|
||||
!!widgetMessaging?.hasCapability(MatrixCapabilities.Screenshots)
|
||||
!!widgetMessaging?.widgetApi?.hasCapability(MatrixCapabilities.Screenshots)
|
||||
);
|
||||
};
|
||||
|
||||
@@ -123,7 +123,7 @@ export const WidgetContextMenu: React.FC<IProps> = ({
|
||||
if (roomId && showStreamAudioStreamButton(app)) {
|
||||
const onStreamAudioClick = async (): Promise<void> => {
|
||||
try {
|
||||
await startJitsiAudioLivestream(cli, widgetMessaging!, roomId);
|
||||
await startJitsiAudioLivestream(cli, widgetMessaging!.widgetApi!, roomId);
|
||||
} catch (err) {
|
||||
logger.error("Failed to start livestream", err);
|
||||
// XXX: won't i18n well, but looks like widget api only support 'message'?
|
||||
@@ -161,7 +161,7 @@ export const WidgetContextMenu: React.FC<IProps> = ({
|
||||
let snapshotButton: JSX.Element | undefined;
|
||||
if (showSnapshotButton(widgetMessaging)) {
|
||||
const onSnapshotClick = (): void => {
|
||||
widgetMessaging
|
||||
widgetMessaging?.widgetApi
|
||||
?.takeScreenshot()
|
||||
.then((data) => {
|
||||
dis.dispatch({
|
||||
|
||||
@@ -27,11 +27,11 @@ import { ErrorIcon } from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
import BaseDialog from "./BaseDialog";
|
||||
import { _t, getUserLanguage } from "../../../languageHandler";
|
||||
import AccessibleButton, { type AccessibleButtonKind } from "../elements/AccessibleButton";
|
||||
import { StopGapWidgetDriver } from "../../../stores/widgets/StopGapWidgetDriver";
|
||||
import { ElementWidgetDriver } from "../../../stores/widgets/ElementWidgetDriver";
|
||||
import { MatrixClientPeg } from "../../../MatrixClientPeg";
|
||||
import { OwnProfileStore } from "../../../stores/OwnProfileStore";
|
||||
import { arrayFastClone } from "../../../utils/arrays";
|
||||
import { ElementWidget } from "../../../stores/widgets/StopGapWidget";
|
||||
import { ElementWidget } from "../../../stores/widgets/WidgetMessaging";
|
||||
import { ELEMENT_CLIENT_ID } from "../../../identifiers";
|
||||
import ThemeWatcher, { ThemeWatcherEvent } from "../../../settings/watchers/ThemeWatcher";
|
||||
|
||||
@@ -72,7 +72,7 @@ export default class ModalWidgetDialog extends React.PureComponent<IProps, IStat
|
||||
}
|
||||
|
||||
public componentDidMount(): void {
|
||||
const driver = new StopGapWidgetDriver([], this.widget, WidgetKind.Modal, false);
|
||||
const driver = new ElementWidgetDriver(this.widget, WidgetKind.Modal, false);
|
||||
const messaging = new ClientWidgetApi(this.widget, this.appFrame.current!, driver);
|
||||
this.setState({ messaging });
|
||||
}
|
||||
|
||||
@@ -18,7 +18,7 @@ import React, {
|
||||
type ReactNode,
|
||||
} from "react";
|
||||
import classNames from "classnames";
|
||||
import { type IWidget, MatrixCapabilities } from "matrix-widget-api";
|
||||
import { type IWidget, MatrixCapabilities, type ClientWidgetApi } from "matrix-widget-api";
|
||||
import { type Room, RoomEvent } from "matrix-js-sdk/src/matrix";
|
||||
import { KnownMembership } from "matrix-js-sdk/src/types";
|
||||
import { logger } from "matrix-js-sdk/src/logger";
|
||||
@@ -42,7 +42,7 @@ import SettingsStore from "../../../settings/SettingsStore";
|
||||
import { aboveLeftOf, ContextMenuButton } from "../../structures/ContextMenu";
|
||||
import PersistedElement, { getPersistKey } from "./PersistedElement";
|
||||
import { WidgetType } from "../../../widgets/WidgetType";
|
||||
import { ElementWidget, StopGapWidget } from "../../../stores/widgets/StopGapWidget";
|
||||
import { ElementWidget, WidgetMessaging, WidgetMessagingEvent } from "../../../stores/widgets/WidgetMessaging";
|
||||
import { showContextMenu, WidgetContextMenu } from "../context_menus/WidgetContextMenu";
|
||||
import WidgetAvatar from "../avatars/WidgetAvatar";
|
||||
import LegacyCallHandler from "../../../LegacyCallHandler";
|
||||
@@ -151,11 +151,12 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
showLayoutButtons: true,
|
||||
};
|
||||
|
||||
private readonly widget: ElementWidget;
|
||||
private contextMenuButton = createRef<any>();
|
||||
private iframeParent: HTMLElement | null = null; // parent div of the iframe
|
||||
private allowedWidgetsWatchRef?: string;
|
||||
private persistKey: string;
|
||||
private sgWidget?: StopGapWidget;
|
||||
private messaging?: WidgetMessaging;
|
||||
private dispatcherRef?: string;
|
||||
private unmounted = false;
|
||||
|
||||
@@ -164,11 +165,16 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
|
||||
// The key used for PersistedElement
|
||||
this.persistKey = getPersistKey(WidgetUtils.getWidgetUid(this.props.app));
|
||||
try {
|
||||
this.sgWidget = new StopGapWidget(this.props);
|
||||
} catch (e) {
|
||||
logger.log("Failed to construct widget", e);
|
||||
this.sgWidget = undefined;
|
||||
|
||||
this.widget = new ElementWidget(props.app);
|
||||
this.messaging = WidgetMessagingStore.instance.getMessaging(this.widget, props.room?.roomId);
|
||||
if (this.messaging === undefined) {
|
||||
try {
|
||||
this.messaging = new WidgetMessaging(this.widget, props);
|
||||
WidgetMessagingStore.instance.storeMessaging(this.widget, props.room?.roomId, this.messaging);
|
||||
} catch (e) {
|
||||
logger.error("Failed to construct widget", e);
|
||||
}
|
||||
}
|
||||
|
||||
this.state = this.getNewState(props);
|
||||
@@ -235,11 +241,11 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
|
||||
private determineInitialRequiresClientState(): boolean {
|
||||
try {
|
||||
const mockWidget = new ElementWidget(this.props.app);
|
||||
const widgetApi = WidgetMessagingStore.instance.getMessaging(mockWidget, this.props.room?.roomId);
|
||||
if (widgetApi) {
|
||||
const widget = new ElementWidget(this.props.app);
|
||||
const messaging = WidgetMessagingStore.instance.getMessaging(widget, this.props.room?.roomId);
|
||||
if (messaging?.widgetApi) {
|
||||
// Load value from existing API to prevent resetting the requiresClient value on layout changes.
|
||||
return widgetApi.hasCapability(ElementWidgetCapabilities.RequiresClient);
|
||||
return messaging.widgetApi.hasCapability(ElementWidgetCapabilities.RequiresClient);
|
||||
}
|
||||
} catch {
|
||||
// fallback to true
|
||||
@@ -291,7 +297,7 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
isAppWidget(this.props.app) ? this.props.app.roomId : null,
|
||||
);
|
||||
PersistedElement.destroyElement(this.persistKey);
|
||||
this.sgWidget?.stopMessaging();
|
||||
this.messaging?.stop();
|
||||
}
|
||||
|
||||
this.setState({ hasPermissionToLoad });
|
||||
@@ -325,12 +331,12 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
);
|
||||
}
|
||||
|
||||
if (this.sgWidget) {
|
||||
this.setupSgListeners();
|
||||
if (this.messaging) {
|
||||
this.setupMessagingListeners();
|
||||
}
|
||||
|
||||
// Only fetch IM token on mount if we're showing and have permission to load
|
||||
if (this.sgWidget && this.state.hasPermissionToLoad) {
|
||||
if (this.messaging && this.state.hasPermissionToLoad) {
|
||||
this.startWidget();
|
||||
}
|
||||
this.watchUserReady();
|
||||
@@ -376,73 +382,56 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
OwnProfileStore.instance.removeListener(UPDATE_EVENT, this.onUserReady);
|
||||
}
|
||||
|
||||
private setupSgListeners(): void {
|
||||
this.sgWidget?.on("ready", this.onWidgetReady);
|
||||
this.sgWidget?.on("error:preparing", this.updateRequiresClient);
|
||||
// emits when the capabilities have been set up or changed
|
||||
this.sgWidget?.on("capabilitiesNotified", this.updateRequiresClient);
|
||||
private setupMessagingListeners(): void {
|
||||
this.messaging?.on(WidgetMessagingEvent.Start, this.onMessagingStart);
|
||||
this.messaging?.on(WidgetMessagingEvent.Stop, this.onMessagingStop);
|
||||
}
|
||||
|
||||
private stopSgListeners(): void {
|
||||
if (!this.sgWidget) return;
|
||||
this.sgWidget?.off("ready", this.onWidgetReady);
|
||||
this.sgWidget.off("error:preparing", this.updateRequiresClient);
|
||||
this.sgWidget.off("capabilitiesNotified", this.updateRequiresClient);
|
||||
private stopMessagingListeners(): void {
|
||||
this.messaging?.off(WidgetMessagingEvent.Start, this.onMessagingStart);
|
||||
this.messaging?.off(WidgetMessagingEvent.Stop, this.onMessagingStop);
|
||||
}
|
||||
|
||||
private readonly onMessagingStart = (widgetApi: ClientWidgetApi): void => {
|
||||
widgetApi.on("ready", this.onWidgetReady);
|
||||
widgetApi.on("error:preparing", this.updateRequiresClient);
|
||||
// emits when the capabilities have been set up or changed
|
||||
widgetApi.on("capabilitiesNotified", this.updateRequiresClient);
|
||||
};
|
||||
|
||||
private readonly onMessagingStop = (widgetApi: ClientWidgetApi): void => {
|
||||
widgetApi.off("ready", this.onWidgetReady);
|
||||
widgetApi.off("error:preparing", this.updateRequiresClient);
|
||||
widgetApi.off("capabilitiesNotified", this.updateRequiresClient);
|
||||
};
|
||||
|
||||
private resetWidget(newProps: IProps): void {
|
||||
this.sgWidget?.stopMessaging();
|
||||
this.stopSgListeners();
|
||||
this.messaging?.stop();
|
||||
this.stopMessagingListeners();
|
||||
|
||||
try {
|
||||
this.sgWidget = new StopGapWidget(newProps);
|
||||
this.setupSgListeners();
|
||||
WidgetMessagingStore.instance.stopMessaging(this.widget, this.props.room?.roomId);
|
||||
this.messaging = new WidgetMessaging(this.widget, newProps);
|
||||
WidgetMessagingStore.instance.storeMessaging(this.widget, this.props.room?.roomId, this.messaging);
|
||||
this.setupMessagingListeners();
|
||||
this.startWidget();
|
||||
} catch (e) {
|
||||
logger.error("Failed to construct widget", e);
|
||||
this.sgWidget = undefined;
|
||||
this.messaging = undefined;
|
||||
}
|
||||
}
|
||||
|
||||
private startWidget(): void {
|
||||
this.sgWidget?.prepare().then(() => {
|
||||
this.messaging?.prepare().then(() => {
|
||||
if (this.unmounted) return;
|
||||
this.setState({ initialising: false });
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Creates the widget iframe and opens communication with the widget.
|
||||
*/
|
||||
private startMessaging(): void {
|
||||
// We create the iframe ourselves rather than leaving the job to React,
|
||||
// because we need the lifetime of the messaging and the iframe to be
|
||||
// the same; we don't want strict mode, for instance, to cause the
|
||||
// messaging to restart (lose its state) without also killing the widget
|
||||
const iframe = document.createElement("iframe");
|
||||
iframe.title = WidgetUtils.getWidgetName(this.props.app);
|
||||
iframe.allow = iframeFeatures;
|
||||
iframe.src = this.sgWidget!.embedUrl;
|
||||
iframe.allowFullscreen = true;
|
||||
iframe.sandbox = sandboxFlags;
|
||||
this.iframeParent!.appendChild(iframe);
|
||||
// In order to start the widget messaging we need iframe.contentWindow
|
||||
// to exist. Waiting until the next layout gives the browser a chance to
|
||||
// initialize it.
|
||||
requestAnimationFrame(() => {
|
||||
// Handle the race condition (seen in strict mode) where the element
|
||||
// is added and then removed before we enter this callback
|
||||
if (iframe.parentElement === null) return;
|
||||
try {
|
||||
this.sgWidget?.startMessaging(iframe);
|
||||
} catch (e) {
|
||||
logger.error("Failed to start widget", e);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Callback ref for the parent div of the iframe.
|
||||
* A callback ref receiving the current parent div of the iframe. This is
|
||||
* responsible for creating the iframe and starting or resetting
|
||||
* communication with the widget.
|
||||
*/
|
||||
private iframeParentRef = (element: HTMLElement | null): void => {
|
||||
if (this.unmounted) return;
|
||||
@@ -451,10 +440,43 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
this.iframeParent?.querySelector("iframe")?.remove();
|
||||
this.iframeParent = element;
|
||||
|
||||
if (element && this.sgWidget) {
|
||||
this.startMessaging();
|
||||
} else {
|
||||
if (this.iframeParent === null) {
|
||||
// The component is trying to unmount the iframe. We could reach
|
||||
// this path if the widget definition was updated, for example. The
|
||||
// iframe parent will later be remounted and widget communications
|
||||
// reopened after this.state.initializing resets to false.
|
||||
this.resetWidget(this.props);
|
||||
} else if (
|
||||
this.messaging &&
|
||||
// Check whether an iframe already exists (it totally could exist,
|
||||
// seeing as it is a persisted element which might have hopped
|
||||
// between React components)
|
||||
this.iframeParent.querySelector("iframe") === null
|
||||
) {
|
||||
// We create the iframe ourselves rather than leaving the job to React,
|
||||
// because we need the lifetime of the messaging and the iframe to be
|
||||
// the same; we don't want strict mode, for instance, to cause the
|
||||
// messaging to restart (lose its state) without also killing the widget
|
||||
const iframe = document.createElement("iframe");
|
||||
iframe.title = WidgetUtils.getWidgetName(this.props.app);
|
||||
iframe.allow = iframeFeatures;
|
||||
iframe.src = this.messaging.embedUrl;
|
||||
iframe.allowFullscreen = true;
|
||||
iframe.sandbox = sandboxFlags;
|
||||
this.iframeParent.appendChild(iframe);
|
||||
// In order to start the widget messaging we need iframe.contentWindow
|
||||
// to exist. Waiting until the next layout gives the browser a chance to
|
||||
// initialize it.
|
||||
requestAnimationFrame(() => {
|
||||
// Handle the race condition (seen in strict mode) where the element is
|
||||
// added and then removed from the DOM before we enter this callback
|
||||
if (iframe.parentElement === null) return;
|
||||
try {
|
||||
this.messaging?.start(iframe);
|
||||
} catch (e) {
|
||||
logger.error("Failed to start widget", e);
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
@@ -484,7 +506,7 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
isAppWidget(this.props.app) ? this.props.app.roomId : null,
|
||||
);
|
||||
|
||||
this.sgWidget?.stopMessaging({ forceDestroy: true });
|
||||
this.messaging?.stop({ forceDestroy: true });
|
||||
}
|
||||
|
||||
private onWidgetReady = (): void => {
|
||||
@@ -493,7 +515,7 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
|
||||
private updateRequiresClient = (): void => {
|
||||
this.setState({
|
||||
requiresClient: !!this.sgWidget?.widgetApi?.hasCapability(ElementWidgetCapabilities.RequiresClient),
|
||||
requiresClient: !!this.messaging?.widgetApi?.hasCapability(ElementWidgetCapabilities.RequiresClient),
|
||||
});
|
||||
};
|
||||
|
||||
@@ -502,7 +524,7 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
case "m.sticker":
|
||||
if (
|
||||
payload.widgetId === this.props.app.id &&
|
||||
this.sgWidget?.widgetApi?.hasCapability(MatrixCapabilities.StickerSending)
|
||||
this.messaging?.widgetApi?.hasCapability(MatrixCapabilities.StickerSending)
|
||||
) {
|
||||
dis.dispatch({
|
||||
action: "post_sticker_message",
|
||||
@@ -602,7 +624,7 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
// window.open(this._getPopoutUrl(), '_blank', 'noopener=yes');
|
||||
Object.assign(document.createElement("a"), {
|
||||
target: "_blank",
|
||||
href: this.sgWidget?.popoutUrl,
|
||||
href: this.messaging?.popoutUrl,
|
||||
rel: "noreferrer noopener",
|
||||
}).click();
|
||||
};
|
||||
@@ -665,13 +687,13 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
</div>
|
||||
);
|
||||
|
||||
if (this.sgWidget === null) {
|
||||
if (this.messaging === null) {
|
||||
appTileBody = (
|
||||
<div className={appTileBodyClass} style={appTileBodyStyles}>
|
||||
<AppWarning errorMsg={_t("widget|error_loading")} />
|
||||
</div>
|
||||
);
|
||||
} else if (!this.state.hasPermissionToLoad && this.props.room && this.sgWidget) {
|
||||
} else if (!this.state.hasPermissionToLoad && this.props.room && this.messaging) {
|
||||
// only possible for room widgets, can assert this.props.room here
|
||||
const isEncrypted = this.context.isRoomEncrypted(this.props.room.roomId);
|
||||
appTileBody = (
|
||||
@@ -679,7 +701,7 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
<AppPermission
|
||||
roomId={this.props.room.roomId}
|
||||
creatorUserId={this.props.creatorUserId}
|
||||
url={this.sgWidget.embedUrl}
|
||||
url={this.messaging.embedUrl}
|
||||
isRoomEncrypted={isEncrypted}
|
||||
onPermissionGranted={this.grantWidgetPermission}
|
||||
/>
|
||||
@@ -698,7 +720,7 @@ export default class AppTile extends React.Component<IProps, IState> {
|
||||
<AppWarning errorMsg={_t("widget|error_mixed_content")} />
|
||||
</div>
|
||||
);
|
||||
} else if (this.sgWidget) {
|
||||
} else if (this.messaging) {
|
||||
appTileBody = (
|
||||
<>
|
||||
<div className={appTileBodyClass} style={appTileBodyStyles} ref={this.iframeParentRef}>
|
||||
|
||||
@@ -89,7 +89,7 @@ export const WidgetPip: FC<Props> = ({ widgetId, room, viewingRoom, onStartMovin
|
||||
// Assumed to be a Jitsi widget
|
||||
WidgetMessagingStore.instance
|
||||
.getMessagingForUid(WidgetUtils.getWidgetUid(widget))
|
||||
?.transport.send(ElementWidgetActions.HangupCall, {})
|
||||
?.widgetApi?.transport.send(ElementWidgetActions.HangupCall, {})
|
||||
.catch((e) => console.error("Failed to leave Jitsi", e));
|
||||
}
|
||||
},
|
||||
|
||||
@@ -224,8 +224,8 @@ export default class Stickerpicker extends React.PureComponent<IProps, IState> {
|
||||
const messaging = WidgetMessagingStore.instance.getMessagingForUid(
|
||||
WidgetUtils.calcWidgetUid(this.state.stickerpickerWidget.id),
|
||||
);
|
||||
if (messaging && visible !== this.prevSentVisibility) {
|
||||
messaging.updateVisibility(visible).catch((err) => {
|
||||
if (messaging?.widgetApi && visible !== this.prevSentVisibility) {
|
||||
messaging.widgetApi.updateVisibility(visible).catch((err) => {
|
||||
logger.error("Error updating widget visibility: ", err);
|
||||
});
|
||||
this.prevSentVisibility = visible;
|
||||
|
||||
@@ -16,7 +16,7 @@ import {
|
||||
type RoomMember,
|
||||
} from "matrix-js-sdk/src/matrix";
|
||||
import { KnownMembership, type Membership } from "matrix-js-sdk/src/types";
|
||||
import { logger } from "matrix-js-sdk/src/logger";
|
||||
import { logger as rootLogger } from "matrix-js-sdk/src/logger";
|
||||
import { secureRandomString } from "matrix-js-sdk/src/randomstring";
|
||||
import { CallType } from "matrix-js-sdk/src/webrtc/call";
|
||||
import { type IWidgetApiRequest, type ClientWidgetApi, type IWidgetData } from "matrix-widget-api";
|
||||
@@ -43,8 +43,10 @@ import { FontWatcher } from "../settings/watchers/FontWatcher";
|
||||
import { type JitsiCallMemberContent, JitsiCallMemberEventType } from "../call-types";
|
||||
import SdkConfig from "../SdkConfig.ts";
|
||||
import DMRoomMap from "../utils/DMRoomMap.ts";
|
||||
import { type WidgetMessaging, WidgetMessagingEvent } from "../stores/widgets/WidgetMessaging.ts";
|
||||
|
||||
const TIMEOUT_MS = 16000;
|
||||
const logger = rootLogger.getChild("models/Call");
|
||||
|
||||
// Waits until an event is emitted satisfying the given predicate
|
||||
const waitForEvent = async (
|
||||
@@ -122,15 +124,15 @@ export abstract class Call extends TypedEventEmitter<CallEvent, CallEventHandler
|
||||
*/
|
||||
public abstract readonly STUCK_DEVICE_TIMEOUT_MS: number;
|
||||
|
||||
private _messaging: ClientWidgetApi | null = null;
|
||||
private _widgetApi: ClientWidgetApi | null = null;
|
||||
/**
|
||||
* The widget's messaging, or null if disconnected.
|
||||
* The widget API interface to the widget, or null if disconnected.
|
||||
*/
|
||||
protected get messaging(): ClientWidgetApi | null {
|
||||
return this._messaging;
|
||||
protected get widgetApi(): ClientWidgetApi | null {
|
||||
return this._widgetApi;
|
||||
}
|
||||
private set messaging(value: ClientWidgetApi | null) {
|
||||
this._messaging = value;
|
||||
private set widgetApi(value: ClientWidgetApi | null) {
|
||||
this._widgetApi = value;
|
||||
}
|
||||
|
||||
public get roomId(): string {
|
||||
@@ -212,28 +214,58 @@ export abstract class Call extends TypedEventEmitter<CallEvent, CallEventHandler
|
||||
* Starts the communication between the widget and the call.
|
||||
* The widget associated with the call must be active for this to succeed.
|
||||
* Only call this if the call state is: ConnectionState.Disconnected.
|
||||
* @param _params Widget generation parameters are unused in this abstract class.
|
||||
* @returns The ClientWidgetApi for this call.
|
||||
*/
|
||||
public async start(_params?: WidgetGenerationParameters): Promise<void> {
|
||||
public async start(_params?: WidgetGenerationParameters): Promise<ClientWidgetApi> {
|
||||
const messagingStore = WidgetMessagingStore.instance;
|
||||
this.messaging = messagingStore.getMessagingForUid(this.widgetUid) ?? null;
|
||||
if (!this.messaging) {
|
||||
// The widget might still be initializing, so wait for it.
|
||||
const startTime = performance.now();
|
||||
let messaging: WidgetMessaging | undefined = messagingStore.getMessagingForUid(this.widgetUid);
|
||||
// The widget might still be initializing, so wait for it in an async
|
||||
// event loop. We need the messaging to be both present and started
|
||||
// (have a connected widget API), so register listeners for both cases.
|
||||
while (!messaging?.widgetApi) {
|
||||
if (messaging) logger.debug(`Messaging present but not yet started for ${this.widgetUid}`);
|
||||
else logger.debug(`No messaging yet for ${this.widgetUid}`);
|
||||
const recheck = Promise.withResolvers<void>();
|
||||
const currentMessaging = messaging;
|
||||
|
||||
// Maybe the messaging is present but not yet started. In this case,
|
||||
// check again for a widget API as soon as it starts.
|
||||
const onStart = (): void => recheck.resolve();
|
||||
currentMessaging?.on(WidgetMessagingEvent.Start, onStart);
|
||||
|
||||
// Maybe the messaging is not present at all. It's also entirely
|
||||
// possible (as shown in React strict mode) that the messaging could
|
||||
// be abandoned and replaced by an entirely new messaging object
|
||||
// while we were waiting for the original one to start. We need to
|
||||
// react to store updates in either case.
|
||||
const onStoreMessaging = (uid: string, m: WidgetMessaging): void => {
|
||||
if (uid === this.widgetUid) {
|
||||
messagingStore.off(WidgetMessagingStoreEvent.StoreMessaging, onStoreMessaging);
|
||||
messaging = m; // Check the new messaging object on the next iteration of the loop
|
||||
recheck.resolve();
|
||||
}
|
||||
};
|
||||
messagingStore.on(WidgetMessagingStoreEvent.StoreMessaging, onStoreMessaging);
|
||||
|
||||
// Race both of the above recheck signals against a timeout.
|
||||
const timeout = setTimeout(
|
||||
() => recheck.reject(new Error(`Widget for call in ${this.roomId} not started; timed out`)),
|
||||
TIMEOUT_MS - (performance.now() - startTime),
|
||||
);
|
||||
|
||||
try {
|
||||
await waitForEvent(
|
||||
messagingStore,
|
||||
WidgetMessagingStoreEvent.StoreMessaging,
|
||||
(uid: string, widgetApi: ClientWidgetApi) => {
|
||||
if (uid === this.widgetUid) {
|
||||
this.messaging = widgetApi;
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
);
|
||||
} catch (e) {
|
||||
throw new Error(`Failed to bind call widget in room ${this.roomId}: ${e}`);
|
||||
await recheck.promise;
|
||||
} finally {
|
||||
currentMessaging?.off(WidgetMessagingEvent.Start, onStart);
|
||||
messagingStore.off(WidgetMessagingStoreEvent.StoreMessaging, onStoreMessaging);
|
||||
clearTimeout(timeout);
|
||||
}
|
||||
}
|
||||
|
||||
logger.debug(`Widget ${this.widgetUid} now ready`);
|
||||
return (this.widgetApi = messaging.widgetApi);
|
||||
}
|
||||
|
||||
protected setConnected(): void {
|
||||
@@ -267,7 +299,7 @@ export abstract class Call extends TypedEventEmitter<CallEvent, CallEventHandler
|
||||
* Stops further communication with the widget and tells the UI to close.
|
||||
*/
|
||||
protected close(): void {
|
||||
this.messaging = null;
|
||||
this.widgetApi = null;
|
||||
this.emit(CallEvent.Close);
|
||||
}
|
||||
|
||||
@@ -289,7 +321,7 @@ export abstract class Call extends TypedEventEmitter<CallEvent, CallEventHandler
|
||||
|
||||
private readonly onStopMessaging = (uid: string): void => {
|
||||
if (uid === this.widgetUid && this.connected) {
|
||||
logger.log("The widget died; treating this as a user hangup");
|
||||
logger.debug("The widget died; treating this as a user hangup");
|
||||
this.setDisconnected();
|
||||
this.close();
|
||||
}
|
||||
@@ -448,25 +480,26 @@ export class JitsiCall extends Call {
|
||||
});
|
||||
}
|
||||
|
||||
public async start(): Promise<void> {
|
||||
await super.start();
|
||||
this.messaging!.on(`action:${ElementWidgetActions.JoinCall}`, this.onJoin);
|
||||
this.messaging!.on(`action:${ElementWidgetActions.HangupCall}`, this.onHangup);
|
||||
public async start(): Promise<ClientWidgetApi> {
|
||||
const widgetApi = await super.start();
|
||||
widgetApi.on(`action:${ElementWidgetActions.JoinCall}`, this.onJoin);
|
||||
widgetApi.on(`action:${ElementWidgetActions.HangupCall}`, this.onHangup);
|
||||
ActiveWidgetStore.instance.on(ActiveWidgetStoreEvent.Dock, this.onDock);
|
||||
ActiveWidgetStore.instance.on(ActiveWidgetStoreEvent.Undock, this.onUndock);
|
||||
return widgetApi;
|
||||
}
|
||||
|
||||
protected async performDisconnection(): Promise<void> {
|
||||
const response = waitForEvent(
|
||||
this.messaging!,
|
||||
this.widgetApi!,
|
||||
`action:${ElementWidgetActions.HangupCall}`,
|
||||
(ev: CustomEvent<IWidgetApiRequest>) => {
|
||||
ev.preventDefault();
|
||||
this.messaging!.transport.reply(ev.detail, {}); // ack
|
||||
this.widgetApi!.transport.reply(ev.detail, {}); // ack
|
||||
return true;
|
||||
},
|
||||
);
|
||||
const request = this.messaging!.transport.send(ElementWidgetActions.HangupCall, {});
|
||||
const request = this.widgetApi!.transport.send(ElementWidgetActions.HangupCall, {});
|
||||
try {
|
||||
await Promise.all([request, response]);
|
||||
} catch (e) {
|
||||
@@ -475,8 +508,8 @@ export class JitsiCall extends Call {
|
||||
}
|
||||
|
||||
public close(): void {
|
||||
this.messaging!.off(`action:${ElementWidgetActions.JoinCall}`, this.onJoin);
|
||||
this.messaging!.off(`action:${ElementWidgetActions.HangupCall}`, this.onHangup);
|
||||
this.widgetApi!.off(`action:${ElementWidgetActions.JoinCall}`, this.onJoin);
|
||||
this.widgetApi!.off(`action:${ElementWidgetActions.HangupCall}`, this.onHangup);
|
||||
ActiveWidgetStore.instance.off(ActiveWidgetStoreEvent.Dock, this.onDock);
|
||||
ActiveWidgetStore.instance.off(ActiveWidgetStoreEvent.Undock, this.onUndock);
|
||||
super.close();
|
||||
@@ -508,7 +541,7 @@ export class JitsiCall extends Call {
|
||||
// Re-add this device every so often so our video member event doesn't become stale
|
||||
this.resendDevicesTimer = window.setInterval(
|
||||
async (): Promise<void> => {
|
||||
logger.log(`Resending video member event for ${this.roomId}`);
|
||||
logger.debug(`Resending video member event for ${this.roomId}`);
|
||||
await this.addOurDevice();
|
||||
},
|
||||
(this.STUCK_DEVICE_TIMEOUT_MS * 3) / 4,
|
||||
@@ -527,18 +560,18 @@ export class JitsiCall extends Call {
|
||||
|
||||
private readonly onDock = async (): Promise<void> => {
|
||||
// The widget is no longer a PiP, so let's restore the default layout
|
||||
await this.messaging!.transport.send(ElementWidgetActions.TileLayout, {});
|
||||
await this.widgetApi!.transport.send(ElementWidgetActions.TileLayout, {});
|
||||
};
|
||||
|
||||
private readonly onUndock = async (): Promise<void> => {
|
||||
// The widget has become a PiP, so let's switch Jitsi to spotlight mode
|
||||
// to only show the active speaker and economize on space
|
||||
await this.messaging!.transport.send(ElementWidgetActions.SpotlightLayout, {});
|
||||
await this.widgetApi!.transport.send(ElementWidgetActions.SpotlightLayout, {});
|
||||
};
|
||||
|
||||
private readonly onJoin = (ev: CustomEvent<IWidgetApiRequest>): void => {
|
||||
ev.preventDefault();
|
||||
this.messaging!.transport.reply(ev.detail, {}); // ack
|
||||
this.widgetApi!.transport.reply(ev.detail, {}); // ack
|
||||
this.setConnected();
|
||||
};
|
||||
|
||||
@@ -548,7 +581,7 @@ export class JitsiCall extends Call {
|
||||
if (this.connectionState === ConnectionState.Disconnecting) return;
|
||||
|
||||
ev.preventDefault();
|
||||
this.messaging!.transport.reply(ev.detail, {}); // ack
|
||||
this.widgetApi!.transport.reply(ev.detail, {}); // ack
|
||||
this.setDisconnected();
|
||||
if (!isVideoRoom(this.room)) this.close();
|
||||
};
|
||||
@@ -900,7 +933,7 @@ export class ElementCall extends Call {
|
||||
ElementCall.createOrGetCallWidget(room.roomId, room.client);
|
||||
}
|
||||
|
||||
public async start(widgetGenerationParameters: WidgetGenerationParameters): Promise<void> {
|
||||
public async start(widgetGenerationParameters: WidgetGenerationParameters): Promise<ClientWidgetApi> {
|
||||
// Some parameters may only be set once the user has chosen to interact with the call, regenerate the URL
|
||||
// at this point in case any of the parameters have changed.
|
||||
this.widgetGenerationParameters = { ...this.widgetGenerationParameters, ...widgetGenerationParameters };
|
||||
@@ -909,24 +942,25 @@ export class ElementCall extends Call {
|
||||
this.roomId,
|
||||
this.widgetGenerationParameters,
|
||||
).toString();
|
||||
await super.start();
|
||||
this.messaging!.on(`action:${ElementWidgetActions.JoinCall}`, this.onJoin);
|
||||
this.messaging!.on(`action:${ElementWidgetActions.HangupCall}`, this.onHangup);
|
||||
this.messaging!.on(`action:${ElementWidgetActions.Close}`, this.onClose);
|
||||
this.messaging!.on(`action:${ElementWidgetActions.DeviceMute}`, this.onDeviceMute);
|
||||
const widgetApi = await super.start();
|
||||
widgetApi.on(`action:${ElementWidgetActions.JoinCall}`, this.onJoin);
|
||||
widgetApi.on(`action:${ElementWidgetActions.HangupCall}`, this.onHangup);
|
||||
widgetApi.on(`action:${ElementWidgetActions.Close}`, this.onClose);
|
||||
widgetApi.on(`action:${ElementWidgetActions.DeviceMute}`, this.onDeviceMute);
|
||||
return widgetApi;
|
||||
}
|
||||
|
||||
protected async performDisconnection(): Promise<void> {
|
||||
const response = waitForEvent(
|
||||
this.messaging!,
|
||||
this.widgetApi!,
|
||||
`action:${ElementWidgetActions.HangupCall}`,
|
||||
(ev: CustomEvent<IWidgetApiRequest>) => {
|
||||
ev.preventDefault();
|
||||
this.messaging!.transport.reply(ev.detail, {}); // ack
|
||||
this.widgetApi!.transport.reply(ev.detail, {}); // ack
|
||||
return true;
|
||||
},
|
||||
);
|
||||
const request = this.messaging!.transport.send(ElementWidgetActions.HangupCall, {});
|
||||
const request = this.widgetApi!.transport.send(ElementWidgetActions.HangupCall, {});
|
||||
try {
|
||||
await Promise.all([request, response]);
|
||||
} catch (e) {
|
||||
@@ -935,10 +969,10 @@ export class ElementCall extends Call {
|
||||
}
|
||||
|
||||
public close(): void {
|
||||
this.messaging!.off(`action:${ElementWidgetActions.JoinCall}`, this.onJoin);
|
||||
this.messaging!.off(`action:${ElementWidgetActions.HangupCall}`, this.onHangup);
|
||||
this.messaging!.off(`action:${ElementWidgetActions.Close}`, this.onClose);
|
||||
this.messaging!.off(`action:${ElementWidgetActions.DeviceMute}`, this.onDeviceMute);
|
||||
this.widgetApi!.off(`action:${ElementWidgetActions.JoinCall}`, this.onJoin);
|
||||
this.widgetApi!.off(`action:${ElementWidgetActions.HangupCall}`, this.onHangup);
|
||||
this.widgetApi!.off(`action:${ElementWidgetActions.Close}`, this.onClose);
|
||||
this.widgetApi!.off(`action:${ElementWidgetActions.DeviceMute}`, this.onDeviceMute);
|
||||
super.close();
|
||||
}
|
||||
|
||||
@@ -986,12 +1020,12 @@ export class ElementCall extends Call {
|
||||
|
||||
private readonly onDeviceMute = (ev: CustomEvent<IWidgetApiRequest>): void => {
|
||||
ev.preventDefault();
|
||||
this.messaging!.transport.reply(ev.detail, {}); // ack
|
||||
this.widgetApi!.transport.reply(ev.detail, {}); // ack
|
||||
};
|
||||
|
||||
private readonly onJoin = (ev: CustomEvent<IWidgetApiRequest>): void => {
|
||||
ev.preventDefault();
|
||||
this.messaging!.transport.reply(ev.detail, {}); // ack
|
||||
this.widgetApi!.transport.reply(ev.detail, {}); // ack
|
||||
this.setConnected();
|
||||
};
|
||||
|
||||
@@ -1001,13 +1035,13 @@ export class ElementCall extends Call {
|
||||
if (this.connectionState === ConnectionState.Disconnecting) return;
|
||||
|
||||
ev.preventDefault();
|
||||
this.messaging!.transport.reply(ev.detail, {}); // ack
|
||||
this.widgetApi!.transport.reply(ev.detail, {}); // ack
|
||||
this.setDisconnected();
|
||||
};
|
||||
|
||||
private readonly onClose = async (ev: CustomEvent<IWidgetApiRequest>): Promise<void> => {
|
||||
ev.preventDefault();
|
||||
this.messaging!.transport.reply(ev.detail, {}); // ack
|
||||
this.widgetApi!.transport.reply(ev.detail, {}); // ack
|
||||
this.setDisconnected(); // Just in case the widget forgot to emit a hangup action (maybe it's in an error state)
|
||||
this.close(); // User is done with the call; tell the UI to close it
|
||||
};
|
||||
|
||||
@@ -88,11 +88,11 @@ export class ModalWidgetStore extends AsyncStoreWithClient<IState> {
|
||||
this.modalInstance = null;
|
||||
|
||||
const sourceMessaging = WidgetMessagingStore.instance.getMessaging(sourceWidget, widgetRoomId);
|
||||
if (!sourceMessaging) {
|
||||
logger.error("No source widget messaging for modal widget");
|
||||
if (!sourceMessaging?.widgetApi) {
|
||||
logger.error("No source widget API for modal widget");
|
||||
return;
|
||||
}
|
||||
sourceMessaging.notifyModalWidgetClose(data);
|
||||
sourceMessaging.widgetApi.notifyModalWidgetClose(data);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
@@ -65,8 +65,6 @@ import { ModuleRunner } from "../../modules/ModuleRunner";
|
||||
import SettingsStore from "../../settings/SettingsStore";
|
||||
import { mediaFromMxc } from "../../customisations/Media";
|
||||
|
||||
// TODO: Purge this from the universe
|
||||
|
||||
function getRememberedCapabilitiesForWidget(widget: Widget): Capability[] {
|
||||
return JSON.parse(localStorage.getItem(`widget_${widget.id}_approved_caps`) || "[]");
|
||||
}
|
||||
@@ -81,12 +79,19 @@ const normalizeTurnServer = ({ urls, username, credential }: IClientTurnServer):
|
||||
password: credential,
|
||||
});
|
||||
|
||||
export class StopGapWidgetDriver extends WidgetDriver {
|
||||
/**
|
||||
* Element Web's implementation of a widget driver (the object that
|
||||
* matrix-widget-api uses to retrieve information from the client and carry out
|
||||
* authorized actions on the widget's behalf). Essentially this is a glorified
|
||||
* set of callbacks.
|
||||
*/
|
||||
// TODO: Consider alternative designs for matrix-widget-api?
|
||||
// Replace with matrix-rust-sdk?
|
||||
export class ElementWidgetDriver extends WidgetDriver {
|
||||
private allowedCapabilities: Set<Capability>;
|
||||
|
||||
// TODO: Refactor widgetKind into the Widget class
|
||||
public constructor(
|
||||
allowedCapabilities: Capability[],
|
||||
private forWidget: Widget,
|
||||
private forWidgetKind: WidgetKind,
|
||||
virtual: boolean,
|
||||
@@ -97,11 +102,7 @@ export class StopGapWidgetDriver extends WidgetDriver {
|
||||
// Always allow screenshots to be taken because it's a client-induced flow. The widget can't
|
||||
// spew screenshots at us and can't request screenshots of us, so it's up to us to provide the
|
||||
// button if the widget says it supports screenshots.
|
||||
this.allowedCapabilities = new Set([
|
||||
...allowedCapabilities,
|
||||
MatrixCapabilities.Screenshots,
|
||||
ElementWidgetCapabilities.RequiresClient,
|
||||
]);
|
||||
this.allowedCapabilities = new Set([MatrixCapabilities.Screenshots, ElementWidgetCapabilities.RequiresClient]);
|
||||
|
||||
// Grant the permissions that are specific to given widget types
|
||||
if (WidgetType.JITSI.matches(this.forWidget.type) && forWidgetKind === WidgetKind.Room) {
|
||||
@@ -14,6 +14,7 @@ import {
|
||||
ClientEvent,
|
||||
RoomStateEvent,
|
||||
type ReceivedToDeviceMessage,
|
||||
TypedEventEmitter,
|
||||
} from "matrix-js-sdk/src/matrix";
|
||||
import { KnownMembership } from "matrix-js-sdk/src/types";
|
||||
import {
|
||||
@@ -34,11 +35,10 @@ import {
|
||||
WidgetApiFromWidgetAction,
|
||||
WidgetKind,
|
||||
} from "matrix-widget-api";
|
||||
import { EventEmitter } from "events";
|
||||
import { logger } from "matrix-js-sdk/src/logger";
|
||||
|
||||
import { _t, getUserLanguage } from "../../languageHandler";
|
||||
import { StopGapWidgetDriver } from "./StopGapWidgetDriver";
|
||||
import { ElementWidgetDriver } from "./ElementWidgetDriver";
|
||||
import { WidgetMessagingStore } from "./WidgetMessagingStore";
|
||||
import { MatrixClientPeg } from "../../MatrixClientPeg";
|
||||
import { OwnProfileStore } from "../OwnProfileStore";
|
||||
@@ -46,12 +46,11 @@ import WidgetUtils from "../../utils/WidgetUtils";
|
||||
import { IntegrationManagers } from "../../integrations/IntegrationManagers";
|
||||
import { WidgetType } from "../../widgets/WidgetType";
|
||||
import ActiveWidgetStore from "../ActiveWidgetStore";
|
||||
import { objectShallowClone } from "../../utils/objects";
|
||||
import defaultDispatcher from "../../dispatcher/dispatcher";
|
||||
import { Action } from "../../dispatcher/actions";
|
||||
import { ElementWidgetActions, type IHangupCallApiRequest, type IViewRoomApiRequest } from "./ElementWidgetActions";
|
||||
import { ModalWidgetStore } from "../ModalWidgetStore";
|
||||
import { type IApp, isAppWidget } from "../WidgetStore";
|
||||
import { isAppWidget } from "../WidgetStore";
|
||||
import ThemeWatcher, { ThemeWatcherEvent } from "../../settings/watchers/ThemeWatcher";
|
||||
import { getCustomTheme } from "../../theme";
|
||||
import { ElementWidgetCapabilities } from "./ElementWidgetCapabilities";
|
||||
@@ -64,21 +63,10 @@ import ErrorDialog from "../../components/views/dialogs/ErrorDialog";
|
||||
import { SdkContextClass } from "../../contexts/SDKContext";
|
||||
import { UPDATE_EVENT } from "../AsyncStore";
|
||||
|
||||
// TODO: Destroy all of this code
|
||||
// TODO: Purge this code of its overgrown hacks and compatibility shims.
|
||||
|
||||
interface IAppTileProps {
|
||||
// Note: these are only the props we care about
|
||||
app: IApp | IWidget;
|
||||
room?: Room; // without a room it is a user widget
|
||||
userId: string;
|
||||
creatorUserId: string;
|
||||
waitForIframeLoad: boolean;
|
||||
whitelistCapabilities?: string[];
|
||||
userWidget: boolean;
|
||||
stickyPromise?: () => Promise<void>;
|
||||
}
|
||||
|
||||
// TODO: Don't use this because it's wrong
|
||||
// TODO: Don't use this. We should avoid overriding/mocking matrix-widget-api
|
||||
// behavior and instead strive to use widgets in more transparent ways.
|
||||
export class ElementWidget extends Widget {
|
||||
public constructor(private rawDefinition: IWidget) {
|
||||
super(rawDefinition);
|
||||
@@ -152,11 +140,49 @@ export class ElementWidget extends Widget {
|
||||
}
|
||||
}
|
||||
|
||||
export class StopGapWidget extends EventEmitter {
|
||||
export enum WidgetMessagingEvent {
|
||||
Start = "start",
|
||||
Stop = "stop",
|
||||
}
|
||||
|
||||
interface WidgetMessagingEventMap {
|
||||
[WidgetMessagingEvent.Start]: (widgetApi: ClientWidgetApi) => void;
|
||||
[WidgetMessagingEvent.Stop]: (widgetApi: ClientWidgetApi) => void;
|
||||
}
|
||||
|
||||
interface WidgetMessagingOptions {
|
||||
app: IWidget;
|
||||
room?: Room; // without a room it is a user widget
|
||||
userId: string;
|
||||
creatorUserId: string;
|
||||
waitForIframeLoad: boolean;
|
||||
userWidget: boolean;
|
||||
/**
|
||||
* If defined this async method will be called when the widget requests to become sticky.
|
||||
* It will only become sticky once the returned promise resolves.
|
||||
* This is useful because: Widget B is sticky. Making widget A sticky will kill widget B immediately.
|
||||
* This promise allows to do Widget B related cleanup before Widget A becomes sticky. (e.g. hangup a Voip call)
|
||||
*/
|
||||
stickyPromise?: () => Promise<void>;
|
||||
}
|
||||
|
||||
/**
|
||||
* A running instance of a widget, associated with an iframe and an active communication
|
||||
* channel. Instances must be tracked by WidgetMessagingStore, as only one WidgetMessaging
|
||||
* instance should exist for a given widget.
|
||||
*
|
||||
* This class is responsible for:
|
||||
* - Computing the templated widget URL
|
||||
* - Starting a {@link ClientWidgetApi} communication channel with the widget
|
||||
* - Eagerly pushing events from the Matrix client to the widget
|
||||
*
|
||||
* @see {@link ElementWidgetDriver} for the class used to *pull* data lazily from the
|
||||
* Matrix client to the widget on the widget's behalf.
|
||||
* @see {@link WidgetMessagingStore} for the store that holds these instances.
|
||||
*/
|
||||
export class WidgetMessaging extends TypedEventEmitter<WidgetMessagingEvent, WidgetMessagingEventMap> {
|
||||
private client: MatrixClient;
|
||||
private iframe: HTMLIFrameElement | null = null;
|
||||
private messaging: ClientWidgetApi | null = null;
|
||||
private mockWidget: ElementWidget;
|
||||
private scalarToken?: string;
|
||||
private roomId?: string;
|
||||
// The room that we're currently allowing the widget to interact with. Only
|
||||
@@ -171,26 +197,28 @@ export class StopGapWidget extends EventEmitter {
|
||||
// Holds events that should be fed to the widget once they finish decrypting
|
||||
private readonly eventsToFeed = new WeakSet<MatrixEvent>();
|
||||
|
||||
public constructor(private appTileProps: IAppTileProps) {
|
||||
public constructor(
|
||||
private readonly widget: ElementWidget,
|
||||
options: WidgetMessagingOptions,
|
||||
) {
|
||||
super();
|
||||
this.client = MatrixClientPeg.safeGet();
|
||||
|
||||
let app = appTileProps.app;
|
||||
// Backwards compatibility: not all old widgets have a creatorUserId
|
||||
if (!app.creatorUserId) {
|
||||
app = objectShallowClone(app); // clone to prevent accidental mutation
|
||||
app.creatorUserId = this.client.getUserId()!;
|
||||
}
|
||||
|
||||
this.mockWidget = new ElementWidget(app);
|
||||
this.roomId = appTileProps.room?.roomId;
|
||||
this.kind = appTileProps.userWidget ? WidgetKind.Account : WidgetKind.Room; // probably
|
||||
this.virtual = isAppWidget(app) && app.eventId === undefined;
|
||||
this.stickyPromise = appTileProps.stickyPromise;
|
||||
this.roomId = options.room?.roomId;
|
||||
this.kind = options.userWidget ? WidgetKind.Account : WidgetKind.Room; // probably
|
||||
this.virtual = isAppWidget(options.app) && options.app.eventId === undefined;
|
||||
this.stickyPromise = options.stickyPromise;
|
||||
}
|
||||
|
||||
private _widgetApi: ClientWidgetApi | null = null;
|
||||
private set widgetApi(value: ClientWidgetApi | null) {
|
||||
this._widgetApi = value;
|
||||
}
|
||||
|
||||
/**
|
||||
* The widget API interface to the widget, or null if disconnected.
|
||||
*/
|
||||
public get widgetApi(): ClientWidgetApi | null {
|
||||
return this.messaging;
|
||||
return this._widgetApi;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -220,7 +248,7 @@ export class StopGapWidget extends EventEmitter {
|
||||
deviceId: this.client.getDeviceId() ?? undefined,
|
||||
baseUrl: this.client.baseUrl,
|
||||
};
|
||||
const templated = this.mockWidget.getCompleteUrl(Object.assign(defaults, fromCustomisation), opts?.asPopout);
|
||||
const templated = this.widget.getCompleteUrl(Object.assign(defaults, fromCustomisation), opts?.asPopout);
|
||||
|
||||
const parsed = new URL(templated);
|
||||
|
||||
@@ -228,7 +256,7 @@ export class StopGapWidget extends EventEmitter {
|
||||
// TODO: Replace these with proper widget params
|
||||
// See https://github.com/matrix-org/matrix-doc/pull/1958/files#r405714833
|
||||
if (!opts?.asPopout) {
|
||||
parsed.searchParams.set("widgetId", this.mockWidget.id);
|
||||
parsed.searchParams.set("widgetId", this.widget.id);
|
||||
parsed.searchParams.set("parentUrl", window.location.href.split("#", 2)[0]);
|
||||
|
||||
// Give the widget a scalar token if we're supposed to (more legacy)
|
||||
@@ -244,16 +272,16 @@ export class StopGapWidget extends EventEmitter {
|
||||
}
|
||||
|
||||
private onThemeChange = (theme: string): void => {
|
||||
this.messaging?.updateTheme({ name: theme });
|
||||
this.widgetApi?.updateTheme({ name: theme });
|
||||
};
|
||||
|
||||
private onOpenModal = async (ev: CustomEvent<IModalWidgetOpenRequest>): Promise<void> => {
|
||||
ev.preventDefault();
|
||||
if (ModalWidgetStore.instance.canOpenModalWidget()) {
|
||||
ModalWidgetStore.instance.openModalWidget(ev.detail.data, this.mockWidget, this.roomId);
|
||||
this.messaging?.transport.reply(ev.detail, {}); // ack
|
||||
ModalWidgetStore.instance.openModalWidget(ev.detail.data, this.widget, this.roomId);
|
||||
this.widgetApi?.transport.reply(ev.detail, {}); // ack
|
||||
} else {
|
||||
this.messaging?.transport.reply(ev.detail, {
|
||||
this.widgetApi?.transport.reply(ev.detail, {
|
||||
error: {
|
||||
message: "Unable to open modal at this time",
|
||||
},
|
||||
@@ -266,7 +294,7 @@ export class StopGapWidget extends EventEmitter {
|
||||
private onRoomViewStoreUpdate = (): void => {
|
||||
const roomId = SdkContextClass.instance.roomViewStore.getRoomId() ?? null;
|
||||
if (roomId !== this.viewedRoomId) {
|
||||
this.messaging!.setViewedRoomId(roomId);
|
||||
this.widgetApi!.setViewedRoomId(roomId);
|
||||
this.viewedRoomId = roomId;
|
||||
}
|
||||
};
|
||||
@@ -275,60 +303,47 @@ export class StopGapWidget extends EventEmitter {
|
||||
* This starts the messaging for the widget if it is not in the state `started` yet.
|
||||
* @param iframe the iframe the widget should use
|
||||
*/
|
||||
public startMessaging(iframe: HTMLIFrameElement): void {
|
||||
if (this.messaging !== null) return;
|
||||
public start(iframe: HTMLIFrameElement): void {
|
||||
if (this.widgetApi !== null) return;
|
||||
|
||||
this.iframe = iframe;
|
||||
const allowedCapabilities = this.appTileProps.whitelistCapabilities || [];
|
||||
const driver = new StopGapWidgetDriver(
|
||||
allowedCapabilities,
|
||||
this.mockWidget,
|
||||
this.kind,
|
||||
this.virtual,
|
||||
this.roomId,
|
||||
);
|
||||
|
||||
this.messaging = new ClientWidgetApi(this.mockWidget, iframe, driver);
|
||||
this.messaging.on("preparing", () => this.emit("preparing"));
|
||||
this.messaging.on("error:preparing", (err: unknown) => this.emit("error:preparing", err));
|
||||
this.messaging.once("ready", () => {
|
||||
WidgetMessagingStore.instance.storeMessaging(this.mockWidget, this.roomId, this.messaging!);
|
||||
this.emit("ready");
|
||||
const driver = new ElementWidgetDriver(this.widget, this.kind, this.virtual, this.roomId);
|
||||
|
||||
this.widgetApi = new ClientWidgetApi(this.widget, iframe, driver);
|
||||
this.widgetApi.once("ready", () => {
|
||||
this.themeWatcher.start();
|
||||
this.themeWatcher.on(ThemeWatcherEvent.Change, this.onThemeChange);
|
||||
// Theme may have changed while messaging was starting
|
||||
this.onThemeChange(this.themeWatcher.getEffectiveTheme());
|
||||
});
|
||||
this.messaging.on("capabilitiesNotified", () => this.emit("capabilitiesNotified"));
|
||||
this.messaging.on(`action:${WidgetApiFromWidgetAction.OpenModalWidget}`, this.onOpenModal);
|
||||
this.widgetApi.on(`action:${WidgetApiFromWidgetAction.OpenModalWidget}`, this.onOpenModal);
|
||||
|
||||
// When widgets are listening to events, we need to make sure they're only
|
||||
// receiving events for the right room
|
||||
if (this.roomId === undefined) {
|
||||
// Account widgets listen to the currently active room
|
||||
this.messaging.setViewedRoomId(SdkContextClass.instance.roomViewStore.getRoomId() ?? null);
|
||||
this.widgetApi.setViewedRoomId(SdkContextClass.instance.roomViewStore.getRoomId() ?? null);
|
||||
SdkContextClass.instance.roomViewStore.on(UPDATE_EVENT, this.onRoomViewStoreUpdate);
|
||||
} else {
|
||||
// Room widgets get locked to the room they were added in
|
||||
this.messaging.setViewedRoomId(this.roomId);
|
||||
this.widgetApi.setViewedRoomId(this.roomId);
|
||||
}
|
||||
|
||||
// Always attach a handler for ViewRoom, but permission check it internally
|
||||
this.messaging.on(`action:${ElementWidgetActions.ViewRoom}`, (ev: CustomEvent<IViewRoomApiRequest>) => {
|
||||
this.widgetApi.on(`action:${ElementWidgetActions.ViewRoom}`, (ev: CustomEvent<IViewRoomApiRequest>) => {
|
||||
ev.preventDefault(); // stop the widget API from auto-rejecting this
|
||||
|
||||
// Check up front if this is even a valid request
|
||||
const targetRoomId = (ev.detail.data || {}).room_id;
|
||||
if (!targetRoomId) {
|
||||
return this.messaging?.transport.reply(ev.detail, <IWidgetApiErrorResponseData>{
|
||||
return this.widgetApi?.transport.reply(ev.detail, <IWidgetApiErrorResponseData>{
|
||||
error: { message: "Room ID not supplied." },
|
||||
});
|
||||
}
|
||||
|
||||
// Check the widget's permission
|
||||
if (!this.messaging?.hasCapability(ElementWidgetCapabilities.CanChangeViewedRoom)) {
|
||||
return this.messaging?.transport.reply(ev.detail, <IWidgetApiErrorResponseData>{
|
||||
if (!this.widgetApi?.hasCapability(ElementWidgetCapabilities.CanChangeViewedRoom)) {
|
||||
return this.widgetApi?.transport.reply(ev.detail, <IWidgetApiErrorResponseData>{
|
||||
error: { message: "This widget does not have permission for this action (denied)." },
|
||||
});
|
||||
}
|
||||
@@ -341,7 +356,7 @@ export class StopGapWidget extends EventEmitter {
|
||||
});
|
||||
|
||||
// acknowledge so the widget doesn't freak out
|
||||
this.messaging.transport.reply(ev.detail, <IWidgetApiRequestEmptyData>{});
|
||||
this.widgetApi.transport.reply(ev.detail, <IWidgetApiRequestEmptyData>{});
|
||||
});
|
||||
|
||||
// Populate the map of "read up to" events for this widget with the current event in every room.
|
||||
@@ -361,10 +376,10 @@ export class StopGapWidget extends EventEmitter {
|
||||
this.client.on(RoomStateEvent.Events, this.onStateUpdate);
|
||||
this.client.on(ClientEvent.ReceivedToDeviceMessage, this.onToDeviceMessage);
|
||||
|
||||
this.messaging.on(
|
||||
this.widgetApi.on(
|
||||
`action:${WidgetApiFromWidgetAction.UpdateAlwaysOnScreen}`,
|
||||
async (ev: CustomEvent<IStickyActionRequest>) => {
|
||||
if (this.messaging?.hasCapability(MatrixCapabilities.AlwaysOnScreen)) {
|
||||
if (this.widgetApi?.hasCapability(MatrixCapabilities.AlwaysOnScreen)) {
|
||||
ev.preventDefault();
|
||||
if (ev.detail.data.value) {
|
||||
// If the widget wants to become sticky we wait for the stickyPromise to resolve
|
||||
@@ -372,43 +387,43 @@ export class StopGapWidget extends EventEmitter {
|
||||
}
|
||||
// Stop being persistent can be done instantly
|
||||
ActiveWidgetStore.instance.setWidgetPersistence(
|
||||
this.mockWidget.id,
|
||||
this.widget.id,
|
||||
this.roomId ?? null,
|
||||
ev.detail.data.value,
|
||||
);
|
||||
// Send the ack after the widget actually has become sticky.
|
||||
this.messaging.transport.reply(ev.detail, <IWidgetApiRequestEmptyData>{});
|
||||
this.widgetApi.transport.reply(ev.detail, <IWidgetApiRequestEmptyData>{});
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
// TODO: Replace this event listener with appropriate driver functionality once the API
|
||||
// establishes a sane way to send events back and forth.
|
||||
this.messaging.on(
|
||||
this.widgetApi.on(
|
||||
`action:${WidgetApiFromWidgetAction.SendSticker}`,
|
||||
(ev: CustomEvent<IStickerActionRequest>) => {
|
||||
if (this.messaging?.hasCapability(MatrixCapabilities.StickerSending)) {
|
||||
if (this.widgetApi?.hasCapability(MatrixCapabilities.StickerSending)) {
|
||||
// Acknowledge first
|
||||
ev.preventDefault();
|
||||
this.messaging.transport.reply(ev.detail, <IWidgetApiRequestEmptyData>{});
|
||||
this.widgetApi.transport.reply(ev.detail, <IWidgetApiRequestEmptyData>{});
|
||||
|
||||
// Send the sticker
|
||||
defaultDispatcher.dispatch({
|
||||
action: "m.sticker",
|
||||
data: ev.detail.data,
|
||||
widgetId: this.mockWidget.id,
|
||||
widgetId: this.widget.id,
|
||||
});
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
if (WidgetType.STICKERPICKER.matches(this.mockWidget.type)) {
|
||||
this.messaging.on(
|
||||
if (WidgetType.STICKERPICKER.matches(this.widget.type)) {
|
||||
this.widgetApi.on(
|
||||
`action:${ElementWidgetActions.OpenIntegrationManager}`,
|
||||
(ev: CustomEvent<IWidgetApiRequest>) => {
|
||||
// Acknowledge first
|
||||
ev.preventDefault();
|
||||
this.messaging?.transport.reply(ev.detail, <IWidgetApiRequestEmptyData>{});
|
||||
this.widgetApi?.transport.reply(ev.detail, <IWidgetApiRequestEmptyData>{});
|
||||
|
||||
// First close the stickerpicker
|
||||
defaultDispatcher.dispatch({ action: "stickerpicker_close" });
|
||||
@@ -429,8 +444,8 @@ export class StopGapWidget extends EventEmitter {
|
||||
);
|
||||
}
|
||||
|
||||
if (WidgetType.JITSI.matches(this.mockWidget.type)) {
|
||||
this.messaging.on(`action:${ElementWidgetActions.HangupCall}`, (ev: CustomEvent<IHangupCallApiRequest>) => {
|
||||
if (WidgetType.JITSI.matches(this.widget.type)) {
|
||||
this.widgetApi.on(`action:${ElementWidgetActions.HangupCall}`, (ev: CustomEvent<IHangupCallApiRequest>) => {
|
||||
ev.preventDefault();
|
||||
if (ev.detail.data?.errorMessage) {
|
||||
Modal.createDialog(ErrorDialog, {
|
||||
@@ -440,9 +455,11 @@ export class StopGapWidget extends EventEmitter {
|
||||
}),
|
||||
});
|
||||
}
|
||||
this.messaging?.transport.reply(ev.detail, <IWidgetApiRequestEmptyData>{});
|
||||
this.widgetApi?.transport.reply(ev.detail, <IWidgetApiRequestEmptyData>{});
|
||||
});
|
||||
}
|
||||
|
||||
this.emit(WidgetMessagingEvent.Start, this.widgetApi);
|
||||
}
|
||||
|
||||
public async prepare(): Promise<void> {
|
||||
@@ -450,10 +467,8 @@ export class StopGapWidget extends EventEmitter {
|
||||
await (WidgetVariableCustomisations?.isReady?.() ?? Promise.resolve());
|
||||
|
||||
if (this.scalarToken) return;
|
||||
const existingMessaging = WidgetMessagingStore.instance.getMessaging(this.mockWidget, this.roomId);
|
||||
if (existingMessaging) this.messaging = existingMessaging;
|
||||
try {
|
||||
if (WidgetUtils.isScalarUrl(this.mockWidget.templateUrl)) {
|
||||
if (WidgetUtils.isScalarUrl(this.widget.templateUrl)) {
|
||||
const managers = IntegrationManagers.sharedInstance();
|
||||
if (managers.hasManager()) {
|
||||
// TODO: Pick the right manager for the widget
|
||||
@@ -475,8 +490,8 @@ export class StopGapWidget extends EventEmitter {
|
||||
* widget.
|
||||
* @param opts
|
||||
*/
|
||||
public stopMessaging(opts = { forceDestroy: false }): void {
|
||||
if (this.messaging === null || this.iframe === null) return;
|
||||
public stop(opts = { forceDestroy: false }): void {
|
||||
if (this.widgetApi === null || this.iframe === null) return;
|
||||
if (opts.forceDestroy) {
|
||||
// HACK: This is a really dirty way to ensure that Jitsi cleans up
|
||||
// its hold on the webcam. Without this, the widget holds a media
|
||||
@@ -487,15 +502,16 @@ export class StopGapWidget extends EventEmitter {
|
||||
// at a page that is reasonably safe to use in the event the iframe
|
||||
// doesn't wink away.
|
||||
this.iframe!.src = "about:blank";
|
||||
} else if (ActiveWidgetStore.instance.getWidgetPersistence(this.mockWidget.id, this.roomId ?? null)) {
|
||||
} else if (ActiveWidgetStore.instance.getWidgetPersistence(this.widget.id, this.roomId ?? null)) {
|
||||
logger.log("Skipping destroy - persistent widget");
|
||||
return;
|
||||
}
|
||||
|
||||
WidgetMessagingStore.instance.stopMessaging(this.mockWidget, this.roomId);
|
||||
this.messaging?.removeAllListeners(); // Guard against the 'ready' event firing after stopping
|
||||
this.messaging = null;
|
||||
this.emit(WidgetMessagingEvent.Stop, this.widgetApi);
|
||||
this.widgetApi?.removeAllListeners(); // Insurance against resource leaks
|
||||
this.widgetApi = null;
|
||||
this.iframe = null;
|
||||
WidgetMessagingStore.instance.stopMessaging(this.widget, this.roomId);
|
||||
|
||||
SdkContextClass.instance.roomViewStore.off(UPDATE_EVENT, this.onRoomViewStoreUpdate);
|
||||
|
||||
@@ -515,9 +531,9 @@ export class StopGapWidget extends EventEmitter {
|
||||
};
|
||||
|
||||
private onStateUpdate = (ev: MatrixEvent): void => {
|
||||
if (this.messaging === null) return;
|
||||
if (this.widgetApi === null) return;
|
||||
const raw = ev.getEffectiveEvent();
|
||||
this.messaging.feedStateUpdate(raw as IRoomEvent).catch((e) => {
|
||||
this.widgetApi.feedStateUpdate(raw as IRoomEvent).catch((e) => {
|
||||
logger.error("Error sending state update to widget: ", e);
|
||||
});
|
||||
};
|
||||
@@ -525,7 +541,7 @@ export class StopGapWidget extends EventEmitter {
|
||||
private onToDeviceMessage = async (payload: ReceivedToDeviceMessage): Promise<void> => {
|
||||
const { message, encryptionInfo } = payload;
|
||||
// TODO: Update the widget API to use a proper IToDeviceMessage instead of a IRoomEvent
|
||||
await this.messaging?.feedToDevice(message as IRoomEvent, encryptionInfo != null);
|
||||
await this.widgetApi?.feedToDevice(message as IRoomEvent, encryptionInfo != null);
|
||||
};
|
||||
|
||||
/**
|
||||
@@ -592,7 +608,7 @@ export class StopGapWidget extends EventEmitter {
|
||||
}
|
||||
|
||||
private feedEvent(ev: MatrixEvent): void {
|
||||
if (this.messaging === null) return;
|
||||
if (this.widgetApi === null) return;
|
||||
if (
|
||||
// If we had decided earlier to feed this event to the widget, but
|
||||
// it just wasn't ready, give it another try
|
||||
@@ -621,7 +637,7 @@ export class StopGapWidget extends EventEmitter {
|
||||
this.eventsToFeed.add(ev);
|
||||
} else {
|
||||
const raw = ev.getEffectiveEvent();
|
||||
this.messaging.feedEvent(raw as IRoomEvent).catch((e) => {
|
||||
this.widgetApi.feedEvent(raw as IRoomEvent).catch((e) => {
|
||||
logger.error("Error sending event to widget: ", e);
|
||||
});
|
||||
}
|
||||
@@ -6,7 +6,7 @@
|
||||
* Please see LICENSE files in the repository root for full details.
|
||||
*/
|
||||
|
||||
import { type ClientWidgetApi, type Widget } from "matrix-widget-api";
|
||||
import { type Widget } from "matrix-widget-api";
|
||||
import { type EmptyObject } from "matrix-js-sdk/src/matrix";
|
||||
|
||||
import { AsyncStoreWithClient } from "../AsyncStoreWithClient";
|
||||
@@ -14,6 +14,7 @@ import defaultDispatcher from "../../dispatcher/dispatcher";
|
||||
import { type ActionPayload } from "../../dispatcher/payloads";
|
||||
import { EnhancedMap } from "../../utils/maps";
|
||||
import WidgetUtils from "../../utils/WidgetUtils";
|
||||
import { type WidgetMessaging } from "./WidgetMessaging";
|
||||
|
||||
export enum WidgetMessagingStoreEvent {
|
||||
StoreMessaging = "store_messaging",
|
||||
@@ -32,7 +33,7 @@ export class WidgetMessagingStore extends AsyncStoreWithClient<EmptyObject> {
|
||||
return instance;
|
||||
})();
|
||||
|
||||
private widgetMap = new EnhancedMap<string, ClientWidgetApi>(); // <widget UID, ClientWidgetAPi>
|
||||
private widgetMap = new EnhancedMap<string, WidgetMessaging>(); // <widget UID, messaging>
|
||||
|
||||
public constructor() {
|
||||
super(defaultDispatcher);
|
||||
@@ -51,19 +52,19 @@ export class WidgetMessagingStore extends AsyncStoreWithClient<EmptyObject> {
|
||||
this.widgetMap.clear();
|
||||
}
|
||||
|
||||
public storeMessaging(widget: Widget, roomId: string | undefined, widgetApi: ClientWidgetApi): void {
|
||||
public storeMessaging(widget: Widget, roomId: string | undefined, messaging: WidgetMessaging): void {
|
||||
this.stopMessaging(widget, roomId);
|
||||
const uid = WidgetUtils.calcWidgetUid(widget.id, roomId);
|
||||
this.widgetMap.set(uid, widgetApi);
|
||||
this.widgetMap.set(uid, messaging);
|
||||
|
||||
this.emit(WidgetMessagingStoreEvent.StoreMessaging, uid, widgetApi);
|
||||
this.emit(WidgetMessagingStoreEvent.StoreMessaging, uid, messaging);
|
||||
}
|
||||
|
||||
public stopMessaging(widget: Widget, roomId: string | undefined): void {
|
||||
this.stopMessagingByUid(WidgetUtils.calcWidgetUid(widget.id, roomId));
|
||||
}
|
||||
|
||||
public getMessaging(widget: Widget, roomId: string | undefined): ClientWidgetApi | undefined {
|
||||
public getMessaging(widget: Widget, roomId: string | undefined): WidgetMessaging | undefined {
|
||||
return this.widgetMap.get(WidgetUtils.calcWidgetUid(widget.id, roomId));
|
||||
}
|
||||
|
||||
@@ -84,7 +85,7 @@ export class WidgetMessagingStore extends AsyncStoreWithClient<EmptyObject> {
|
||||
* @param {string} widgetUid The widget UID.
|
||||
* @returns {ClientWidgetApi} The widget API, or a falsy value if not found.
|
||||
*/
|
||||
public getMessagingForUid(widgetUid: string): ClientWidgetApi | undefined {
|
||||
public getMessagingForUid(widgetUid: string): WidgetMessaging | undefined {
|
||||
return this.widgetMap.get(widgetUid);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user