From 64c4567d0654c3fc1a588e166eb29285bde10b5a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Victor?= <joaovictornunes973@gmail.com>
Date: Thu, 14 Mar 2024 11:20:08 -0300
Subject: [PATCH] fix(poll): avoid rendering polling component twice

---
 .../imports/ui/components/polling/container.jsx      | 12 +++++++++++-
 .../imports/ui/components/presentation/component.jsx |  5 +++--
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/bigbluebutton-html5/imports/ui/components/polling/container.jsx b/bigbluebutton-html5/imports/ui/components/polling/container.jsx
index f5a76aab26..506c2ff656 100644
--- a/bigbluebutton-html5/imports/ui/components/polling/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/polling/container.jsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import { createPortal } from 'react-dom';
 import PropTypes from 'prop-types';
 import { withTracker } from 'meteor/react-meteor-data';
 import Users from '/imports/api/users';
@@ -10,13 +11,20 @@ import { isPollingEnabled } from '/imports/ui/services/features';
 
 const propTypes = {
   pollExists: PropTypes.bool.isRequired,
+  presentationIsFullscreen: PropTypes.bool.isRequired,
 };
 
-const PollingContainer = ({ pollExists, ...props }) => {
+const PollingContainer = ({ pollExists, presentationIsFullscreen, ...props }) => {
   const currentUser = Users.findOne({ userId: Auth.userID }, { fields: { presenter: 1 } });
   const showPolling = pollExists && !currentUser.presenter && isPollingEnabled();
 
   if (showPolling) {
+    if (presentationIsFullscreen) {
+      return createPortal(
+        <PollingComponent {...props} />,
+        document.getElementById('presentation-polling-placeholder'),
+      );
+    }
     return (
       <PollingComponent {...props} />
     );
@@ -31,6 +39,7 @@ export default withTracker(() => {
     pollExists, handleVote, poll, handleTypedVote,
   } = PollingService.mapPolls();
   const { pollTypes } = PollService;
+  const presentationIsFullscreen = Session.get('presentationIsFullscreen');
 
   if (poll && poll?.pollType) {
     const isResponse = poll.pollType === pollTypes.Response;
@@ -46,5 +55,6 @@ export default withTracker(() => {
     pollTypes,
     isDefaultPoll: PollService.isDefaultPoll,
     isMeteorConnected: Meteor.status().connected,
+    presentationIsFullscreen,
   });
 })(PollingContainer);
diff --git a/bigbluebutton-html5/imports/ui/components/presentation/component.jsx b/bigbluebutton-html5/imports/ui/components/presentation/component.jsx
index 80ce006b37..7727458607 100755
--- a/bigbluebutton-html5/imports/ui/components/presentation/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/presentation/component.jsx
@@ -428,10 +428,11 @@ class Presentation extends PureComponent {
   onFullscreenChange() {
     const { isFullscreen } = this.state;
     const newIsFullscreen = FullscreenService.isFullScreen(
-      this.refPresentationContainer
+      this.refPresentationContainer,
     );
     if (isFullscreen !== newIsFullscreen) {
       this.setState({ isFullscreen: newIsFullscreen });
+      Session.set('presentationIsFullscreen', newIsFullscreen);
     }
   }
 
@@ -892,7 +893,7 @@ class Presentation extends PureComponent {
                   isToolbarVisible={isToolbarVisible}
                   isViewersAnnotationsLocked={isViewersAnnotationsLocked}
                 />
-                {isFullscreen && <PollingContainer />}
+                <div id="presentation-polling-placeholder" />
               </div>
               {!tldrawIsMounting && (
                 <Styled.PresentationToolbar