From 67f38ba44534deadce6524361b7ca0fc9697ba83 Mon Sep 17 00:00:00 2001 From: nick-delirium Date: Mon, 19 Jun 2023 13:09:03 +0200 Subject: [PATCH] fix(ui): fix support for old version of assist proto --- .../app/player/web/assist/AssistManager.ts | 18 +++++++++++++++--- frontend/app/player/web/assist/Call.ts | 13 ++++++++++--- .../app/player/web/assist/RemoteControl.ts | 9 ++++++++- .../app/player/web/assist/ScreenRecording.ts | 12 ++++++++++-- 4 files changed, 43 insertions(+), 9 deletions(-) diff --git a/frontend/app/player/web/assist/AssistManager.ts b/frontend/app/player/web/assist/AssistManager.ts index 84fb56936..2750d461f 100644 --- a/frontend/app/player/web/assist/AssistManager.ts +++ b/frontend/app/player/web/assist/AssistManager.ts @@ -53,6 +53,7 @@ export function getStatusText(status: ConnectionStatus): string { const MAX_RECONNECTION_COUNT = 4; export default class AssistManager { + assistVersion = 1 static readonly INITIAL_STATE = { peerConnectionStatus: ConnectionStatus.Connecting, assistStart: 0, @@ -71,6 +72,8 @@ export default class AssistManager { public readonly uiErrorHandler?: { error: (msg: string) => void } ) {} + public getAssistVersion = () => this.assistVersion + private get borderStyle() { const { recordingState, remoteControl } = this.store.get() @@ -168,6 +171,8 @@ export default class AssistManager { }) socket.on('messages', messages => { + if (messages.data !== undefined) this.assistVersion = 2 + const data = messages.data || messages jmr.append(data) // as RawMessage[] if (waitingForMessages) { @@ -189,7 +194,8 @@ export default class AssistManager { socket.on('UPDATE_SESSION', (evData) => { const { meta = {}, data = {} } = evData const { tabId } = meta - const { active } = data + const usedData = this.assistVersion === 1 ? evData : data + const { active } = usedData const currentTab = this.store.get().currentTab this.clearDisconnectTimeout() !this.inactiveTimeout && this.setStatus(ConnectionStatus.Connected) @@ -198,6 +204,9 @@ export default class AssistManager { if (active) { this.setStatus(ConnectionStatus.Connected) } else { + if (tabId === undefined) { + this.inactiveTimeout = setTimeout(() => this.setStatus(ConnectionStatus.Inactive), 5000) + } if (tabId === currentTab) { this.inactiveTimeout = setTimeout(() => this.setStatus(ConnectionStatus.Inactive), 5000) } @@ -223,20 +232,23 @@ export default class AssistManager { socket, this.config, this.peerID, + this.getAssistVersion ) this.remoteControl = new RemoteControl( this.store, socket, this.screen, this.session.agentInfo, - () => this.screen.setBorderStyle(this.borderStyle) + () => this.screen.setBorderStyle(this.borderStyle), + this.getAssistVersion, ) this.screenRecording = new ScreenRecording( this.store, socket, this.session.agentInfo, () => this.screen.setBorderStyle(this.borderStyle), - this.uiErrorHandler + this.uiErrorHandler, + this.getAssistVersion, ) document.addEventListener('visibilitychange', this.onVisChange) diff --git a/frontend/app/player/web/assist/Call.ts b/frontend/app/player/web/assist/Call.ts index cf6d9afd2..5399a2b25 100644 --- a/frontend/app/player/web/assist/Call.ts +++ b/frontend/app/player/web/assist/Call.ts @@ -22,6 +22,7 @@ export interface State { } export default class Call { + private assistVersion = 1 static readonly INITIAL_STATE: Readonly = { calling: CallingState.NoCall } @@ -36,6 +37,7 @@ export default class Call { private socket: Socket, private config: RTCIceServer[] | null, private peerID: string, + private getAssistVersion: () => number ) { socket.on('call_end', this.onRemoteCallEnd) socket.on('videofeed', ({ streamId, enabled }) => { @@ -64,6 +66,7 @@ export default class Call { socket.on("disconnect", () => { this.store.update({ calling: CallingState.NoCall }) }) + this.assistVersion = this.getAssistVersion() } private getPeer(): Promise { @@ -170,7 +173,11 @@ export default class Call { } private emitData = (event: string, data?: any) => { - this.socket?.emit(event, { meta: { tabId: this.store.get().currentTab }, data }) + if (this.assistVersion === 1) { + this.socket?.emit(event, data) + } else { + this.socket?.emit(event, { meta: { tabId: this.store.get().currentTab }, data }) + } } @@ -231,8 +238,8 @@ export default class Call { if (!this.store.get().currentTab) { console.warn('No tab data to connect to peer') } - console.log(tab) - void this._peerConnection(`${this.peerID}-${tab || Object.keys(this.store.get().tabs)[0]}`); + const peerId = this.assistVersion === 1 ? this.peerID : `${this.peerID}-${tab || Object.keys(this.store.get().tabs)[0]}` + void this._peerConnection(peerId); this.emitData("_agent_name", appStore.getState().getIn([ 'user', 'account', 'name'])) } diff --git a/frontend/app/player/web/assist/RemoteControl.ts b/frontend/app/player/web/assist/RemoteControl.ts index ecde14eb6..3b7405788 100644 --- a/frontend/app/player/web/assist/RemoteControl.ts +++ b/frontend/app/player/web/assist/RemoteControl.ts @@ -16,6 +16,7 @@ export interface State { } export default class RemoteControl { + private assistVersion = 1 static readonly INITIAL_STATE: Readonly = { remoteControl: RemoteControlStatus.Disabled, annotating: false, @@ -28,6 +29,7 @@ export default class RemoteControl { private screen: Screen, private agentInfo: Object, private onToggle: (active: boolean) => void, + private getAssistVersion: () => number, ){ socket.on("control_granted", ({ meta, data }) => { this.toggleRemoteControl(data === socket.id) @@ -47,6 +49,7 @@ export default class RemoteControl { socket.on("error", () => { this.toggleRemoteControl(false) }) + this.assistVersion = getAssistVersion() } private onMouseMove = (e: MouseEvent): void => { @@ -55,7 +58,11 @@ export default class RemoteControl { } private emitData = (event: string, data?: any) => { - this.socket.emit(event, { meta: { tabId: this.store.get().currentTab }, data }) + if (this.assistVersion === 1) { + this.socket.emit(event, data) + } else { + this.socket.emit(event, { meta: { tabId: this.store.get().currentTab }, data }) + } } private onWheel = (e: WheelEvent): void => { diff --git a/frontend/app/player/web/assist/ScreenRecording.ts b/frontend/app/player/web/assist/ScreenRecording.ts index fdbd850a2..3a7c71947 100644 --- a/frontend/app/player/web/assist/ScreenRecording.ts +++ b/frontend/app/player/web/assist/ScreenRecording.ts @@ -14,6 +14,7 @@ export interface State { } export default class ScreenRecording { + private assistVersion = 1 onDeny: () => void = () => {} static readonly INITIAL_STATE: Readonly = { recordingState: SessionRecordingStatus.Off, @@ -23,7 +24,8 @@ export default class ScreenRecording { private socket: Socket, private agentInfo: Object, private onToggle: (active: boolean) => void, - public readonly uiErrorHandler: { error: (msg: string) => void } | undefined + public readonly uiErrorHandler: { error: (msg: string) => void } | undefined, + private getAssistVersion: () => number ) { socket.on('recording_accepted', () => { this.toggleRecording(true) @@ -35,6 +37,8 @@ export default class ScreenRecording { socket.on('recording_busy', () => { this.onRecordingBusy() }) + + this.assistVersion = getAssistVersion() } private onRecordingBusy = () => { @@ -55,7 +59,11 @@ export default class ScreenRecording { } private emitData = (event: string, data?: any) => { - this.socket.emit(event, { meta: { tabId: this.store.get().currentTab }, data }) + if (this.assistVersion === 1) { + this.socket.emit(event, data) + } else { + this.socket.emit(event, { meta: { tabId: this.store.get().currentTab }, data }) + } } stopRecording = () => {