fix: Move link picker and metadata extraction to viewer to act in the…

… user session aware iframe Signed-off-by: Julius Härtl <[email protected]>
nextcloud · Jul 13, 2023 · fa9ec92 · fa9ec92
1 parent 71e8d24
commit fa9ec92
Show file tree

Hide file tree

Showing 3 changed files with 68 additions and 60 deletions.
diff --git a/src/document.js b/src/document.js
@@ -2,8 +2,6 @@ import { emit } from '@nextcloud/event-bus'
 import { generateOcsUrl, getRootUrl, imagePath } from '@nextcloud/router'
 import { getRequestToken } from '@nextcloud/auth'
 import { loadState } from '@nextcloud/initial-state'
-import { showError } from '@nextcloud/dialogs'
-import { getLinkWithPicker } from '@nextcloud/vue/dist/Components/NcRichText.js'
 import Config from './services/config.tsx'
 import { setGuestName, shouldAskForGuestName } from './helpers/guestName.js'
 import { getUIDefaults, generateCSSVarTokens, getCollaboraTheme } from './helpers/coolParameters.js'
@@ -368,6 +366,9 @@ const documentsMain = {
 					'Action_FollowUser',
 					'Host_VersionRestore',
 					'Action_RemoveView',
+					'Action_InsertLink',
+					'Action_Paste',
+					'Action_GetLinkPreview_Resp',
 				]
 				PostMessages.registerPostMessageHandler(({ parsed, data }) => {
 					console.debug('[document] Received post message ', parsed)
@@ -497,12 +498,6 @@ const documentsMain = {
 					case 'UI_Mention':
 						documentsMain.sendUserList(parsed.args.text)
 						break
-					case 'UI_PickLink':
-						documentsMain.openLinkPicker()
-						break
-					case 'Action_GetLinkPreview':
-						documentsMain.resolveLink(args.url)
-						break
 					default:
 						console.debug('[document] Unhandled post message', parsed)
 					}
@@ -659,58 +654,6 @@ const documentsMain = {
 		PostMessages.sendWOPIPostMessage('loolframe', 'Action_Mention', { list })
 	},
 
-	async openLinkPicker() {
-		try {
-			const link = await getLinkWithPicker(null, true)
-			try {
-				const url = new URL(link)
-				if (url.protocol === 'http:' || url.protocol === 'https:') {
-					PostMessages.sendWOPIPostMessage('loolframe', 'Action_InsertLink', { url: link })
-					return
-				}
-			} catch (e) {
-				console.debug('error when parsing the link picker result')
-			}
-			PostMessages.sendWOPIPostMessage('loolframe', 'Action_Paste', { Mimetype: 'text/plain', Data: link })
-		} catch (e) {
-			showError(t('richdocuments', 'Failed to get a link with the picker'))
-			console.error('Link picker promise rejected :', e)
-		}
-	},
-
-	async resolveLink(url) {
-		try {
-			const result = await axios.get(generateOcsUrl('references/resolve', 2), {
-				params: {
-					reference: url,
-				},
-			})
-			const resolvedLink = result.data.ocs.data.references[url]
-			const title = resolvedLink?.openGraphObject?.name
-			const thumbnailUrl = resolvedLink?.openGraphObject?.thumb
-			if (thumbnailUrl) {
-				try {
-					const imageResponse = await axios.get(thumbnailUrl, { responseType: 'blob' })
-					if (imageResponse?.status === 200 && imageResponse?.data) {
-						const reader = new FileReader()
-						reader.addEventListener('loadend', (e) => {
-							const b64Image = e.target.result
-							PostMessages.sendWOPIPostMessage('loolframe', 'Action_GetLinkPreview_Resp', { url, title, image: b64Image })
-						})
-						reader.readAsDataURL(imageResponse.data)
-					}
-				} catch (e) {
-					console.error('Error loading the reference image', e)
-				}
-			} else {
-				PostMessages.sendWOPIPostMessage('loolframe', 'Action_GetLinkPreview_Resp', { url, title, image: null })
-			}
-		} catch (e) {
-			showError(t('richdocuments', 'Failed to get the link preview'))
-			console.error('Error resolving a reference', e)
-		}
-	},
-
 	onStartup() {
 		// Does anything indicate that we need to autostart a session?
 		const fileId = (getSearchParam('fileId') || '').replace(/^\W*/, '')

diff --git a/src/view/DocumentTargetPicker.vue b/src/view/DocumentTargetPicker.vue
@@ -201,4 +201,9 @@ h3 {
 	box-shadow: none !important;
 	flex-shrink: 0;
 }
+
+img {
+	max-width: 100px;
+	margin-left: 20px;
+}
 </style>
diff --git a/src/view/Office.vue b/src/view/Office.vue
@@ -85,6 +85,10 @@ import PostMessageService from '../services/postMessage.tsx'
 import FilesAppIntegration from './FilesAppIntegration.js'
 import { LOADING_ERROR, checkCollaboraConfiguration, checkProxyStatus } from '../services/collabora.js'
 import { enableScrollLock, disableScrollLock } from '../helpers/safariFixer.js'
+import { getLinkWithPicker } from '@nextcloud/vue/dist/Components/NcRichText.js'
+import { showError } from '@nextcloud/dialogs'
+import axios from '@nextcloud/axios'
+import { generateOcsUrl } from '@nextcloud/router'
 
 const FRAME_DOCUMENT = 'FRAME_DOCUMENT'
 const PostMessages = new PostMessageService({
@@ -221,6 +225,56 @@ export default {
 		async share() {
 			FilesAppIntegration.share()
 		},
+		async pickLink() {
+			try {
+				const link = await getLinkWithPicker(null, true)
+				try {
+					const url = new URL(link)
+					if (url.protocol === 'http:' || url.protocol === 'https:') {
+						PostMessages.sendWOPIPostMessage(FRAME_DOCUMENT, 'Action_InsertLink', { url: link })
+						return
+					}
+				} catch (e) {
+					console.debug('error when parsing the link picker result')
+				}
+				PostMessages.sendWOPIPostMessage(FRAME_DOCUMENT, 'Action_Paste', { Mimetype: 'text/plain', Data: link })
+			} catch (e) {
+				showError(t('richdocuments', 'Failed to get a link with the picker'))
+				console.error('Link picker promise rejected :', e)
+			}
+		},
+		async resolveLink(url) {
+			try {
+				const result = await axios.get(generateOcsUrl('references/resolve', 2), {
+					params: {
+						reference: url,
+					},
+				})
+				const resolvedLink = result.data.ocs.data.references[url]
+				const title = resolvedLink?.openGraphObject?.name
+				const thumbnailUrl = resolvedLink?.openGraphObject?.thumb
+				if (thumbnailUrl) {
+					try {
+						const imageResponse = await axios.get(thumbnailUrl, { responseType: 'blob' })
+						if (imageResponse?.status === 200 && imageResponse?.data) {
+							const reader = new FileReader()
+							reader.addEventListener('loadend', (e) => {
+								const b64Image = e.target.result
+								PostMessages.sendWOPIPostMessage(FRAME_DOCUMENT, 'Action_GetLinkPreview_Resp', { url, title, image: b64Image })
+							})
+							reader.readAsDataURL(imageResponse.data)
+						}
+					} catch (e) {
+						console.error('Error loading the reference image', e)
+					}
+				} else {
+					PostMessages.sendWOPIPostMessage(FRAME_DOCUMENT, 'Action_GetLinkPreview_Resp', { url, title, image: null })
+				}
+			} catch (e) {
+				showError(t('richdocuments', 'Failed to get the link preview'))
+				console.error('Error resolving a reference', e)
+			}
+		},
 		close() {
 			FilesAppIntegration.close()
 			disableScrollLock()
@@ -306,6 +360,12 @@ export default {
 			case 'UI_ZoteroKeyMissing':
 				this.showZotero = true
 				break
+			case 'UI_PickLink':
+				this.pickLink()
+				break
+			case 'Action_GetLinkPreview':
+				this.resolveLink(args.url)
+				break
 			}
 		},
 	},