From 354bdd8bfea77c1aab68315235c99528e4e6d435 Mon Sep 17 00:00:00 2001
From: lebaudantoine <lebaud.antoine131@gmail.com>
Date: Fri, 21 Feb 2025 12:07:24 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=A9=B9(frontend)=20fix=20screen=20sharing?=
 =?UTF-8?q?=20warnings=20browser=20compatibility?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This feature is far from perfect. Still not working on Safari.
Also, we should display this warning when user share the current
opened window. Minor enhancement, I don't have time currently
to prioritize these enhancements.
---
 .../components/FullScreenShareWarning.tsx     | 37 ++++++++++++++++---
 src/frontend/src/locales/en/rooms.json        |  2 +-
 src/frontend/src/locales/fr/rooms.json        |  2 +-
 3 files changed, 34 insertions(+), 7 deletions(-)

diff --git a/src/frontend/src/features/rooms/livekit/components/FullScreenShareWarning.tsx b/src/frontend/src/features/rooms/livekit/components/FullScreenShareWarning.tsx
index f82d070b..decdb784 100644
--- a/src/frontend/src/features/rooms/livekit/components/FullScreenShareWarning.tsx
+++ b/src/frontend/src/features/rooms/livekit/components/FullScreenShareWarning.tsx
@@ -20,14 +20,41 @@ export const FullScreenShareWarning = ({
   const { localParticipant } = useLocalParticipant()
   const screenSharePreferences = useSnapshot(ScreenSharePreferenceStore)
 
-  const isFullScreenCapture = useMemo(() => {
-    const trackLabel =
-      trackReference.publication?.track?.mediaStreamTrack?.label
-    return trackLabel?.includes('screen')
+  const isFullScreenSharing = useMemo(() => {
+    if (trackReference?.source !== 'screen_share') return false
+
+    const mediaStreamTrack = trackReference.publication?.track?.mediaStreamTrack
+
+    if (!mediaStreamTrack) return false
+
+    // Method 1: Display Surface Check (Chrome & Edge)
+    const trackSettings = mediaStreamTrack.getSettings()
+    if (trackSettings?.displaySurface) {
+      return trackSettings.displaySurface === 'monitor'
+    }
+
+    // Method 2: Track Constraints Check
+    const constraints = mediaStreamTrack.getConstraints()
+    if (constraints?.displaySurface) {
+      return constraints.displaySurface === 'monitor'
+    }
+
+    // Method 3: Label Analysis (Firefox, Safari)
+    const trackLabel = mediaStreamTrack.label.toLowerCase()
+    const fullScreenIndicators = [
+      'monitor',
+      'screen',
+      'display',
+      'entire screen',
+      'full screen',
+    ]
+    return fullScreenIndicators.some((indicator) =>
+      trackLabel.includes(indicator)
+    )
   }, [trackReference])
 
   const shouldShowWarning =
-    screenSharePreferences.enabled && isFullScreenCapture
+    screenSharePreferences.enabled && isFullScreenSharing
 
   const handleStopScreenShare = async () => {
     if (!localParticipant.isScreenShareEnabled) return
diff --git a/src/frontend/src/locales/en/rooms.json b/src/frontend/src/locales/en/rooms.json
index de50372a..0a7663f2 100644
--- a/src/frontend/src/locales/en/rooms.json
+++ b/src/frontend/src/locales/en/rooms.json
@@ -200,7 +200,7 @@
     "fullScreen": "Full screen"
   },
   "fullScreenWarning": {
-    "message": "To avoid infinite loop display, do not share your entire screen or browser window. Instead, share a tab or another window.",
+    "message": "To avoid infinite loop display, do not share your entire screen. Instead, share a tab or another window.",
     "stop": "Stop presenting",
     "ignore": "Ignore"
   }
diff --git a/src/frontend/src/locales/fr/rooms.json b/src/frontend/src/locales/fr/rooms.json
index a56bd267..eeb316cc 100644
--- a/src/frontend/src/locales/fr/rooms.json
+++ b/src/frontend/src/locales/fr/rooms.json
@@ -200,7 +200,7 @@
     "fullScreen": "Plein écran"
   },
   "fullScreenWarning": {
-    "message": "Pour éviter l'affichage en boucle infinie, ne partagez pas l'intégralité de votre écran ni de votre fenêtre de navigateur. Partagez plutôt un onglet ou une autre fenêtre.",
+    "message": "Pour éviter l'affichage en boucle infinie, ne partagez pas l'intégralité de votre écran. Partagez plutôt un onglet ou une autre fenêtre.",
     "stop": "Arrêter la présentation",
     "ignore": "Ignorer"
   }