Fixed issue in collection color reading for tables that weren't configured in directus yet (#6052)

Fixes #6050

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

@@ -3,7 +3,7 @@
 	<private-view v-else :title="bookmark ? bookmarkTitle : currentCollection.name">
 		<template #title-outer:prepend>
 			<v-button class="header-icon" rounded icon secondary disabled>
-				<v-icon :name="currentCollection.icon" :color="currentCollection.meta.color" />
+				<v-icon :name="currentCollection.icon" :color="currentCollection.color" />
 			</v-button>
 		</template>
 

app/src/modules/settings/routes/data-model/collections/collections.vue

@@ -45,7 +45,7 @@
 							unmanaged: item.meta === null && item.collection.startsWith('directus_') === false,
 						}"
 						:name="item.icon"
-						:color="item.meta.color"
+						:color="item.color"
 					/>
 				</template>
 

app/src/stores/collections.ts

@@ -33,6 +33,7 @@ export const useCollectionsStore = createStore({
 
 			this.state.collections = collections.map((collection: CollectionRaw) => {
 				const icon = collection.meta?.icon || 'label';
+				const color = collection.meta?.color;
 				const name = formatTitle(collection.collection);
 
 				if (collection.meta && notEmpty(collection.meta.translations)) {
@@ -57,6 +58,7 @@ export const useCollectionsStore = createStore({
 					...collection,
 					name,
 					icon,
+					color,
 				};
 			});
 

app/src/types/collections.ts

@@ -29,4 +29,6 @@ export interface CollectionRaw {
 
 export interface Collection extends CollectionRaw {
 	name: string | VueI18n.TranslateResult;
+	icon: string;
+	color: string | null;
 }