Creating worker instance and getting or creating a new sharedworkspace for co-presence

src/web/client/WebExtensionContext.ts

@@ -21,14 +21,15 @@ import {
     getWebsiteIdToLcidMap,
     getWebsiteLanguageIdToPortalLanguageIdMap,
 } from "./utilities/schemaHelperUtil";
-import { getCustomRequestURL } from "./utilities/urlBuilderUtil";
+import { getCustomRequestURL, getOrCreateSharedWorkspace } from "./utilities/urlBuilderUtil";
 import { schemaKey } from "./schema/constants";
 import { telemetryEventNames } from "./telemetry/constants";
 import { EntityDataMap } from "./context/entityDataMap";
 import { FileDataMap } from "./context/fileDataMap";
 import { IAttributePath, IEntityInfo } from "./common/interfaces";
 import { ConcurrencyHandler } from "./dal/concurrencyHandler";
 import { isMultifileEnabled } from "./utilities/commonUtil";
+import { UserDataMap } from "./context/userDataMap";
 
 export interface IWebExtensionContext {
     // From portalSchema properties
@@ -102,6 +103,11 @@ class WebExtensionContext implements IWebExtensionContext {
     private _userId: string;
     private _formsProEligibilityId: string;
     private _concurrencyHandler: ConcurrencyHandler
+    // Co-Presence for Power Pages Vscode for web
+    private _worker: Worker | undefined;
+    private _sharedWorkSpaceMap: Map<string, string>;
+    private _containerId: string;
+    private _connectedUsers: UserDataMap;
 
     public get schemaDataSourcePropertiesMap() {
         return this._schemaDataSourcePropertiesMap;
@@ -184,6 +190,21 @@ class WebExtensionContext implements IWebExtensionContext {
     public get concurrencyHandler() {
         return this._concurrencyHandler;
     }
+    public get worker() {
+        return this._worker;
+    }
+    public get sharedWorkSpaceMap() {
+        return this._sharedWorkSpaceMap;
+    }
+    public get connectedUsers() {
+        return this._connectedUsers;
+    }
+    public get containerId() {
+        return this._containerId;
+    }
+    public set containerId(containerId: string) {
+        this._containerId = containerId;
+    }
 
     constructor() {
         this._schemaDataSourcePropertiesMap = new Map<string, string>();
@@ -213,6 +234,9 @@ class WebExtensionContext implements IWebExtensionContext {
         this._userId = "";
         this._formsProEligibilityId = "";
         this._concurrencyHandler = new ConcurrencyHandler();
+        this._sharedWorkSpaceMap = new Map<string, string>();
+        this._containerId = "";
+        this._connectedUsers = new UserDataMap();
     }
 
     public setWebExtensionContext(
@@ -301,6 +325,16 @@ class WebExtensionContext implements IWebExtensionContext {
         );
 
         await this.setWebsiteLanguageCode();
+
+        // Getting website Id to populate shared workspace for Co-Presence
+        const websiteid = this.urlParametersMap.get(
+            Constants.queryParameters.WEBSITE_ID
+        ) as string;
+
+        const headers = getCommonHeaders(this._dataverseAccessToken);
+
+        // Populate shared workspace for Co-Presence
+        await this.populateSharedworkspace(headers, dataverseOrgUrl, websiteid);
     }
 
     public async dataverseAuthentication(firstTimeAuth = false) {
@@ -627,6 +661,98 @@ class WebExtensionContext implements IWebExtensionContext {
     public getVscodeWorkspaceState(key: string): IEntityInfo | undefined {
         return this._vscodeWorkspaceState.get(key);
     }
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    public async getWorkerScript(workerUrl : URL) : Promise<any> {
+        try {
+            this.telemetry.sendInfoTelemetry(
+                telemetryEventNames.WEB_EXTENSION_FETCH_WORKER_SCRIPT
+            );
+
+            const response = await this.concurrencyHandler.handleRequest(
+                workerUrl
+            )
+
+            if (!response.ok) {
+                throw new Error(
+                    `Failed to fetch worker script '${workerUrl.toString()}': ${response.statusText}`
+                );
+            }
+
+            this.telemetry.sendInfoTelemetry(
+                telemetryEventNames.WEB_EXTENSION_FETCH_WORKER_SCRIPT_SUCCESS,
+                { workerUrl: workerUrl.toString() }
+            );
+
+            return await response.text();
+        } catch (error) {
+            this.telemetry.sendErrorTelemetry(
+                telemetryEventNames.WEB_EXTENSION_FETCH_WORKER_SCRIPT_FAILED,
+                this.getWorkerScript.name,
+                (error as Error)?.message,
+                error as Error
+            );
+        }
+    }
+
+    public setWorker(worker: Worker) {
+        this._worker = worker;
+    }
+
+    private async populateSharedworkspace(
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        headers: any,
+        dataverseOrgUrl: string,
+        websiteid: string
+    ) {
+        try {
+            const sharedworkspace = await getOrCreateSharedWorkspace({
+                headers,
+                dataverseOrgUrl,
+                websiteid,
+            });
+
+            const sharedWorkSpaceParamsMap = new Map<string, string>();
+            for (const key in sharedworkspace) {
+                sharedWorkSpaceParamsMap.set(
+                    String(key).trim().toLocaleLowerCase(),
+                    String(sharedworkspace[key]).trim()
+                );
+            }
+
+            this._sharedWorkSpaceMap = sharedWorkSpaceParamsMap;
+
+            this.telemetry.sendInfoTelemetry(
+                telemetryEventNames.WEB_EXTENSION_POPULATE_SHARED_WORKSPACE_SUCCESS,
+                { count: this._sharedWorkSpaceMap.size.toString() }
+            );
+        } catch (error) {
+            this.telemetry.sendErrorTelemetry(
+                telemetryEventNames.WEB_EXTENSION_POPULATE_SHARED_WORKSPACE_SYSTEM_ERROR,
+                this.populateSharedworkspace.name,
+                (error as Error)?.message,
+                error as Error
+            );
+        }
+    }
+
+    public async updateConnectedUsersInContext(
+        containerId: string,
+        userName: string,
+        userId: string,
+        entityId: string[]
+    ) {
+        this.connectedUsers.setUserData(
+            containerId,
+            userName,
+            userId,
+            entityId
+        );
+    }
+
+    public async removeConnectedUserInContext(userId: string) {
+        this.connectedUsers.removeUser(userId);
+    }
 }
 
 export default new WebExtensionContext();

src/web/client/common/constants.ts

@@ -53,6 +53,21 @@ export const MULTI_FILE_FEATURE_SETTING_NAME = "enableMultiFileFeature";
 // Co-presence feature constants
 export const CO_PRESENCE_FEATURE_SETTING_NAME = "enableCoPresenceFeature";
 
+// Co-presence constants
+export const GET_OR_CREATE_SHARED_WORK_SPACE = "/api/data/v9.2/GetOrCreateSharedWorkspace";
+
+export enum sharedWorkspaceParameters {
+    SHAREWORKSPACE_ID = "sharedworkspaceid",
+    TENANT_ID = "tenantid",
+    ACCESS_TOKEN = "accesstoken",
+    DISCOVERY_ENDPOINT = "discoveryendpoint",
+}
+
+export enum workerEventMessages {
+    UPDATE_CONNECTED_USERS = "client-data",
+    REMOVE_CONNECTED_USER = "member-removed",
+}
+
 export enum initializationEntityName {
     WEBSITE = "websites",
     WEBSITELANGUAGE = "websitelanguages",

src/web/client/common/worker/webworker.js

@@ -80,7 +80,7 @@ class AzureFluidClient {
     }
 }
 
-async function loadContainer(config, id, swpId) {
+async function loadContainer(config, swpId, entityInfo) {
     try {
         const { container, audience, map } =
             await AzureFluidClient.fetchContainerAndService(config, swpId);
@@ -101,22 +101,23 @@ async function loadContainer(config, id, swpId) {
         if (!initial) {
             existingMembers.forEach(async (value, key) => {
                 const otherUser = value;
-                const connectionArray = otherUser.connections;
 
-                const entityId = [];
+                const userConnections = otherUser.connections;
+
+                const userEntityIdArray = [];
 
                 const connectionIdInContainer = await (container.initialObjects.sharedState.get('selection').get());
 
-                connectionArray.forEach((connectionId) => {
-                    entityId.push(connectionIdInContainer.get(connectionId));
+                userConnections.forEach((connection) => {
+                    userEntityIdArray.push(connectionIdInContainer.get(connection.id));
                 });
 
                 self.postMessage({
                     type: "client-data",
                     userName: otherUser.userName,
                     userId: key,
                     containerId: swpId,
-                    entityId: entityId,
+                    entityId: userEntityIdArray,
                 });
             });
             initial = true;
@@ -127,14 +128,14 @@ async function loadContainer(config, id, swpId) {
                 return;
             } else {
                 const otherUser = map.get(changed.key);
-                const connectionArray = otherUser.connections;
+                const userConnections = otherUser.connections;
 
-                const entityId = [];
+                const userEntityIdArray = [];
 
                 const connectionIdInContainer = await (container.initialObjects.sharedState.get('selection').get());
 
-                connectionArray.forEach((connectionId) => {
-                    entityId.push(connectionIdInContainer.get(connectionId));
+                userConnections.forEach((connection) => {
+                    userEntityIdArray.push(connectionIdInContainer.get(connection.id));
                 });
 
                 // eslint-disable-next-line no-undef
@@ -143,7 +144,7 @@ async function loadContainer(config, id, swpId) {
                     userId: changed.key,
                     userName: otherUser.userName,
                     containerId: swpId,
-                    entityId: entityId,
+                    entityId: userEntityIdArray,
                 });
             }
         });
@@ -160,8 +161,8 @@ function runFluidApp() {
 
         await loadContainer(
             message.afrConfig,
-            message.containerId,
             message.afrConfig.swpId,
+            message.entityInfo
         );
     });
 }

src/web/client/extension.ts

@@ -33,6 +33,7 @@ import * as copilot from "../../common/copilot/PowerPagesCopilot";
 import { IOrgInfo } from "../../common/copilot/model";
 import { copilotNotificationPanel, disposeNotificationPanel } from "../../common/copilot/welcome-notification/CopilotNotificationPanel";
 import { COPILOT_NOTIFICATION_DISABLED } from "../../common/copilot/constants";
+import * as Constants from "./common/constants"
 
 export function activate(context: vscode.ExtensionContext): void {
     // setup telemetry
@@ -184,7 +185,7 @@ export function activate(context: vscode.ExtensionContext): void {
 
     processWillSaveDocument(context);
 
-    processWillStartCollaboartion();
+    processWillStartCollaboartion(context);
 
     showWalkthrough(context, WebExtensionContext.telemetry);
 }
@@ -237,6 +238,29 @@ export function processWorkspaceStateChanges(context: vscode.ExtensionContext) {
                     if (entityInfo.entityId && entityInfo.entityName) {
                         context.workspaceState.update(document.uri.fsPath, entityInfo);
                         WebExtensionContext.updateVscodeWorkspaceState(document.uri.fsPath, entityInfo);
+
+                        // sending message to webworker event listener for Co-Presence feature
+                        if (isCoPresenceEnabled()) {
+                            if (WebExtensionContext.worker !== undefined) {
+                                WebExtensionContext.worker.postMessage({
+                                    afrConfig: {
+                                        swpId: WebExtensionContext.sharedWorkSpaceMap.get(
+                                            Constants.sharedWorkspaceParameters.SHAREWORKSPACE_ID
+                                        ) as string,
+                                        swptenantId: WebExtensionContext.sharedWorkSpaceMap.get(
+                                            Constants.sharedWorkspaceParameters.TENANT_ID
+                                        ) as string,
+                                        discoveryendpoint: WebExtensionContext.sharedWorkSpaceMap.get(
+                                            Constants.sharedWorkspaceParameters.DISCOVERY_ENDPOINT
+                                        ) as string,
+                                        swpAccessToken: WebExtensionContext.sharedWorkSpaceMap.get(
+                                            Constants.sharedWorkspaceParameters.ACCESS_TOKEN
+                                        ) as string,
+                                    },
+                                    entityInfo
+                                });
+                            }
+                        }
                     }
                 }
             });
@@ -268,9 +292,66 @@ export function processWillSaveDocument(context: vscode.ExtensionContext) {
     );
 }
 
-export function processWillStartCollaboartion() {
+export function processWillStartCollaboartion(context: vscode.ExtensionContext) {
+    // feature in progress, hence disabling it
     if (isCoPresenceEnabled()) {
-        // TODO: Add copresence logic
+        createWebWorkerInstance(context);
+    }
+}
+
+export function createWebWorkerInstance(
+    context: vscode.ExtensionContext
+) {
+    try {
+        const webworkerMain = vscode.Uri.joinPath(
+            context.extensionUri,
+            "dist",
+            "web",
+            "webworker.worker.js"
+        );
+
+        const workerUrl = new URL(webworkerMain.toString());
+
+        WebExtensionContext.getWorkerScript(workerUrl)
+        .then((workerScript) => {
+            const workerBlob = new Blob([workerScript], {
+                type: "application/javascript",
+            });
+
+            const urlObj = URL.createObjectURL(workerBlob);
+
+            WebExtensionContext.setWorker(new Worker(urlObj));
+
+            if (WebExtensionContext.worker !== undefined) {
+                WebExtensionContext.worker.onmessage = (event) => {
+                    const { data } = event;
+
+                    WebExtensionContext.containerId = event.data.containerId;
+
+                    if (data.type === Constants.workerEventMessages.REMOVE_CONNECTED_USER) {
+                        WebExtensionContext.removeConnectedUserInContext(
+                            data.userId
+                        );
+                    }
+                    if (data.type === Constants.workerEventMessages.UPDATE_CONNECTED_USERS) {
+                        WebExtensionContext.updateConnectedUsersInContext(
+                            data.containerId,
+                            data.userName,
+                            data.userId,
+                            data.entityId
+                        );
+                    }
+                };
+            }
+        })
+
+        WebExtensionContext.telemetry.sendInfoTelemetry(telemetryEventNames.WEB_EXTENSION_WEB_WORKER_REGISTERED);
+    } catch(error) {
+        WebExtensionContext.telemetry.sendErrorTelemetry(
+            telemetryEventNames.WEB_EXTENSION_WEB_WORKER_REGISTRATION_FAILED,
+            createWebWorkerInstance.name,
+            (error as Error)?.message,
+            error as Error);
     }
 }