From d601c32bd44db7c6b6715973fb8612c6c19b8c1f Mon Sep 17 00:00:00 2001
From: raviteja83 <ravi.theja@100ms.live>
Date: Mon, 9 Oct 2023 20:26:45 +0530
Subject: [PATCH] fix: use canplaythrough

---
 .../Prebuilt/components/ScreenshareTile.tsx   | 19 ++++++++++---------
 1 file changed, 10 insertions(+), 9 deletions(-)

diff --git a/packages/roomkit-react/src/Prebuilt/components/ScreenshareTile.tsx b/packages/roomkit-react/src/Prebuilt/components/ScreenshareTile.tsx
index 17bafbfdce..ce3aa479a6 100644
--- a/packages/roomkit-react/src/Prebuilt/components/ScreenshareTile.tsx
+++ b/packages/roomkit-react/src/Prebuilt/components/ScreenshareTile.tsx
@@ -85,7 +85,6 @@ export const ScreenshareTile = ({
         minHeight: 0,
         margin: 'auto',
         maxWidth: '100%',
-        maxHeight: '100%',
         opacity: showContent ? 1 : 0,
       }}
       data-testid="screenshare_tile"
@@ -107,14 +106,16 @@ export const ScreenshareTile = ({
             {isFullscreen ? <ShrinkIcon /> : <ExpandIcon />}
           </StyledVideoTile.FullScreenButton>
         ) : null}
-        <Video
-          screenShare={true}
-          mirror={false}
-          attach={!isAudioOnly}
-          trackId={track?.id}
-          css={{ minHeight: 0 }}
-          onLoadedData={() => setShowContent(true)}
-        />
+        {track ? (
+          <Video
+            screenShare={true}
+            mirror={false}
+            attach={!isAudioOnly}
+            trackId={track?.id}
+            css={{ minHeight: 0, width: 'max-content', maxWidth: '100%' }}
+            onCanPlayThrough={() => setShowContent(true)}
+          />
+        ) : null}
         <StyledVideoTile.Info css={labelStyles}>{label}</StyledVideoTile.Info>
         {isMouseHovered && !peer.isLocal ? (
           <TileMenu