fix: use canplaythrough

100mslive · Oct 9, 2023 · d601c32 · d601c32
1 parent 7084ca9
commit d601c32
Showing 1 changed file with 10 additions and 9 deletions.
diff --git 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