From 799bf3cac32ca7a6a910c73e8de2cec4c046c46a Mon Sep 17 00:00:00 2001 From: Shekar Siri Date: Wed, 1 Dec 2021 00:04:00 +0530 Subject: [PATCH] Assist test cred (#225) * change(ui) - assist get credetials * change(ui) - removed type * change(ui) - removed type --- frontend/app/api_client.js | 1 + frontend/app/components/Session/LivePlayer.js | 46 ++++++++++++------- .../app/components/hocs/withPermissions.js | 2 +- .../MessageDistributor/MessageDistributor.ts | 4 +- .../managers/AssistManager.ts | 19 +++++--- frontend/app/player/singletone.js | 4 +- 6 files changed, 48 insertions(+), 28 deletions(-) diff --git a/frontend/app/api_client.js b/frontend/app/api_client.js index babb7a7c6..02e575033 100644 --- a/frontend/app/api_client.js +++ b/frontend/app/api_client.js @@ -80,6 +80,7 @@ export default class APIClient { path !== '/targets_temp' && !path.includes('/metadata/session_search') && !path.includes('/watchdogs/rules') && + !path.includes('/assist/credentials') && !!this.siteId && siteIdRequiredPaths.some(sidPath => path.startsWith(sidPath)) ) { diff --git a/frontend/app/components/Session/LivePlayer.js b/frontend/app/components/Session/LivePlayer.js index cf10dfbea..336ce9cea 100644 --- a/frontend/app/components/Session/LivePlayer.js +++ b/frontend/app/components/Session/LivePlayer.js @@ -2,6 +2,7 @@ import { useEffect } from 'react'; import { connect } from 'react-redux'; import { Loader } from 'UI'; import { toggleFullscreen, closeBottomBlock } from 'Duck/components/player'; +import { withRequest } from 'HOCs' import { PlayerProvider, connectPlayer, @@ -30,17 +31,24 @@ const InitLoader = connectPlayer(state => ({ }))(Loader); -function WebPlayer ({ showAssist, session, toggleFullscreen, closeBottomBlock, live, fullscreen, jwt }) { +function WebPlayer ({ showAssist, session, toggleFullscreen, closeBottomBlock, live, fullscreen, jwt, loadingCredentials, assistCredendials, request }) { useEffect(() => { - initPlayer(session, jwt); + if (!loadingCredentials) { + initPlayer(session, jwt, assistCredendials); + } return () => cleanPlayer() - }, [ session.sessionId ]); + }, [ session.sessionId, loadingCredentials, assistCredendials ]); // LAYOUT (TODO: local layout state - useContext or something..) - useEffect(() => () => { - toggleFullscreen(false); - closeBottomBlock(); + useEffect(() => { + request(); + return () => { + toggleFullscreen(false); + closeBottomBlock(); + } }, []) + + return ( @@ -54,14 +62,18 @@ function WebPlayer ({ showAssist, session, toggleFullscreen, closeBottomBlock, l ); } - -export default connect(state => ({ - session: state.getIn([ 'sessions', 'current' ]), - showAssist: state.getIn([ 'sessions', 'showChatWindow' ]), - jwt: state.get('jwt'), - fullscreen: state.getIn([ 'components', 'player', 'fullscreen' ]), -}), { - toggleFullscreen, - closeBottomBlock, -})(WebPlayer) - +export default withRequest({ + initialData: null, + endpoint: '/assist/credentials', + dataWrapper: data => data, + dataName: 'assistCredendials', + loadingName: 'loadingCredentials', +})(connect( + state => ({ + session: state.getIn([ 'sessions', 'current' ]), + showAssist: state.getIn([ 'sessions', 'showChatWindow' ]), + jwt: state.get('jwt'), + fullscreen: state.getIn([ 'components', 'player', 'fullscreen' ]), + }), + { toggleFullscreen, closeBottomBlock }, +)(WebPlayer)); \ No newline at end of file diff --git a/frontend/app/components/hocs/withPermissions.js b/frontend/app/components/hocs/withPermissions.js index c7a48609c..40597aa77 100644 --- a/frontend/app/components/hocs/withPermissions.js +++ b/frontend/app/components/hocs/withPermissions.js @@ -3,7 +3,7 @@ import { NoPermission } from 'UI'; export default (requiredPermissions, className) => BaseComponent => @connect((state, props) => ({ - permissions: state.getIn([ 'user', 'account', 'permissions' ]), + permissions: state.getIn([ 'user', 'account', 'permissions' ]) || [], isEnterprise: state.getIn([ 'user', 'client', 'edition' ]) === 'ee', })) class extends React.PureComponent { diff --git a/frontend/app/player/MessageDistributor/MessageDistributor.ts b/frontend/app/player/MessageDistributor/MessageDistributor.ts index e8d807593..c742c10b5 100644 --- a/frontend/app/player/MessageDistributor/MessageDistributor.ts +++ b/frontend/app/player/MessageDistributor/MessageDistributor.ts @@ -118,11 +118,11 @@ export default class MessageDistributor extends StatedScreen { private navigationStartOffset: number = 0; private lastMessageTime: number = 0; - constructor(private readonly session: any /*Session*/, jwt: string) { + constructor(private readonly session: any /*Session*/, jwt: string, config) { super(); this.pagesManager = new PagesManager(this, this.session.isMobile) this.mouseManager = new MouseManager(this); - this.assistManager = new AssistManager(session, this); + this.assistManager = new AssistManager(session, this, config); this.sessionStart = this.session.startedAt; diff --git a/frontend/app/player/MessageDistributor/managers/AssistManager.ts b/frontend/app/player/MessageDistributor/managers/AssistManager.ts index 992cdc987..f9b708601 100644 --- a/frontend/app/player/MessageDistributor/managers/AssistManager.ts +++ b/frontend/app/player/MessageDistributor/managers/AssistManager.ts @@ -117,10 +117,8 @@ function resolveCSS(baseURL: string, css: string): string { return rewriteCSSLinks(css, rawurl => resolveURL(baseURL, rawurl)); } - export default class AssistManager { - constructor(private session, private md: MessageDistributor) {} - + constructor(private session, private md: MessageDistributor, private config) {} private setStatus(status: ConnectionStatus) { if (status === ConnectionStatus.Connecting) { @@ -150,13 +148,22 @@ export default class AssistManager { } this.setStatus(ConnectionStatus.Connecting) import('peerjs').then(({ default: Peer }) => { - // @ts-ignore - const peer = new Peer({ + const _config = { // @ts-ignore host: new URL(window.ENV.API_EDP).host, path: '/assist', port: location.protocol === 'https:' ? 443 : 80, - }); + } + + if (this.config) { + _config['config'] = { + iceServers: this.config, + sdpSemantics: 'unified-plan', + iceTransportPolicy: 'relay', + }; + } + + const peer = new Peer(_config); this.peer = peer; peer.on('error', e => { if (e.type !== 'peer-unavailable') { diff --git a/frontend/app/player/singletone.js b/frontend/app/player/singletone.js index adca40cf6..619f9b02b 100644 --- a/frontend/app/player/singletone.js +++ b/frontend/app/player/singletone.js @@ -28,11 +28,11 @@ document.addEventListener("visibilitychange", function() { } }); -export function init(session, jwt) { +export function init(session, jwt, config) { const live = session.live; const endTime = !live && session.duration.valueOf(); - instance = new Player(session, jwt); + instance = new Player(session, jwt, config); update({ initialized: true, live,