Replaced local onlyoffice-document-editor-react component

packages/common/constants/index.js

@@ -334,3 +334,5 @@ export const PortalFeaturesLimitations = Object.freeze({
   Limitless: -1,
   Unavailable: 0,
 });
+
+export const EDITOR_ID = "docspace_editor";

packages/editor/package.json

@@ -63,7 +63,7 @@
   "title": "ONLYOFFICE",
   "socketPath": "/doceditor/ws",
   "dependencies": {
-    "@onlyoffice/document-editor-react": "file:../onlyoffice-document-editor-react-0.3.0.tgz",
+    "@onlyoffice/document-editor-react": "1.0.1",
     "bufferutil": "^4.0.6",
     "compression": "^1.7.4",
     "express": "^4.18.1",

packages/editor/src/client/components/Editor.js

@@ -1,7 +1,11 @@
 import React, { useEffect } from "react";
 import { isMobile, isIOS, deviceType } from "react-device-detect";
 import combineUrl from "@docspace/common/utils/combineUrl";
-import { AppServerConfig, FolderType } from "@docspace/common/constants";
+import {
+  AppServerConfig,
+  FolderType,
+  EDITOR_ID,
+} from "@docspace/common/constants";
 import throttle from "lodash/throttle";
 import Toast from "@docspace/components/toast";
 import { toast } from "react-toastify";
@@ -56,8 +60,8 @@ let docSaved = null;
 let docTitle = null;
 let docEditor;
 let newConfig;
-let documentserverUrl = "http://192.168.31.38:8085"; //TODO: change to backend url
-let editorId = "docspace_editor";
+let documentserverUrl =
+  typeof window !== "undefined" && window?.location?.origin;
 
 function Editor({
   config,
@@ -101,6 +105,8 @@ function Editor({
   }, [mfReady, error]);
 
   useEffect(() => {
+    debugger;
+
     if (!config) return;
 
     setDocumentTitle(config?.document?.title);
@@ -347,7 +353,7 @@ function Editor({
   };
 
   const onDocumentReady = () => {
-    docEditor = window.DocEditor.instances[editorId];
+    console.log("onDocumentReady", arguments);
     documentIsReady = true;
 
     if (isSharingAccess) {
@@ -419,7 +425,9 @@ function Editor({
   };
 
   const onSDKAppReady = () => {
-    console.log("ONLYOFFICE Document Editor is ready");
+    docEditor = window.DocEditor.instances[EDITOR_ID];
+
+    console.log("ONLYOFFICE Document Editor is ready", docEditor);
     const url = window.location.href;
 
     const index = url.indexOf("#message/");
@@ -565,8 +573,8 @@ function Editor({
     <EditorWrapper isVisibleSharingDialog={isVisible}>
       {newConfig && (
         <DocumentEditor
-          id={editorId}
-          documentserverUrl={documentserverUrl}
+          id={EDITOR_ID}
+          documentServerUrl={documentserverUrl}
           config={newConfig}
           height="100%"
           width="100%"

packages/editor/src/client/helpers/withDialogs.js

@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from "react";
 import { getPresignedUri } from "@docspace/common/api/files";
+import { EDITOR_ID } from "@docspace/common/constants";
 import { useTranslation } from "react-i18next";
 import SharingDialog from "../components/SharingDialog";
 import SelectFileDialog from "../components/SelectFileDialog";
@@ -42,7 +43,11 @@ const withDialogs = (WrappedComponent) => {
       });
       socketHelper.on("restore-backup", () => {
         const message = t("Common:PreparationPortalTitle");
-        window.docEditor.showMessage(message);
+        const docEditor =
+          typeof window !== "undefined" &&
+          window.DocEditor?.instances[EDITOR_ID];
+
+        docEditor?.showMessage(message);
       });
     };
 
@@ -54,10 +59,10 @@ const withDialogs = (WrappedComponent) => {
       setIsVisible(false);
     };
 
-    const loadUsersRightsList = () => {
+    const loadUsersRightsList = (docEditor) => {
       window.SharingDialog.convertSharingUsers(sharingSettings).then(
         (sharingSettings) => {
-          window.docEditor.setSharingSettings({
+          docEditor.setSharingSettings({
             sharingSettings,
           });
         }
@@ -87,7 +92,10 @@ const withDialogs = (WrappedComponent) => {
     const insertImage = (link) => {
       const token = link.token;
 
-      window.docEditor.insertImage({
+      const docEditor =
+        typeof window !== "undefined" && window.DocEditor?.instances[EDITOR_ID];
+
+      docEditor?.insertImage({
         ...typeInsertImageAction,
         fileType: link.filetype,
         ...(token && { token }),
@@ -98,7 +106,10 @@ const withDialogs = (WrappedComponent) => {
     const mailMerge = (link) => {
       const token = link.token;
 
-      window.docEditor.setMailMergeRecipients({
+      const docEditor =
+        typeof window !== "undefined" && window.DocEditor?.instances[EDITOR_ID];
+
+      docEditor?.setMailMergeRecipients({
         fileType: link.filetype,
         ...(token && { token }),
         url: link.url,
@@ -108,7 +119,10 @@ const withDialogs = (WrappedComponent) => {
     const compareFiles = (link) => {
       const token = link.token;
 
-      window.docEditor.setRevisedFile({
+      const docEditor =
+        typeof window !== "undefined" && window.DocEditor?.instances[EDITOR_ID];
+
+      docEditor?.setRevisedFile({
         fileType: link.filetype,
         ...(token && { token }),
         url: link.url,
@@ -191,8 +205,13 @@ const withDialogs = (WrappedComponent) => {
       );
 
       if (savingInfo) {
+        const docEditor =
+          typeof window !== "undefined" &&
+          window.DocEditor?.instances[EDITOR_ID];
+
         const convertedInfo = savingInfo.split(": ").pop();
-        window.docEditor.showMessage(convertedInfo);
+
+        docEditor?.showMessage(convertedInfo);
       }
     };