From a73515c3aa0d73b32442fe19973dfa64522ee49e Mon Sep 17 00:00:00 2001
From: hyrious <hyrious@outlook.com>
Date: Mon, 21 Nov 2022 13:54:27 +0800
Subject: [PATCH] fix(flat-services): share screen not working on windows

---
 .../ShareScreenPicker/ScreenList/index.tsx    |  3 ++-
 .../src/services/video-chat/share-screen.ts   |  4 ++-
 .../src/rtc-share-screen.ts                   | 25 +++++++++++++------
 3 files changed, 22 insertions(+), 10 deletions(-)

diff --git a/packages/flat-pages/src/components/ShareScreen/ShareScreenPicker/ScreenList/index.tsx b/packages/flat-pages/src/components/ShareScreen/ShareScreenPicker/ScreenList/index.tsx
index f65e2b19a36..5a9243f5baa 100644
--- a/packages/flat-pages/src/components/ShareScreen/ShareScreenPicker/ScreenList/index.tsx
+++ b/packages/flat-pages/src/components/ShareScreen/ShareScreenPicker/ScreenList/index.tsx
@@ -50,7 +50,8 @@ export const ScreenList = observer<ScreenListProps>(function ShareScreen({
     return (
         <div className="screen-list">
             {screenInfo.map(info => {
-                const key = `${info.type}-${info.screenId}`;
+                const id = typeof info.screenId === "number" ? info.screenId : info.screenId.id;
+                const key = `${info.type}-${id}`;
                 const isActive = activeInfo === key;
 
                 return (
diff --git a/packages/flat-services/src/services/video-chat/share-screen.ts b/packages/flat-services/src/services/video-chat/share-screen.ts
index 50866737411..b8423b6ef46 100644
--- a/packages/flat-services/src/services/video-chat/share-screen.ts
+++ b/packages/flat-services/src/services/video-chat/share-screen.ts
@@ -41,9 +41,11 @@ export abstract class IServiceShareScreen {
 // Only used in electron.
 export interface IServiceShareScreenInfo {
     type: "display" | "window";
-    screenId: number;
+    screenId: number | { id: number };
     name: string;
     image: Uint8Array;
+    width: number;
+    height: number;
 }
 
 function doesNotSupportError(type: string): Error {
diff --git a/service-providers/agora-rtc/agora-rtc-electron/src/rtc-share-screen.ts b/service-providers/agora-rtc/agora-rtc-electron/src/rtc-share-screen.ts
index 40c6e80aaf6..fb3d8c17437 100644
--- a/service-providers/agora-rtc/agora-rtc-electron/src/rtc-share-screen.ts
+++ b/service-providers/agora-rtc/agora-rtc-electron/src/rtc-share-screen.ts
@@ -4,7 +4,11 @@ import {
     IServiceShareScreenParams,
 } from "@netless/flat-services";
 import type AgoraRtcEngine from "agora-electron-sdk";
-import type { DisplayInfo, WindowInfo } from "agora-electron-sdk/types/Api/native_type";
+import type {
+    DisplayInfo,
+    ScreenSymbol,
+    WindowInfo,
+} from "agora-electron-sdk/types/Api/native_type";
 
 import { SideEffectManager } from "side-effect-manager";
 import { combine, Val } from "value-enhancer";
@@ -120,9 +124,11 @@ export class AgoraRTCElectronShareScreen extends IServiceShareScreen {
             if ("displayId" in info) {
                 return {
                     type: "display",
-                    screenId: info.displayId.id,
+                    screenId: info.displayId,
                     name: "Desktop",
                     image: info.image,
+                    width: info.width,
+                    height: info.height,
                 };
             } else {
                 return {
@@ -130,6 +136,8 @@ export class AgoraRTCElectronShareScreen extends IServiceShareScreen {
                     screenId: info.windowId,
                     name: `${info.ownerName} - ${info.name}`,
                     image: info.image,
+                    width: info.width,
+                    height: info.height,
                 };
             }
         };
@@ -179,17 +187,18 @@ export class AgoraRTCElectronShareScreen extends IServiceShareScreen {
         this._pTogglingShareScreen = new Promise<void>(resolve => {
             this.client.once("videoSourceJoinedSuccess", () => {
                 this.client.videoSourceSetVideoProfile(43, false);
+                const { width, height } = screenInfo;
                 if (screenInfo.type === "display") {
                     this.client.videoSourceStartScreenCaptureByScreen(
-                        { id: screenInfo.screenId },
-                        rect,
-                        videoSourceParams,
+                        screenInfo.screenId as ScreenSymbol,
+                        { ...rect, width, height },
+                        { ...videoSourceParams, width, height },
                     );
                 } else {
                     this.client.videoSourceStartScreenCaptureByWindow(
-                        screenInfo.screenId,
-                        rect,
-                        videoSourceParams,
+                        screenInfo.screenId as number,
+                        { ...rect, width, height },
+                        { ...videoSourceParams, width, height },
                     );
                 }
                 resolve();