Merge pull request #2677 from nextcloud/fix/stop-using-propfind-for-w…

…orkspace

fix: use own workspace endpoint instead of PROPFIND properties

js/editor-rich.js.LICENSE.txt

@@ -1,23 +1 @@
-/*
- * @copyright Copyright (c) 2019 Julius Härtl <[email protected]>
- *
- * @author Julius Härtl <[email protected]>
- *
- * @license GNU AGPL version 3 or any later version
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <http://www.gnu.org/licenses/>.
- *
- */
-
 /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */

js/text-public.js.LICENSE.txt

@@ -33,6 +33,13 @@ object-assign
  * @license  MIT
  */
 
+/*!
+ * The buffer module from node.js, for the browser.
+ *
+ * @author   Feross Aboukhadijeh <https://feross.org>
+ * @license  MIT
+ */
+
 /*!
  * Vue.js v2.6.14
  * (c) 2014-2021 Evan You
@@ -45,4 +52,6 @@ object-assign
  * @license MIT
  */
 
+/*! ieee754. BSD-3-Clause License. Feross Aboukhadijeh <https://feross.org/opensource> */
+
 /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */

src/helpers/files.js

@@ -136,7 +136,6 @@ const registerFileActionFallback = () => {
 const FilesWorkspacePlugin = {
 
 	el: null,
-	vm: null,
 
 	attach(fileList) {
 		if (fileList.id !== 'files' && fileList.id !== 'files.public') {
@@ -150,51 +149,6 @@ const FilesWorkspacePlugin = {
 			render: this.render.bind(this),
 			priority: 10,
 		})
-
-		const PROPERTY_WORKSPACE_FILE = `{${OC.Files.Client.NS_NEXTCLOUD}}rich-workspace-file`
-
-		const oldGetWebdavProperties = fileList._getWebdavProperties
-		fileList._getWebdavProperties = function() {
-			return [
-				...oldGetWebdavProperties.apply(this, arguments),
-				PROPERTY_WORKSPACE_FILE,
-			]
-		}
-
-		let readmeId = null
-
-		fileList.filesClient.addFileInfoParser((response, data) => {
-			if (data.mimetype === 'httpd/unix-directory') {
-				const props = response.propStat[0].properties
-				const dir = data.path + (data.path.endsWith('/') ? '' : '/') + data.name
-				if (dir === fileList.getCurrentDirectory()) {
-					readmeId = props[PROPERTY_WORKSPACE_FILE]
-					this.vm.folder = {
-						permissions: data.permissions,
-					}
-					this.vm.loaded = true
-					// in case no file is found we are done
-					this.vm.ready = true
-				}
-			}
-			if (readmeId && data.id === readmeId) {
-				if (data.mimetype !== 'text/markdown') {
-					console.warn('Expected workspace file to be markdown:', data)
-				}
-				this.open(data)
-				return
-			}
-			/*
-			 * Handle the creation of 'Readme.md'.
-			 * The PROPFIND after the creation does not include the parent dir.
-			 */
-			if (data.name === 'Readme.md'
-				&& data.mimetype === 'text/markdown'
-				&& data.path === fileList.getCurrentDirectory()) {
-				this.open(data)
-			}
-		})
-
 	},
 
 	render(fileList) {
@@ -209,37 +163,21 @@ const FilesWorkspacePlugin = {
 			Vue.prototype.n = window.n
 			Vue.prototype.OCA = window.OCA
 			const View = Vue.extend(RichWorkspace)
-			this.vm = new View({
+			const vm = new View({
 				propsData: {
-					file: null,
-					folder: null,
+					path: fileList.getCurrentDirectory(),
 				},
 				store,
 			}).$mount(this.el)
 
 			fileList.$el.on('urlChanged', data => {
-				this.vm.file = null
-				this.vm.folder = null
+				vm.path = data.dir.toString()
 			})
 			fileList.$el.on('changeDirectory', data => {
-				this.vm.file = null
-				this.vm.folder = null
+				vm.path = data.dir.toString()
 			})
 		})
 	},
-
-	open(data) {
-		const previous = this.vm.file
-		const id = parseInt(data.id)
-		this.vm.file = {
-			...data,
-			id,
-		}
-		if (previous?.id !== id) {
-			// Editor loads new file. Wait for it to be ready.
-			this.vm.ready = false
-		}
-	},
 }
 
 export {

src/views/RichWorkspace.vue

@@ -32,41 +32,44 @@
 			v-show="ready"
 			:key="file.path"
 			:file-id="file.id"
-			:relative-path="filepath"
+			:relative-path="file.path"
 			:share-token="shareToken"
 			:mime="file.mimetype"
 			:autofocus="autofocus"
 			active
 			autohide
 			rich-workspace
-			@ready="ready=true; loaded=true"
+			@ready="ready=true"
 			@focus="focus=true"
 			@blur="unfocus"
 			@error="reset" />
 	</div>
 </template>
 
 <script>
+import axios from '@nextcloud/axios'
+import { generateOcsUrl } from '@nextcloud/router'
 import { subscribe } from '@nextcloud/event-bus'
 
+const IS_PUBLIC = !!(document.getElementById('isPublic'))
+const WORKSPACE_URL = generateOcsUrl('apps/text' + (IS_PUBLIC ? '/public' : '') + '/workspace', 2)
+
 export default {
 	name: 'RichWorkspace',
 	components: {
 		EditorWrapper: () => import(/* webpackChunkName: "editor" */'./../components/EditorWrapper.vue'),
 	},
 	props: {
-		file: {
-			type: Object,
-			default: null,
-		},
-		folder: {
-			type: Object,
-			default: null,
+		path: {
+			type: String,
+			required: true,
 		},
 	},
 	data() {
 		return {
 			focus: false,
+			folder: null,
+			file: null,
 			loaded: false,
 			ready: false,
 			autofocus: false,
@@ -84,26 +87,24 @@ export default {
 		showEmptyWorkspace() {
 			return (!this.file || (this.autofocus && !this.ready)) && this.canCreate
 		},
-		filepath() {
-			const { path, name } = this.file || {}
-			if (!path) {
-				return undefined
-			}
-
-			return path + (path.endsWith('/') ? '' : '/') + name
-		},
 	},
 	watch: {
+		path() {
+			this.getFileInfo()
+		},
 		focus(newValue) {
 			if (!newValue) {
-				// TODO: change
 				document.querySelector('#editor').scrollTo(0, 0)
 			}
 		},
 	},
 	async mounted() {
+		if (this.enabled) {
+			this.getFileInfo()
+		}
 		subscribe('Text::showRichWorkspace', () => {
 			this.enabled = true
+			this.getFileInfo()
 		})
 		subscribe('Text::hideRichWorkspace', () => {
 			this.enabled = false
@@ -114,20 +115,54 @@ export default {
 			// setTimeout(() => this.focus = false, 2000)
 		},
 		reset() {
+			this.file = null
 			this.focus = false
 			this.$nextTick(() => {
 				this.creating = false
+				this.getFileInfo()
+			})
+		},
+		getFileInfo() {
+			this.loaded = false
+			this.autofocus = false
+			this.ready = false
+			const params = { path: this.path }
+			if (IS_PUBLIC) {
+				params.shareToken = this.shareToken
+			}
+			return axios.get(WORKSPACE_URL, { params }).then((response) => {
+				const data = response.data.ocs.data
+				this.folder = data.folder || null
+				this.file = data.file
+				this.editing = true
+				this.loaded = true
+				return true
+			}).catch((error) => {
+				if (error.response.data.ocs && error.response.data.ocs.data.folder) {
+					this.folder = error.response.data.ocs.data.folder
+				} else {
+					this.folder = null
+				}
+				this.file = null
+				this.loaded = true
+				this.ready = true
+				this.creating = false
+				return false
 			})
 		},
 		createNew() {
 			if (this.creating) {
 				return
 			}
 			this.creating = true
-			this.autofocus = true
-			if (!this.file) {
-				window.FileList.createFile('Readme.md', { scrollTo: false, animate: false })
-			}
+			this.getFileInfo().then((workspaceFileExists) => {
+				this.autofocus = true
+				if (!workspaceFileExists) {
+					window.FileList.createFile('Readme.md', { scrollTo: false, animate: false }).then((status, data) => {
+						this.getFileInfo()
+					})
+				}
+			})
 		},
 	},
 }