diff --git a/app/src/modules/collections/components/navigation-bookmark.vue b/app/src/modules/collections/components/navigation-bookmark.vue
index 934157d544..ed2794b55a 100644
--- a/app/src/modules/collections/components/navigation-bookmark.vue
+++ b/app/src/modules/collections/components/navigation-bookmark.vue
@@ -5,6 +5,7 @@
class="bookmark"
clickable
@contextmenu.prevent.stop="activateContextMenu"
+ @focusout="deactivateContextMenu"
>
@@ -104,6 +105,7 @@ export default defineComponent({
deleteSave,
deleteSaving,
activateContextMenu,
+ deactivateContextMenu,
};
function useRenameBookmark() {
@@ -165,6 +167,10 @@ export default defineComponent({
function activateContextMenu(event: PointerEvent) {
contextMenu.value.activate(event);
}
+
+ function deactivateContextMenu() {
+ contextMenu.value.deactivate();
+ }
},
});
diff --git a/app/src/modules/collections/components/navigation-item.vue b/app/src/modules/collections/components/navigation-item.vue
index 5a21c57d65..68f7486a51 100644
--- a/app/src/modules/collections/components/navigation-item.vue
+++ b/app/src/modules/collections/components/navigation-item.vue
@@ -6,7 +6,8 @@
:value="collection.collection"
query
:arrow-placement="collection.meta?.collapse === 'locked' ? false : 'after'"
- @contextmenu="activateContextMenu"
+ @contextmenu.prevent.stop="activateContextMenu"
+ @focusout="deactivateContextMenu"
>
-
+
@@ -52,6 +54,14 @@
+
+
+
+
+
+
+
+
@@ -60,7 +70,7 @@
import { defineComponent, PropType, computed, ref } from 'vue';
import { Collection } from '@/types';
import { Preset } from '@directus/shared/types';
-import { useCollectionsStore, usePresetsStore } from '@/stores';
+import { useUserStore, useCollectionsStore, usePresetsStore } from '@/stores';
import NavigationItemContent from './navigation-item-content.vue';
import NavigationBookmark from './navigation-bookmark.vue';
import { useI18n } from 'vue-i18n';
@@ -86,6 +96,7 @@ export default defineComponent({
setup(props) {
const { t } = useI18n();
+ const { isAdmin } = useUserStore();
const collectionsStore = useCollectionsStore();
const presetsStore = usePresetsStore();
@@ -138,6 +149,8 @@ export default defineComponent({
matchesSearch,
contextMenu,
activateContextMenu,
+ deactivateContextMenu,
+ isAdmin,
t,
hasArchive,
};
@@ -159,12 +172,14 @@ export default defineComponent({
}
function activateContextMenu(event: PointerEvent) {
- if (hasArchive.value) {
+ if (hasArchive.value || props.collection.schema) {
contextMenu.value.activate(event);
- event.stopPropagation();
- event.preventDefault();
}
}
+
+ function deactivateContextMenu() {
+ contextMenu.value.deactivate();
+ }
},
});
diff --git a/app/src/modules/collections/components/navigation.vue b/app/src/modules/collections/components/navigation.vue
index 4f42ac7b33..e3da77c724 100644
--- a/app/src/modules/collections/components/navigation.vue
+++ b/app/src/modules/collections/components/navigation.vue
@@ -8,10 +8,12 @@
v-model="activeGroups"
scope="collections-navigation"
class="collections-navigation"
+ tabindex="-1"
nav
:mandatory="false"
:dense="dense"
@contextmenu.prevent.stop="activateContextMenu"
+ @focusout="deactivateContextMenu"
>
();
const rootItems = computed(() => {
const shownCollections = showHidden.value ? collectionsStore.allCollections : collectionsStore.visibleCollections;
@@ -83,16 +84,19 @@ export default defineComponent({
rootItems,
dense,
activateContextMenu,
+ deactivateContextMenu,
contextMenu,
- contextMenuTarget,
search,
showSearch,
};
- function activateContextMenu(event: PointerEvent, target?: string) {
- contextMenuTarget.value = target;
+ function activateContextMenu(event: PointerEvent) {
contextMenu.value.activate(event);
}
+
+ function deactivateContextMenu() {
+ contextMenu.value.deactivate();
+ }
},
});
diff --git a/app/src/modules/files/components/navigation-folder.vue b/app/src/modules/files/components/navigation-folder.vue
index 0d5177139a..9820ab6ff3 100644
--- a/app/src/modules/files/components/navigation-folder.vue
+++ b/app/src/modules/files/components/navigation-folder.vue
@@ -5,6 +5,7 @@
:to="`/files/folders/${folder.id}`"
:active="currentFolder === folder.id"
@contextmenu.prevent.stop="activateContextMenu"
+ @focusout="deactivateContextMenu"
>
@@ -20,6 +21,7 @@
scope="files-navigation"
disable-groupable-parent
@contextmenu.prevent.stop="activateContextMenu"
+ @focusout="deactivateContextMenu"
>
@@ -167,6 +169,7 @@ export default defineComponent({
deleteSaving,
contextMenu,
activateContextMenu,
+ deactivateContextMenu,
};
function useRenameFolder() {
@@ -291,6 +294,10 @@ export default defineComponent({
function activateContextMenu(event: PointerEvent) {
contextMenu.value.activate(event);
}
+
+ function deactivateContextMenu() {
+ contextMenu.value.deactivate();
+ }
},
});