Refactor: add openViewer mixin

Signed-off-by: Grigorii Shartsev <grigorii.shartsev@nextcloud.com>

3 files changed, 87 insertions, 77 deletions

diff --git a/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue b/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue
index 36cc2637d..11f9cdea0 100644
--- a/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue
+++ b/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue
@@ -84,7 +84,7 @@ import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip.js'
 
 import AudioPlayer from './AudioPlayer.vue'
 
-import isInCall from '../../../../../mixins/isInCall.js'
+import { openViewer } from '../../../../../mixins/openViewer.js'
 
 const PREVIEW_TYPE = {
 	TEMPORARY: 0,
@@ -107,7 +107,7 @@ export default {
 		tooltip: Tooltip,
 	},
 
-	mixins: [isInCall],
+	mixins: [openViewer],
 
 	props: {
 		/**
@@ -466,12 +466,6 @@ export default {
 			event.stopPropagation()
 			event.preventDefault()
 
-			// The Viewer expects a file to be set in the sidebar if the sidebar
-			// is open.
-			if (this.$store.getters.getSidebarStatus) {
-				OCA.Files.Sidebar.state.file = this.internalAbsolutePath
-			}
-
 			let permissions = ''
 			if (this.permissions) {
 				if (this.permissions & OC.PERMISSION_CREATE) {
@@ -491,41 +485,17 @@ export default {
 				}
 			}
 
-			if (this.isInCall) {
-				this.$store.dispatch('setCallViewMode', { isViewerOverlay: true })
-			}
-
-			OCA.Viewer.open({
-				// Viewer expects an internal absolute path starting with "/".
-				path: this.internalAbsolutePath,
-				list: [
-					{
-						fileid: parseInt(this.id, 10),
-						filename: this.internalAbsolutePath,
-						basename: this.name,
-						mime: this.mimetype,
-						hasPreview: this.previewAvailable === 'yes',
-						etag: this.etag,
-						permissions,
-					},
-				],
-				onClose: () => {
-					this.$store.dispatch('setCallViewMode', { isViewerOverlay: false })
+			this.openViewer(this.internalAbsolutePath, [
+				{
+					fileid: parseInt(this.id, 10),
+					filename: this.internalAbsolutePath,
+					basename: this.name,
+					mime: this.mimetype,
+					hasPreview: this.previewAvailable === 'yes',
+					etag: this.etag,
+					permissions,
 				},
-			})
-
-			// FIXME Remove this hack once it is possible to set the parent
-			// element of the viewer.
-			// By default the viewer is a sibling of the fullscreen element, so
-			// it is not visible when in fullscreen mode. It is not possible to
-			// specify the parent nor to know when the viewer was actually
-			// opened, so for the time being it is reparented if needed shortly
-			// after calling it.
-			setTimeout(() => {
-				if (this.$store.getters.isFullscreen()) {
-					document.getElementById('content-vue').appendChild(document.getElementById('viewer'))
-				}
-			}, 1000)
+			])
 		},
 	},
 }
diff --git a/src/components/NewMessageForm/NewMessageForm.vue b/src/components/NewMessageForm/NewMessageForm.vue
index 12b40f6bb..0041c0384 100644
--- a/src/components/NewMessageForm/NewMessageForm.vue
+++ b/src/components/NewMessageForm/NewMessageForm.vue
@@ -248,7 +248,7 @@ import SimplePollsEditor from './SimplePollsEditor/SimplePollsEditor.vue'
 import TemplatePreview from './TemplatePreview.vue'
 
 import { CONVERSATION, PARTICIPANT } from '../../constants.js'
-import isInCall from '../../mixins/isInCall.js'
+import { openViewer } from '../../mixins/openViewer.js'
 import { EventBus } from '../../services/EventBus.js'
 import { shareFile, createTextFile } from '../../services/filesSharingServices.js'
 import { searchPossibleMentions } from '../../services/mentionsService.js'
@@ -293,7 +293,7 @@ export default {
 		NcTextField,
 	},
 
-	mixins: [isInCall],
+	mixins: [openViewer],
 
 	props: {
 		/**
@@ -810,39 +810,7 @@ export default {
 
 			await shareFile(filePath, this.token, '', '')
 
-			// The Viewer expects a file to be set in the sidebar if the sidebar
-			// is open.
-			if (this.$store.getters.getSidebarStatus) {
-				OCA.Files.Sidebar.state.file = filePath
-			}
-
-			if (this.isInCall) {
-				this.$store.dispatch('setCallViewMode', { isViewerOverlay: true })
-			}
-
-			OCA.Viewer.open({
-				// Viewer expects an internal absolute path starting with "/".
-				path: filePath,
-				list: [
-					fileData,
-				],
-				onClose: () => {
-					this.$store.dispatch('setCallViewMode', { isViewerOverlay: false })
-				},
-			})
-
-			// FIXME Remove this hack once it is possible to set the parent
-			// element of the viewer.
-			// By default the viewer is a sibling of the fullscreen element, so
-			// it is not visible when in fullscreen mode. It is not possible to
-			// specify the parent nor to know when the viewer was actually
-			// opened, so for the time being it is reparented if needed shortly
-			// after calling it.
-			setTimeout(() => {
-				if (this.$store.getters.isFullscreen()) {
-					document.getElementById('content-vue').appendChild(document.getElementById('viewer'))
-				}
-			}, 1000)
+			this.openViewer(filePath, [fileData])
 
 			this.dismissTextFileCreation()
 		},
diff --git a/src/mixins/openViewer.js b/src/mixins/openViewer.js
new file mode 100644
index 000000000..42bc24b57
--- /dev/null
+++ b/src/mixins/openViewer.js
@@ -0,0 +1,72 @@
+/*
+ * @copyright Copyright (c) 2023 Grigorii Shartsev <me@shgk.me>
+ *
+ * @author Grigorii Shartsev <me@shgk.me>
+ *
+ * @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/>.
+ */
+
+import isInCall from './isInCall.js'
+
+export const openViewer = {
+	mixins: [isInCall],
+
+	methods: {
+		/**
+		 *
+		 * @param {string} path - The path to the file to be open
+		 * @param {object} list - The list of the files to be opened
+		 */
+		openViewer(path, list) {
+			if (!OCA.Viewer) {
+				return false
+			}
+
+			// The Viewer expects a file to be set in the sidebar if the sidebar
+			// is open.
+			if (this.$store.getters.getSidebarStatus) {
+				OCA.Files.Sidebar.state.file = path
+			}
+
+			if (this.isInCall) {
+				this.$store.dispatch('setCallViewMode', { isViewerOverlay: true })
+			}
+
+			OCA.Viewer.open({
+				// Viewer expects an internal absolute path starting with "/".
+				path,
+				list,
+				onClose: () => {
+					this.$store.dispatch('setCallViewMode', { isViewerOverlay: false })
+				},
+			})
+
+			// FIXME Remove this hack once it is possible to set the parent
+			// element of the viewer.
+			// By default the viewer is a sibling of the fullscreen element, so
+			// it is not visible when in fullscreen mode. It is not possible to
+			// specify the parent nor to know when the viewer was actually
+			// opened, so for the time being it is reparented if needed shortly
+			// after calling it.
+			// @see https://github.com/nextcloud/viewer/issues/995
+			setTimeout(() => {
+				if (this.$store.getters.isFullscreen()) {
+					document.getElementById('content-vue').appendChild(document.getElementById('viewer'))
+				}
+			}, 1000)
+		},
+	},
+}