From c06997ca18f2516ac32353f6d1071dc21310e1f6 Mon Sep 17 00:00:00 2001
From: Max <max@nextcloud.com>
Date: Tue, 19 Mar 2024 13:05:09 +0100
Subject: [PATCH] enh(links): close link bubble when opening preview toggle

Signed-off-by: Max <max@nextcloud.com>
---
 src/components/Editor/PreviewOptions.vue |  3 ++-
 src/extensions/LinkBubble.js             | 10 +++++++++-
 src/nodes/ParagraphView.vue              |  1 +
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/components/Editor/PreviewOptions.vue b/src/components/Editor/PreviewOptions.vue
index 7242b4f3ba0..5cbfeb3b041 100644
--- a/src/components/Editor/PreviewOptions.vue
+++ b/src/components/Editor/PreviewOptions.vue
@@ -20,7 +20,8 @@
   -
   -->
 <template>
-	<NcActions data-text-preview-options="select">
+	<NcActions data-text-preview-options="select"
+		@open="$emit('open')">
 		<template #icon>
 			<DotsVerticalIcon :size="20" />
 		</template>
diff --git a/src/extensions/LinkBubble.js b/src/extensions/LinkBubble.js
index 2c035b18de6..72c072eee60 100644
--- a/src/extensions/LinkBubble.js
+++ b/src/extensions/LinkBubble.js
@@ -1,9 +1,17 @@
 import { Extension } from '@tiptap/core'
-import { linkBubble } from '../plugins/links.js'
+import { linkBubble, hideLinkBubble } from '../plugins/links.js'
 
 const LinkBubble = Extension.create({
 	name: 'linkViewBubble',
 
+	addCommands() {
+		return {
+			hideLinkBubble: () => ({ state, dispatch }) => {
+				return hideLinkBubble(state, dispatch)
+			},
+		}
+	},
+
 	addProseMirrorPlugins() {
 		return [
 			linkBubble({
diff --git a/src/nodes/ParagraphView.vue b/src/nodes/ParagraphView.vue
index 9d77e980982..ff7ae1e7f14 100644
--- a/src/nodes/ParagraphView.vue
+++ b/src/nodes/ParagraphView.vue
@@ -24,6 +24,7 @@
 	<NodeViewWrapper class="vue-component" as="p">
 		<PreviewOptions v-if="editor.isEditable && href"
 			:value.sync="value"
+			@open="editor.commands.hideLinkBubble()"
 			@update:value="convertToPreview" />
 		<NodeViewContent class="paragraph-content" />
 	</NodeViewWrapper>