Merge pull request #4807 from nextcloud/backport/4542/stable27

[stable27] Bugfix/duplicated load of yjs
nextcloud · Sep 21, 2023 · 42b3a01 · 42b3a01
2 parents 7a506ff + 851e03e
commit 42b3a01
Show file tree

Hide file tree

Showing 15 changed files with 47 additions and 20 deletions.
diff --git a/js/editor.js b/js/editor.js
diff --git a/js/editor.js.map b/js/editor.js.map
diff --git a/js/text-editors.js b/js/text-editors.js
diff --git a/js/text-editors.js.map b/js/text-editors.js.map
diff --git a/js/text-files.js b/js/text-files.js
diff --git a/js/text-files.js.map b/js/text-files.js.map
diff --git a/js/text-public.js b/js/text-public.js
diff --git a/js/text-public.js.map b/js/text-public.js.map
diff --git a/js/text-text.js b/js/text-text.js
diff --git a/js/text-text.js.map b/js/text-text.js.map
diff --git a/js/text-viewer.js b/js/text-viewer.js
diff --git a/js/text-viewer.js.map b/js/text-viewer.js.map
diff --git a/src/components/Editor.singleton.js b/src/components/Editor.singleton.js
@@ -0,0 +1,25 @@
+/**
+ * Get instance of Editor component
+ * Using singleton approach here to avoid duplicate yjs import error
+ * @return {Promise<*>}
+ */
+export default async function getEditorInstance() {
+	if (!window._nc_text_editor_instance) {
+		if (window._nc_text_editor_importing) {
+			return await new Promise((resolve) => {
+				const intervalId = setInterval(() => {
+					if (!window._nc_text_editor_instance) {
+						return
+					}
+					resolve(window._nc_text_editor_instance)
+					clearInterval(intervalId)
+				}, 200)
+			})
+		} else {
+			window._nc_text_editor_importing = true
+		}
+		const Editor = await import(/* webpackChunkName: "editor" */'./Editor.vue')
+		window._nc_text_editor_instance = Editor.default
+	}
+	return window._nc_text_editor_instance
+}
diff --git a/src/components/ViewerComponent.vue b/src/components/ViewerComponent.vue
@@ -43,13 +43,14 @@ import PlainTextReader from './PlainTextReader.vue'
 import RichTextReader from './RichTextReader.vue'
 
 import { getSharingToken } from '../helpers/token.js'
+import getEditorInstance from './Editor.singleton.js'
 
 export default {
 	name: 'ViewerComponent',
 	components: {
 		RichTextReader,
 		PlainTextReader,
-		Editor: () => import(/* webpackChunkName: "editor" */'./Editor.vue'),
+		Editor: getEditorInstance,
 	},
 	props: {
 		filename: {

diff --git a/src/views/RichWorkspace.vue b/src/views/RichWorkspace.vue
@@ -49,6 +49,7 @@ import axios from '@nextcloud/axios'
 import { generateOcsUrl } from '@nextcloud/router'
 import { subscribe, unsubscribe } from '@nextcloud/event-bus'
 import SkeletonLoading from '../components/SkeletonLoading.vue'
+import getEditorInstance from '../components/Editor.singleton.js'
 
 const IS_PUBLIC = !!(document.getElementById('isPublic'))
 const WORKSPACE_URL = generateOcsUrl('apps/text' + (IS_PUBLIC ? '/public' : '') + '/workspace', 2)
@@ -57,7 +58,7 @@ export default {
 	name: 'RichWorkspace',
 	components: {
 		SkeletonLoading,
-		Editor: () => import(/* webpackChunkName: "editor" */'./../components/Editor.vue'),
+		Editor: getEditorInstance,
 	},
 	props: {
 		path: {