diff --git a/package-lock.json b/package-lock.json
index cb05192b5..b460b3d87 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -22,7 +22,7 @@
         "markdown-it-bidi": "^0.1.0",
         "markdown-it-task-checkbox": "^1.0.6",
         "vue": "^2.7.16",
-        "vue-fragment": "^1.6.0",
+        "vue-frag": "^1.4.3",
         "vue-material-design-icons": "^5.3.0",
         "vue-observe-visibility": "^1.0.0",
         "vue-router": "^3.5.3",
@@ -14346,6 +14346,7 @@
       "version": "1.4.3",
       "resolved": "https://registry.npmjs.org/vue-frag/-/vue-frag-1.4.3.tgz",
       "integrity": "sha512-pQZj03f/j9LRhzz9vKaXTCXUHVYHuAXicshFv76VFqwz4MG3bcb+sPZMAbd0wmw7THjkrTPuoM0EG9TbG8CgMQ==",
+      "license": "MIT",
       "funding": {
         "url": "https://github.com/privatenumber/vue-frag?sponsor=1"
       },
@@ -14353,14 +14354,6 @@
         "vue": "^2.6.0"
       }
     },
-    "node_modules/vue-fragment": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/vue-fragment/-/vue-fragment-1.6.0.tgz",
-      "integrity": "sha512-a5T8ZZZK/EQzgVShEl374HbobUJ0a7v12BzOzS6Z/wd/5EE/5SffcyHC+7bf9hP3L7Yc0hhY/GhMdwFQ25O/8A==",
-      "peerDependencies": {
-        "vue": "^2.5.16"
-      }
-    },
     "node_modules/vue-hot-reload-api": {
       "version": "2.3.4",
       "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz",
diff --git a/package.json b/package.json
index de2adfdc6..66d34126e 100644
--- a/package.json
+++ b/package.json
@@ -26,7 +26,7 @@
     "markdown-it-bidi": "^0.1.0",
     "markdown-it-task-checkbox": "^1.0.6",
     "vue": "^2.7.16",
-    "vue-fragment": "^1.6.0",
+    "vue-frag": "^1.4.3",
     "vue-material-design-icons": "^5.3.0",
     "vue-observe-visibility": "^1.0.0",
     "vue-router": "^3.5.3",
diff --git a/src/components/CategoriesList.vue b/src/components/CategoriesList.vue
index fc58a3d52..b308ef77a 100644
--- a/src/components/CategoriesList.vue
+++ b/src/components/CategoriesList.vue
@@ -43,7 +43,7 @@ import {
 	NcAppNavigationCaption,
 	NcCounterBubble,
 } from '@nextcloud/vue'
-import { Fragment } from 'vue-fragment'
+import { Fragment } from 'vue-frag'
 
 import FolderIcon from 'vue-material-design-icons/Folder.vue'
 import FolderOutlineIcon from 'vue-material-design-icons/FolderOutline.vue'
diff --git a/src/components/HelpMobile.vue b/src/components/HelpMobile.vue
index e59d04e13..ff906bf2c 100644
--- a/src/components/HelpMobile.vue
+++ b/src/components/HelpMobile.vue
@@ -38,7 +38,7 @@
 
 import { generateFilePath } from '@nextcloud/router'
 
-import { Fragment } from 'vue-fragment'
+import { Fragment } from 'vue-frag'
 
 export default {
 	components: {
diff --git a/src/components/NoteItem.vue b/src/components/NoteItem.vue
index 362a5040a..27302c44d 100644
--- a/src/components/NoteItem.vue
+++ b/src/components/NoteItem.vue
@@ -82,7 +82,7 @@
 
 			<NcActionSeparator />
 
-			<NcActionButton v-if="!note.readonly" :icon="actionDeleteIcon" @click="onDeleteNote">
+			<NcActionButton v-if="!note.readonly" :icon="actionDeleteIcon" @click="onDeleteNote" :close-after-click="true">
 				{{ t('notes', 'Delete note') }}
 			</NcActionButton>
 		</template>