Rename Collections Modules to Content Module (#9441)

* Rename collections->content module

* Replace collection name

* Replace some loose ends

app/src/constants.ts

@@ -41,7 +41,7 @@ export const COLLECTIONS_DENY_LIST = [
 export const MODULE_BAR_DEFAULT = [
 	{
 		type: 'module',
-		id: 'collections',
+		id: 'content',
 		enabled: true,
 	},
 	{

app/src/displays/related-values/related-values.vue

@@ -100,7 +100,7 @@ export default defineComponent({
 			if (!relatedCollection.value || !primaryKeyField.value) return null;
 			const primaryKey = item[primaryKeyField.value.field];
 
-			return `/collections/${relatedCollection.value}/${encodeURIComponent(primaryKey)}`;
+			return `/content/${relatedCollection.value}/${encodeURIComponent(primaryKey)}`;
 		}
 	},
 });

app/src/lang/translations/en-US.yaml

@@ -837,6 +837,7 @@ cancel: Cancel
 no_upscale: Don't upscale images
 collection: Collection
 collections: Collections
+content: Content
 singleton: Singleton
 singleton_label: Treat as single object
 system_fields_locked: System fields are locked and can't be edited

app/src/layouts/cards/index.ts

@@ -208,7 +208,7 @@ export default defineLayout<LayoutOptions, LayoutQuery>({
 
 		function getLinkForItem(item: Record<string, any>) {
 			if (!primaryKeyField.value) return;
-			return `/collections/${props.collection}/${encodeURIComponent(item[primaryKeyField.value.field])}`;
+			return `/content/${props.collection}/${encodeURIComponent(item[primaryKeyField.value.field])}`;
 		}
 
 		function selectAll() {

app/src/layouts/map/index.ts

@@ -255,7 +255,7 @@ export default defineLayout<LayoutOptions, LayoutQuery>({
 			if (props.selectMode) {
 				handleSelect({ ids: [id], replace });
 			} else {
-				router.push(`/collections/${collection.value}/${id}`);
+				router.push(`/content/${collection.value}/${id}`);
 			}
 		}
 

app/src/layouts/tabular/index.ts

@@ -271,7 +271,7 @@ export default defineLayout<LayoutOptions, LayoutQuery>({
 						selection.value = selection.value.filter((item) => item !== primaryKey);
 					}
 				} else {
-					const next = router.resolve(`/collections/${collection.value}/${encodeURIComponent(primaryKey)}`);
+					const next = router.resolve(`/content/${collection.value}/${encodeURIComponent(primaryKey)}`);
 
 					if (event.ctrlKey || event.metaKey) window.open(next.href, '_blank');
 					else router.push(next);

app/src/modules/activity/routes/collection.vue

@@ -106,7 +106,7 @@ export default defineComponent({
 				return [
 					{
 						name: t('collection', 2),
-						to: `/collections`,
+						to: `/content`,
 					},
 				];
 			});

app/src/modules/activity/routes/item.vue

@@ -90,7 +90,7 @@ export default defineComponent({
 
 		const openItemLink = computed(() => {
 			if (!item.value || item.value.collection.startsWith('directus_')) return;
-			return `/collections/${item.value.collection}/${encodeURIComponent(item.value.item)}`;
+			return `/content/${item.value.collection}/${encodeURIComponent(item.value.item)}`;
 		});
 
 		watch(() => props.primaryKey, loadActivity, { immediate: true });

app/src/modules/content/components/navigation-bookmark.vue

@@ -1,6 +1,6 @@
 <template>
 	<v-list-item
-		:to="`/collections/${bookmark.collection}?bookmark=${bookmark.id}`"
+		:to="`/content/${bookmark.collection}?bookmark=${bookmark.id}`"
 		query
 		class="bookmark"
 		clickable
@@ -147,7 +147,7 @@ export default defineComponent({
 					let navigateTo: string | null = null;
 
 					if (+route.query?.bookmark === props.bookmark.id) {
-						navigateTo = `/collections/${props.bookmark.collection}`;
+						navigateTo = `/content/${props.bookmark.collection}`;
 					}
 
 					await presetsStore.delete(props.bookmark.id);

app/src/modules/content/components/navigation-item.vue

@@ -2,7 +2,7 @@
 	<v-list-group
 		v-if="isGroup && matchesSearch"
 		:to="to"
-		scope="collections-navigation"
+		scope="content-navigation"
 		:value="collection.collection"
 		query
 		:arrow-placement="collection.meta?.collapse === 'locked' ? false : 'after'"
@@ -46,7 +46,7 @@
 
 	<v-menu ref="contextMenu" show-arrow placement="bottom-start">
 		<v-list>
-			<v-list-item v-if="hasArchive" clickable :to="`/collections/${collection.collection}?archive`" exact query>
+			<v-list-item v-if="hasArchive" clickable :to="`/content/${collection.collection}?archive`" exact query>
 				<v-list-item-icon>
 					<v-icon name="archive" outline />
 				</v-list-item-icon>
@@ -112,7 +112,7 @@ export default defineComponent({
 
 		const isGroup = computed(() => childCollections.value.length > 0 || childBookmarks.value.length > 0);
 
-		const to = computed(() => (props.collection.schema ? `/collections/${props.collection.collection}` : ''));
+		const to = computed(() => (props.collection.schema ? `/content/${props.collection.collection}` : ''));
 
 		const matchesSearch = computed(() => {
 			if (!props.search || props.search.length < 3) return true;

app/src/modules/content/components/navigation.vue

@@ -1,13 +1,13 @@
 <template>
-	<div class="collections-navigation-wrapper">
+	<div class="content-navigation-wrapper">
 		<div v-if="showSearch" class="search-input">
 			<v-input v-model="search" type="search" :placeholder="t('search_collection')" />
 		</div>
 
 		<v-list
 			v-model="activeGroups"
-			scope="collections-navigation"
-			class="collections-navigation"
+			scope="content-navigation"
+			class="content-navigation"
 			tabindex="-1"
 			nav
 			:mandatory="false"
@@ -115,13 +115,13 @@ export default defineComponent({
 	}
 }
 
-.collections-navigation-wrapper {
+.content-navigation-wrapper {
 	display: flex;
 	flex-direction: column;
 	min-height: 100%;
 }
 
-.collections-navigation {
+.content-navigation {
 	--v-list-min-height: calc(100% - 64px);
 
 	flex-grow: 1;

app/src/modules/content/index.ts

@@ -58,8 +58,8 @@ const checkForSystem: NavigationGuard = (to, from) => {
 };
 
 export default defineModule({
-	id: 'collections',
-	name: '$t:collections',
+	id: 'content',
+	name: '$t:content',
 	icon: 'box',
 	routes: [
 		{
@@ -86,7 +86,7 @@ export default defineModule({
 
 				if (!firstCollection) return;
 
-				return `/collections/${firstCollection.collection}`;
+				return `/content/${firstCollection.collection}`;
 
 				function findFirst(collections: Collection[], { skipClosed } = { skipClosed: true }): Collection | void {
 					for (const collection of collections) {
@@ -116,7 +116,7 @@ export default defineModule({
 			component: RouterPass,
 			children: [
 				{
-					name: 'collections-collection',
+					name: 'content-collection',
 					path: '',
 					component: CollectionOrItem,
 					props: (route) => ({
@@ -127,7 +127,7 @@ export default defineModule({
 					beforeEnter: checkForSystem,
 				},
 				{
-					name: 'collections-item',
+					name: 'content-item',
 					path: ':primaryKey',
 					component: Item,
 					props: true,
@@ -136,7 +136,7 @@ export default defineModule({
 			],
 		},
 		{
-			name: 'collections-item-not-found',
+			name: 'content-item-not-found',
 			path: ':_(.+)+',
 			component: ItemNotFound,
 			beforeEnter: checkForSystem,

app/src/modules/content/routes/collection.vue

@@ -14,7 +14,7 @@
 		:reset-preset="resetPreset"
 		:clear-filters="clearFilters"
 	>
-		<collections-not-found v-if="!currentCollection || collection.startsWith('directus_')" />
+		<content-not-found v-if="!currentCollection || collection.startsWith('directus_')" />
 		<private-view
 			v-else
 			:title="bookmark ? bookmarkTitle : currentCollection.name"
@@ -28,7 +28,7 @@
 
 			<template #headline>
 				<v-breadcrumb v-if="bookmark" :items="breadcrumb" />
-				<v-breadcrumb v-else :items="[{ name: t('collections'), to: '/collections' }]" />
+				<v-breadcrumb v-else :items="[{ name: t('content'), to: '/content' }]" />
 			</template>
 
 			<template #title-outer:append>
@@ -177,7 +177,7 @@
 			</template>
 
 			<template #navigation>
-				<collections-navigation :current-collection="collection" />
+				<content-navigation :current-collection="collection" />
 			</template>
 
 			<v-info
@@ -212,7 +212,7 @@
 						{{ t('no_items_copy') }}
 
 						<template v-if="createAllowed" #append>
-							<v-button :to="`/collections/${collection}/+`">{{ t('create_item') }}</v-button>
+							<v-button :to="`/content/${collection}/+`">{{ t('create_item') }}</v-button>
 						</template>
 					</v-info>
 				</template>
@@ -262,9 +262,9 @@
 <script lang="ts">
 import { useI18n } from 'vue-i18n';
 import { defineComponent, computed, ref, watch, toRefs } from 'vue';
-import CollectionsNavigation from '../components/navigation.vue';
+import ContentNavigation from '../components/navigation.vue';
 import api from '@/api';
-import CollectionsNotFound from './not-found.vue';
+import ContentNotFound from './not-found.vue';
 import { useCollection } from '@directus/shared/composables';
 import { useLayout } from '@/composables/use-layout';
 import usePreset from '@/composables/use-preset';
@@ -285,10 +285,10 @@ type Item = {
 };
 
 export default defineComponent({
-	name: 'CollectionsCollection',
+	name: 'ContentCollection',
 	components: {
-		CollectionsNavigation,
-		CollectionsNotFound,
+		ContentNavigation,
+		ContentNotFound,
 		LayoutSidebarDetail,
 		SearchInput,
 		BookmarkAdd,
@@ -457,7 +457,7 @@ export default defineComponent({
 			const breadcrumb = computed(() => [
 				{
 					name: currentCollection.value?.name,
-					to: `/collections/${props.collection}`,
+					to: `/content/${props.collection}`,
 				},
 			]);
 
@@ -541,11 +541,11 @@ export default defineComponent({
 
 		function useLinks() {
 			const addNewLink = computed<string>(() => {
-				return `/collections/${props.collection}/+`;
+				return `/content/${props.collection}/+`;
 			});
 
 			const currentCollectionLink = computed<string>(() => {
-				return `/collections/${props.collection}`;
+				return `/content/${props.collection}`;
 			});
 
 			return { addNewLink, currentCollectionLink };
@@ -569,7 +569,7 @@ export default defineComponent({
 
 				try {
 					const newBookmark = await saveCurrentAsBookmark({ bookmark: name });
-					router.push(`/collections/${newBookmark.collection}?bookmark=${newBookmark.id}`);
+					router.push(`/content/${newBookmark.collection}?bookmark=${newBookmark.id}`);
 
 					bookmarkDialogActive.value = false;
 				} catch (err: any) {

app/src/modules/content/routes/item.vue

@@ -1,5 +1,5 @@
 <template>
-	<collections-not-found
+	<content-not-found
 		v-if="error || (collectionInfo.meta && collectionInfo.meta.singleton === true && primaryKey !== null)"
 	/>
 
@@ -51,7 +51,7 @@
 		<template #headline>
 			<v-breadcrumb
 				v-if="collectionInfo.meta && collectionInfo.meta.singleton === true"
-				:items="[{ name: t('collections'), to: '/collections' }]"
+				:items="[{ name: t('content'), to: '/content' }]"
 			/>
 			<v-breadcrumb v-else :items="breadcrumb" />
 		</template>
@@ -142,7 +142,7 @@
 		</template>
 
 		<template #navigation>
-			<collections-navigation :current-collection="collection" />
+			<content-navigation :current-collection="collection" />
 		</template>
 
 		<v-form
@@ -195,8 +195,8 @@
 import { useI18n } from 'vue-i18n';
 import { defineComponent, computed, toRefs, ref, ComponentPublicInstance } from 'vue';
 
-import CollectionsNavigation from '../components/navigation.vue';
-import CollectionsNotFound from './not-found.vue';
+import ContentNavigation from '../components/navigation.vue';
+import ContentNotFound from './not-found.vue';
 import { useCollection } from '@directus/shared/composables';
 import RevisionsDrawerDetail from '@/views/private/components/revisions-drawer-detail';
 import CommentsSidebarDetail from '@/views/private/components/comments-sidebar-detail';
@@ -211,10 +211,10 @@ import { renderStringTemplate } from '@/utils/render-string-template';
 import useTemplateData from '@/composables/use-template-data';
 
 export default defineComponent({
-	name: 'CollectionsItem',
+	name: 'ContentsItem',
 	components: {
-		CollectionsNavigation,
-		CollectionsNotFound,
+		ContentNavigation,
+		ContentNotFound,
 		RevisionsDrawerDetail,
 		CommentsSidebarDetail,
 		SaveOptions,
@@ -415,7 +415,7 @@ export default defineComponent({
 			const breadcrumb = computed(() => [
 				{
 					name: collectionInfo.value?.name,
-					to: `/collections/${props.collection}`,
+					to: `/content/${props.collection}`,
 				},
 			]);
 
@@ -427,7 +427,7 @@ export default defineComponent({
 
 			try {
 				await save();
-				if (props.singleton === false) router.push(`/collections/${props.collection}`);
+				if (props.singleton === false) router.push(`/content/${props.collection}`);
 			} catch {
 				// Save shows unexpected error dialog
 			}
@@ -443,7 +443,7 @@ export default defineComponent({
 
 				if (props.primaryKey === '+') {
 					const newPrimaryKey = savedItem[primaryKeyField.value!.field];
-					router.replace(`/collections/${props.collection}/${encodeURIComponent(newPrimaryKey)}`);
+					router.replace(`/content/${props.collection}/${encodeURIComponent(newPrimaryKey)}`);
 				}
 			} catch {
 				// Save shows unexpected error dialog
@@ -459,7 +459,7 @@ export default defineComponent({
 				if (isNew.value === true) {
 					refresh();
 				} else {
-					router.push(`/collections/${props.collection}/+`);
+					router.push(`/content/${props.collection}/+`);
 				}
 			} catch {
 				// Save shows unexpected error dialog
@@ -469,7 +469,7 @@ export default defineComponent({
 		async function saveAsCopyAndNavigate() {
 			try {
 				const newPrimaryKey = await saveAsCopy();
-				if (newPrimaryKey) router.push(`/collections/${props.collection}/${encodeURIComponent(newPrimaryKey)}`);
+				if (newPrimaryKey) router.push(`/content/${props.collection}/${encodeURIComponent(newPrimaryKey)}`);
 			} catch {
 				// Save shows unexpected error dialog
 			}
@@ -479,7 +479,7 @@ export default defineComponent({
 			try {
 				await remove();
 				edits.value = {};
-				router.push(`/collections/${props.collection}`);
+				router.push(`/content/${props.collection}`);
 			} catch {
 				// `remove` will show the unexpected error dialog
 			}
@@ -490,7 +490,7 @@ export default defineComponent({
 				await archive();
 
 				if (isArchived.value === true) {
-					router.push(`/collections/${props.collection}`);
+					router.push(`/content/${props.collection}`);
 				} else {
 					confirmArchive.value = false;
 				}

app/src/modules/content/routes/no-collections.vue

@@ -1,5 +1,5 @@
 <template>
-	<private-view class="collections-overview" :title="t('collections')">
+	<private-view class="content-overview" :title="t('content')">
 		<template #title-outer:prepend>
 			<v-button class="header-icon" rounded disabled icon secondary>
 				<v-icon name="box" />
@@ -7,7 +7,7 @@
 		</template>
 
 		<template #navigation>
-			<collections-navigation />
+			<content-navigation />
 		</template>
 
 		<v-info icon="box" :title="t('no_collections')" center>
@@ -35,13 +35,13 @@
 <script lang="ts">
 import { useI18n } from 'vue-i18n';
 import { defineComponent, computed } from 'vue';
-import CollectionsNavigation from '../components/navigation.vue';
+import ContentNavigation from '../components/navigation.vue';
 import { useUserStore } from '@/stores';
 
 export default defineComponent({
-	name: 'CollectionsOverview',
+	name: 'ContentOverview',
 	components: {
-		CollectionsNavigation,
+		ContentNavigation,
 	},
 	props: {},
 	setup() {

app/src/modules/content/routes/not-found.vue

@@ -1,7 +1,7 @@
 <template>
 	<private-view :title="t('page_not_found')">
 		<template #navigation>
-			<collections-navigation />
+			<content-navigation />
 		</template>
 
 		<div class="not-found">
@@ -15,10 +15,10 @@
 <script lang="ts">
 import { useI18n } from 'vue-i18n';
 import { defineComponent } from 'vue';
-import CollectionsNavigation from '../components/navigation.vue';
+import ContentNavigation from '../components/navigation.vue';
 
 export default defineComponent({
-	components: { CollectionsNavigation },
+	components: { ContentNavigation },
 	setup() {
 		const { t } = useI18n();
 		return { t };

app/src/routes/login/components/continue-as.vue

@@ -66,7 +66,7 @@ export default defineComponent({
 
 		async function hydrateAndLogin() {
 			await hydrate();
-			router.push(lastPage.value || `/collections`);
+			router.push(lastPage.value || `/content`);
 		}
 	},
 });

app/src/routes/login/components/login-form/ldap-form.vue

@@ -105,7 +105,7 @@ export default defineComponent({
 
 				// Stores are hydrated after login
 				const lastPage = userStore.currentUser?.last_page;
-				router.push(lastPage || '/collections');
+				router.push(lastPage || '/content');
 			} catch (err: any) {
 				if (err.response?.data?.errors?.[0]?.extensions?.code === 'INVALID_OTP' && requiresTFA.value === false) {
 					requiresTFA.value = true;

app/src/routes/login/components/login-form/login-form.vue

@@ -111,7 +111,7 @@ export default defineComponent({
 
 				// Stores are hydrated after login
 				const lastPage = userStore.currentUser?.last_page;
-				router.push(lastPage || '/collections');
+				router.push(lastPage || '/content');
 			} catch (err: any) {
 				if (err.response?.data?.errors?.[0]?.extensions?.code === 'INVALID_OTP' && requiresTFA.value === false) {
 					requiresTFA.value = true;

app/src/views/private/components/header-bar/readme.md

@@ -9,7 +9,7 @@ providing enough consistency between views.
 ```html
 <header-bar title="Global Settings">
 	<template #actions>
-		<v-button to="/collections/settings/+">
+		<v-button to="/content/settings/+">
 			<v-icon name="add" />
 		</v-button>
 	</template>