From f4c6253cb8b2280264c123b18ba172e2f4a43c47 Mon Sep 17 00:00:00 2001
From: eswarclynn <esuclintblazer@gmail.com>
Date: Tue, 19 Mar 2024 03:55:07 +0530
Subject: [PATCH] fix: disable whiteboard toggle during remote screenshare

---
 .../components/Footer/WhiteboardToggle.tsx    | 20 ++++++++++++++++---
 1 file changed, 17 insertions(+), 3 deletions(-)

diff --git a/packages/roomkit-react/src/Prebuilt/components/Footer/WhiteboardToggle.tsx b/packages/roomkit-react/src/Prebuilt/components/Footer/WhiteboardToggle.tsx
index a6abde09c3..0cb9efd262 100644
--- a/packages/roomkit-react/src/Prebuilt/components/Footer/WhiteboardToggle.tsx
+++ b/packages/roomkit-react/src/Prebuilt/components/Footer/WhiteboardToggle.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useWhiteboard } from '@100mslive/react-sdk';
+import { useScreenShare, useWhiteboard } from '@100mslive/react-sdk';
 import { PencilDrawIcon } from '@100mslive/react-icons';
 import { Tooltip } from '../../..';
 // @ts-ignore: No implicit Any
@@ -9,14 +9,28 @@ import { ToastManager } from '../Toast/ToastManager';
 
 export const WhiteboardToggle = () => {
   const { toggle, open, isOwner } = useWhiteboard();
+  const { screenSharingPeerId, amIScreenSharing } = useScreenShare();
+  const remoteScreenShare = screenSharingPeerId && !amIScreenSharing;
+  const disabled = remoteScreenShare || (open && !isOwner);
+
   if (!toggle) {
     return null;
   }
 
   return (
-    <Tooltip key="whiteboard" title={`${open ? 'Close' : 'Open'} Whiteboard`}>
+    <Tooltip
+      key="whiteboard"
+      title={
+        remoteScreenShare
+          ? 'Cannot open whiteboard when viewing a shared screen'
+          : `${open ? 'Close' : 'Open'} Whiteboard`
+      }
+    >
       <IconButton
         onClick={async () => {
+          if (disabled) {
+            return;
+          }
           try {
             await toggle();
           } catch (error) {
@@ -24,7 +38,7 @@ export const WhiteboardToggle = () => {
           }
         }}
         active={!open}
-        disabled={open && !isOwner}
+        disabled={disabled}
         data-testid="whiteboard_btn"
       >
         <PencilDrawIcon />