feat(player): add agent id to assist con query

frontend/app/components/Session/LivePlayer.tsx

@@ -1,4 +1,4 @@
-import {audioContextManager} from "App/utils/screenRecorder";
+import { audioContextManager } from 'App/utils/screenRecorder';
 import React from 'react';
 import { useEffect, useState } from 'react';
 import { connect } from 'react-redux';
@@ -13,7 +13,7 @@ import Session from 'App/types/session';
 import withLocationHandlers from 'HOCs/withLocationHandlers';
 import APIClient from 'App/api_client';
 import { useLocation } from 'react-router-dom';
-import { toast } from 'react-toastify'
+import { toast } from 'react-toastify';
 
 interface Props {
   session: Session;
@@ -25,6 +25,7 @@ interface Props {
   isMultiview?: boolean;
   query?: Record<string, (key: string) => any>;
   request: () => void;
+  userId: number;
 }
 
 let playerInst: ILivePlayerContext['player'] | undefined;
@@ -36,20 +37,20 @@ function LivePlayer({
   isMultiview,
   customSession,
   query,
-  isEnterprise
+  isEnterprise,
+  userId,
 }: Props) {
   // @ts-ignore
   const [contextValue, setContextValue] = useState<ILivePlayerContext>(defaultContextValue);
   const [fullView, setFullView] = useState(false);
-  const openedFromMultiview = query?.get('multi') === 'true'
+  const openedFromMultiview = query?.get('multi') === 'true';
   const usedSession = isMultiview ? customSession! : session;
-
   const location = useLocation();
 
   useEffect(() => {
     playerInst = undefined;
     if (!usedSession.sessionId || contextValue.player !== undefined) return;
-    console.debug('creating live player for', usedSession.sessionId)
+    console.debug('creating live player for', usedSession.sessionId);
     const sessionWithAgentData = {
       ...usedSession,
       agentInfo: {
@@ -58,21 +59,25 @@ function LivePlayer({
       },
     };
     if (isEnterprise) {
-      new APIClient().get('/config/assist/credentials').then(r => r.json())
+      new APIClient()
+        .get('/config/assist/credentials')
+        .then((r) => r.json())
         .then(({ data }) => {
           const [player, store] = createLiveWebPlayer(
             sessionWithAgentData,
             data,
+            userId,
             (state) => makeAutoObservable(state),
             toast
           );
           setContextValue({ player, store });
           playerInst = player;
-        })
+        });
     } else {
       const [player, store] = createLiveWebPlayer(
         sessionWithAgentData,
         null,
+        userId,
         (state) => makeAutoObservable(state),
         toast
       );
@@ -81,14 +86,17 @@ function LivePlayer({
     }
 
     return () => {
-      if (!location.pathname.includes('multiview') || !location.pathname.includes(usedSession.sessionId)) {
-        console.debug('cleaning live player for', usedSession.sessionId)
+      if (
+        !location.pathname.includes('multiview') ||
+        !location.pathname.includes(usedSession.sessionId)
+      ) {
+        console.debug('cleaning live player for', usedSession.sessionId);
         audioContextManager.clear();
         playerInst?.clean?.();
         // @ts-ignore default empty
-        setContextValue(defaultContextValue)
+        setContextValue(defaultContextValue);
       }
-    }
+    };
   }, [location.pathname, usedSession.sessionId]);
 
   // LAYOUT (TODO: local layout state - useContext or something..)
@@ -130,15 +138,14 @@ export default withPermissions(
   '',
   true
 )(
-  connect(
-    (state: any) => {
-      return {
-        session: state.getIn(['sessions', 'current']),
-        showAssist: state.getIn(['sessions', 'showChatWindow']),
-        isEnterprise: state.getIn(['user', 'account', 'edition']) === 'ee',
-        userEmail: state.getIn(['user', 'account', 'email']),
-        userName: state.getIn(['user', 'account', 'name']),
-      };
-    }
-  )(withLocationHandlers()(React.memo(LivePlayer)))
-)
+  connect((state: any) => {
+    return {
+      session: state.getIn(['sessions', 'current']),
+      showAssist: state.getIn(['sessions', 'showChatWindow']),
+      isEnterprise: state.getIn(['user', 'account', 'edition']) === 'ee',
+      userEmail: state.getIn(['user', 'account', 'email']),
+      userName: state.getIn(['user', 'account', 'name']),
+      userId: state.getIn(['user', 'account', 'id']),
+    };
+  })(withLocationHandlers()(React.memo(LivePlayer)))
+);

frontend/app/player/create.ts

@@ -50,6 +50,7 @@ export function createClickMapPlayer(
 export function createLiveWebPlayer(
 	session: SessionFilesInfo,
 	config: RTCIceServer[] | null,
+	agentId: number,
 	wrapStore?: (s:IWebLivePlayerStore) => IWebLivePlayerStore,
 	uiErrorHandler?: { error: (msg: string) => void }
 ): [IWebLivePlayer, IWebLivePlayerStore] {
@@ -60,6 +61,6 @@ export function createLiveWebPlayer(
 		store = wrapStore(store)
 	}
 
-	const player = new WebLivePlayer(store, session, config, uiErrorHandler)
+	const player = new WebLivePlayer(store, session, config, agentId, uiErrorHandler)
 	return [player, store]
 }

frontend/app/player/web/WebLivePlayer.ts

@@ -23,7 +23,8 @@ export default class WebLivePlayer extends WebPlayer {
     wpState: Store<typeof WebLivePlayer.INITIAL_STATE>,
     private session: SessionFilesInfo,
     config: RTCIceServer[] | null,
-    uiErrorHandler?: { error: (msg: string) => void }
+    agentId: number,
+    uiErrorHandler?: { error: (msg: string) => void },
   ) {
     super(wpState, session, true, false, uiErrorHandler)
 
@@ -42,7 +43,7 @@ export default class WebLivePlayer extends WebPlayer {
       wpState,
       uiErrorHandler,
     )
-    this.assistManager.connect(session.agentToken!)
+    this.assistManager.connect(session.agentToken!, agentId)
   }
 
   toggleTimetravel = async () => {

frontend/app/player/web/assist/AssistManager.ts

@@ -137,7 +137,7 @@ export default class AssistManager {
     this.inactiveTimeout && clearTimeout(this.inactiveTimeout)
     this.inactiveTimeout = undefined
   }
-  connect(agentToken: string) {
+  connect(agentToken: string, agentId: number) {
     const jmr = new JSONRawMessageReader()
     const reader = new MStreamReader(jmr, this.session.startedAt)
     let waitingForMessages = true
@@ -162,7 +162,8 @@ export default class AssistManager {
           identity: "agent",
           agentInfo: JSON.stringify({
             ...this.session.agentInfo,
-            query: document.location.search
+            query: document.location.search,
+            agentId,
           })
         }
       })