fix(flat-services): share screen not working on windows

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 (

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 {

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,16 +124,20 @@ 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 {
                     type: "window",
                     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();