jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui): fix multiview window size (#1991)

Browse source
This commit is contained in:
Delirium 2024-03-25 13:53:58 +01:00 • committed by GitHub
parent dee3daa58a
commit 21c312f98b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 21 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
frontend/app/components/Session_/Multiview/Multiview.tsx
View file

@ -16,14 +16,14 @@ function Multiview({
total,
fetchSessions,
siteId,
assistCredendials,
assistCredentials,
customSetSessions,
}: {
total: number;
customSetSessions: (data: any) => void;
fetchSessions: (filter: any) => void;
siteId: string;
assistCredendials: any;
assistCredentials: any;
list: Record<string, any>[];
}) {
const { showModal, hideModal } = useModal();
@ -33,8 +33,8 @@ function Multiview({
// @ts-ignore
const { sessionsquery } = useParams();
const onSessionsChange = (sessions: Record<string, any>[]) => {
const sessionIdQuery = encodeURIComponent(sessions.map((s) => s.sessionId).join(','));
const onSessionsChange = (sessions: Array<Record<string, any> | undefined>) => {
const sessionIdQuery = encodeURIComponent(sessions.map((s) => s && s.sessionId).join(','));
return history.replace(withSiteId(multiview(sessionIdQuery), siteId));
};
@ -82,7 +82,7 @@ function Multiview({
const placeholder = emptySpace > 0 ? new Array(emptySpace).fill(0) : []
return (
<div className="w-screen h-screen flex flex-col">
<div style={{ height: '95vh' }} className="full flex flex-col">
<div className="w-full p-4 flex justify-between items-center">
<div>
{/* @ts-ignore */}
@ -101,7 +101,7 @@ function Multiview({
<LivePlayer
isMultiview
customSession={session}
customAssistCredendials={assistCredendials}
customAssistCredentials={assistCredentials}
/>
) : (
<div>Loading session</div>

28
frontend/app/mstore/assistMultiviewStore.ts
View file

@ -16,8 +16,8 @@ export interface LiveSessionListItem extends Record<string, any> {
export default class AssistMultiviewStore {
sessions: MultiSessions = [];
activeSession: LiveSessionListItem = null;
onChangeCb: (sessions: MultiSessions) => void;
activeSession: LiveSessionListItem | undefined = undefined;
onChangeCb?: (sessions: MultiSessions) => void;
constructor() {
makeAutoObservable(this);
@ -31,7 +31,7 @@ export default class AssistMultiviewStore {
this.onChangeCb = cb;
}
get sortedSessions() {
get sortedSessions(): LiveSessionListItem[] {
// @ts-ignore ???
return this.sessions.slice().sort((a, b) => a.key - b.key);
}
@ -43,32 +43,32 @@ export default class AssistMultiviewStore {
addSession(session: Record<string, any>) {
if (
this.sessions.length < 4 &&
this.sessions.findIndex((s) => s.sessionId === session.sessionId) === -1
this.sessions.findIndex((s) => s && s.sessionId === session.sessionId) === -1
) {
const plainSession = session.toJS ? session.toJS() : session;
this.sessions.push({ ...plainSession, key: this.sessions.length });
return this.onChangeCb(this.sessions);
return this.onChangeCb?.(this.sessions);
}
}
replaceSession(targetId: string, session: Record<string, any>) {
const targetIndex = this.sessions.findIndex((s) => s.sessionId === targetId);
const targetIndex = this.sessions.findIndex((s) => s && s.sessionId === targetId);
if (targetIndex !== -1) {
const plainSession = session.toJS ? session.toJS() : session;
this.sessions[targetIndex] = { ...plainSession, key: targetIndex };
return this.onChangeCb(this.sessions);
return this.onChangeCb?.(this.sessions);
}
}
removeSession(sessionId: string) {
this.sessions = this.sessions.filter(
(session) => session.sessionId !== sessionId
(session) => session && session.sessionId !== sessionId
) as MultiSessions;
return this.onChangeCb(this.sessions);
return this.onChangeCb?.(this.sessions);
}
setActiveSession(sessionId: string) {
this.activeSession = this.sessions.find((session) => session.sessionId === sessionId);
this.activeSession = this.sessions.find((session) => session && session.sessionId === sessionId);
}
setDefault(session: Record<string, any>) {
@ -106,15 +106,17 @@ export default class AssistMultiviewStore {
setToken(sessionId: string, token: string) {
const sessions = this.sessions;
const targetIndex = sessions.findIndex((s) => s.sessionId === sessionId);
sessions[targetIndex].agentToken = token;
const targetIndex = sessions.findIndex((s) => s && s.sessionId === sessionId);
if (sessions[targetIndex] !== undefined) {
sessions[targetIndex]!.agentToken = token;
}
return (this.sessions = sessions);
}
reset() {
this.sessions = [];
this.activeSession = null;
this.activeSession = undefined;
this.onChangeCb = undefined
}
}