BigBlueButton/bigbluebutton-Github
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #19502 from JoVictorNunes/issue-19495

Browse Source 
fix(whiteboard): prevent annotation subscription from being recreated
This commit is contained in:
Ramón Souza 2024-01-25 09:05:54 -03:00 committed by GitHub
commit 304995821d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 34 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
bigbluebutton-html5/imports/ui/components/whiteboard/container.jsx
View File

@ -1,8 +1,7 @@
import React from 'react'; import React, { useEffect, useState } from 'react';
import { useQuery, useSubscription, useMutation } from '@apollo/client'; import { useSubscription, useMutation } from '@apollo/client';
import { import {
CURRENT_PRESENTATION_PAGE_SUBSCRIPTION, CURRENT_PRESENTATION_PAGE_SUBSCRIPTION,
CURRENT_PAGE_ANNOTATIONS_QUERY,
CURRENT_PAGE_ANNOTATIONS_STREAM, CURRENT_PAGE_ANNOTATIONS_STREAM,
CURRENT_PAGE_WRITERS_SUBSCRIPTION, CURRENT_PAGE_WRITERS_SUBSCRIPTION,
} from './queries'; } from './queries';
@ -39,9 +38,6 @@ import { PRESENTATION_SET_ZOOM } from '../presentation/mutations';
const WHITEBOARD_CONFIG = Meteor.settings.public.whiteboard; const WHITEBOARD_CONFIG = Meteor.settings.public.whiteboard;
let annotations = [];
let lastUpdatedAt = null;
const WhiteboardContainer = (props) => { const WhiteboardContainer = (props) => {
const { const {
intl, intl,
@ -49,6 +45,8 @@ const WhiteboardContainer = (props) => {
svgUri, svgUri,
} = props; } = props;
const [annotations, setAnnotations] = useState([]);
const meeting = useMeeting((m) => ({ const meeting = useMeeting((m) => ({
lockSettings: m?.lockSettings, lockSettings: m?.lockSettings,
})); }));
@ -98,57 +96,46 @@ const WhiteboardContainer = (props) => {
const { data: cursorData } = useSubscription(CURSOR_SUBSCRIPTION); const { data: cursorData } = useSubscription(CURSOR_SUBSCRIPTION);
const { pres_page_cursor: cursorArray } = (cursorData || []); const { pres_page_cursor: cursorArray } = (cursorData || []);
const { const { data: annotationStreamData } = useSubscription(
loading: annotationsLoading,
data: annotationsData,
} = useQuery(CURRENT_PAGE_ANNOTATIONS_QUERY);
const { pres_annotation_curr: history } = (annotationsData || []);
const lastHistoryTime = history?.[0]?.lastUpdatedAt || null;
if (!lastUpdatedAt) {
if (lastHistoryTime) {
if (new Date(lastUpdatedAt).getTime() < new Date(lastHistoryTime).getTime()) {
lastUpdatedAt = lastHistoryTime;
}
} else {
const newLastUpdatedAt = new Date();
lastUpdatedAt = newLastUpdatedAt.toISOString();
}
}
const { data: streamData } = useSubscription(
CURRENT_PAGE_ANNOTATIONS_STREAM, CURRENT_PAGE_ANNOTATIONS_STREAM,
{ {
variables: { lastUpdatedAt }, variables: { lastUpdatedAt: new Date(0).toISOString() },
}, },
); );
const { pres_annotation_curr_stream: streamDataItem } = (streamData || []);
if (streamDataItem) { useEffect(() => {
if (new Date(lastUpdatedAt).getTime() < new Date(streamDataItem[0].lastUpdatedAt).getTime()) { const { pres_annotation_curr_stream: annotationStream } = annotationStreamData || {};
if (streamDataItem[0].annotationInfo === '') {
// remove shape if (annotationStream) {
annotations = annotations.filter( const newAnnotations = [];
(annotation) => annotation.annotationId !== streamDataItem[0].annotationId, const annotationsToBeRemoved = [];
); annotationStream.forEach((item) => {
} else { if (item.annotationInfo === '') {
// add shape annotationsToBeRemoved.push(item.annotationId);
annotations = annotations.concat(streamDataItem); } else {
} newAnnotations.push(item);
lastUpdatedAt = streamDataItem[0].lastUpdatedAt; }
});
const currentAnnotations = annotations.filter(
(annotation) => !annotationsToBeRemoved.includes(annotation.annotationId),
);
setAnnotations([...currentAnnotations, ...newAnnotations]);
} }
} }, [annotationStreamData]);
let shapes = {}; let shapes = {};
let bgShape = []; let bgShape = [];
if (!annotationsLoading && history) { const pageAnnotations = annotations
const pageAnnotations = history .filter((annotation) => annotation.pageId === currentPresentationPage?.pageId);
.concat(annotations)
.filter((annotation) => annotation.pageId === currentPresentationPage?.pageId);
shapes = formatAnnotations(pageAnnotations, intl, curPageId, pollResults, currentPresentationPage); shapes = formatAnnotations(
} pageAnnotations,
intl,
curPageId,
pollResults,
currentPresentationPage,
);
const { isIphone } = deviceInfo; const { isIphone } = deviceInfo;