fix(editor): rollback to the old vue2 provide hack

Calling `provide` in the setup function is still buggy in vue2.

This led to the editor not being rendered in deck.

Signed-off-by: Max <[email protected]>

Author: max-nextcloud

renovate.json

@@ -64,7 +64,14 @@
 		},
 		{
 			"matchUpdateTypes": ["major", "minor"],
-			"matchBaseBranches": ["stable31", "stable30", "stable29", "stable28", "stable27", "stable26"],
+			"matchBaseBranches": [
+				"stable31",
+				"stable30",
+				"stable29",
+				"stable28",
+				"stable27",
+				"stable26"
+			],
 			"enabled": false
 		},
 		{

src/components/BaseReader.vue

@@ -25,7 +25,7 @@
 import { Editor } from '@tiptap/core'
 import { EditorContent } from '@tiptap/vue-2'
 import { inject, watch } from 'vue'
-import { provideEditor } from '../composables/useEditor.ts'
+import { editorKey } from '../composables/useEditor.ts'
 import { useEditorMethods } from '../composables/useEditorMethods.ts'
 import EditorOutline from './Editor/EditorOutline.vue'
 import {
@@ -40,6 +40,16 @@ export default {
 		EditorOutline,
 	},
 
+	provide() {
+		const val = {}
+		Object.defineProperties(val, {
+			[editorKey]: {
+				get: () => this.editor,
+			},
+		})
+		return val
+	},
+
 	mixins: [useOutlineStateMixin, useOutlineActions],
 
 	props: {
@@ -57,7 +67,6 @@ export default {
 			content: renderHtml(props.content),
 			extensions: extensions(),
 		})
-		provideEditor(editor)
 		watch(
 			() => props.content,
 			(content) => {

src/components/Editor.vue

@@ -87,8 +87,8 @@ import { defineComponent, ref, shallowRef, watch } from 'vue'
 import { Doc } from 'yjs'
 import Autofocus from '../extensions/Autofocus.js'
 
-import { provideEditor } from '../composables/useEditor.ts'
-import { provideEditorFlags } from '../composables/useEditorFlags.ts'
+import { editorKey } from '../composables/useEditor.ts'
+import { editorFlagsKey, getEditorFlags } from '../composables/useEditorFlags.ts'
 import { ATTACHMENT_RESOLVER, FILE, IS_MOBILE } from './Editor.provider.ts'
 import ReadonlyBar from './Menu/ReadonlyBar.vue'
 
@@ -164,6 +164,16 @@ export default defineComponent({
 			[IS_MOBILE]: {
 				get: () => this.isMobile,
 			},
+			[editorKey]: {
+				get: () => this.editor,
+			},
+			[editorFlagsKey]: {
+				get: () => ({
+					isPublic: this.isPublic,
+					isRichEditor: this.isRichEditor,
+					isRichWorkspace: this.isRichWorkspace,
+				}),
+			},
 		})
 
 		return val
@@ -229,7 +239,7 @@ export default defineComponent({
 		const awareness = new Awareness(ydoc)
 		const hasConnectionIssue = ref(false)
 		const { delayed: requireReconnect } = useDelayedFlag(hasConnectionIssue)
-		const { isPublic, isRichEditor, isRichWorkspace } = provideEditorFlags(props)
+		const { isPublic, isRichEditor, isRichWorkspace } = getEditorFlags(props)
 		const { language, lowlightLoaded } = useSyntaxHighlighting(
 			isRichEditor,
 			props,
@@ -249,7 +259,6 @@ export default defineComponent({
 					isEmbedded: props.isEmbedded,
 				})
 			: createPlainEditor({ language, extensions })
-		provideEditor(editor)
 
 		const { applyEditorWidth } = provideEditorWidth()
 		applyEditorWidth()

src/components/Editor/MarkdownContentEditor.vue

@@ -28,8 +28,8 @@ import Wrapper from './Wrapper.vue'
 /* eslint-disable import/no-named-as-default */
 import { getCurrentUser } from '@nextcloud/auth'
 import History from '@tiptap/extension-history'
-import { provide, watch } from 'vue'
-import { provideEditor } from '../../composables/useEditor.ts'
+import { watch } from 'vue'
+import { editorKey } from '../../composables/useEditor.ts'
 import { editorFlagsKey } from '../../composables/useEditorFlags.ts'
 import { useEditorMethods } from '../../composables/useEditorMethods.ts'
 import { FocusTrap, RichText } from '../../extensions/index.js'
@@ -50,6 +50,14 @@ export default {
 			[ATTACHMENT_RESOLVER]: {
 				get: () => this.$attachmentResolver ?? null,
 			},
+			[editorKey]: {
+				get: () => this.editor,
+			},
+			[editorFlagsKey]: {
+				isPublic: false,
+				isRichEditor: true,
+				isRichWorkspace: false,
+			},
 		})
 
 		return val
@@ -115,12 +123,6 @@ export default {
 			},
 		)
 
-		provideEditor(editor)
-		provide(editorFlagsKey, {
-			isPublic: false,
-			isRichEditor: true,
-			isRichWorkspace: false,
-		})
 		return { editor }
 	},
 

src/composables/useEditor.ts

@@ -4,12 +4,9 @@
  */
 
 import { Editor } from '@tiptap/core'
-import { inject, type InjectionKey, provide } from 'vue'
+import { inject, type InjectionKey } from 'vue'
 
 export const editorKey = Symbol('tiptap:editor') as InjectionKey<Editor>
-export const provideEditor = (editor: Editor) => {
-	provide(editorKey, editor)
-}
 export const useEditor = () => {
 	const editor = inject(editorKey)
 	if (!editor) {

src/composables/useEditorFlags.ts

@@ -18,7 +18,7 @@ interface Props {
 	mime: string
 }
 export const editorFlagsKey = Symbol('editor:flags') as InjectionKey<EditorFlags>
-export const provideEditorFlags = (props: Props) => {
+export const getEditorFlags = (props: Props) => {
 	const isPublic = props.isDirectEditing || isPublicShare()
 	const isRichWorkspace = props.richWorkspace ?? false
 	const isRichEditor =