diff --git a/src/components/HrefActions.vue b/src/components/HrefActions.vue
index 28373e1e..77584a4f 100644
--- a/src/components/HrefActions.vue
+++ b/src/components/HrefActions.vue
@@ -112,11 +112,11 @@ export default {
     },
     canShow() {
       // We need to know the type, otherwise we don't even try to show it
-      if (typeof this.data.type !== 'string') {
+      if (typeof this.data?.type !== 'string') {
         return false;
       }
       // If the tile renderer is a tile server, we can't really know what it supports so we pass all images
-      else if (this.tileRendererType === 'server' && imageMediaTypes.includes(this.data.type)) {
+      else if (this.tileRendererType === 'server' && imageMediaTypes.includes(this.data?.type)) {
         return true;
       }
       // Don't pass GDAL VFS URIs to client-side tile renderer: https://github.com/radiantearth/stac-browser/issues/116
@@ -128,7 +128,7 @@ export default {
         return false;
       }
       // Otherwise, all images that a browser can read are supported + JSON
-      else if (mapMediaTypes.includes(this.data.type)) {
+      else if (mapMediaTypes.includes(this.data?.type)) {
         return true;
       }
       return false;
@@ -239,7 +239,7 @@ export default {
       if (Utils.canBrowserDisplayImage(this.data)) {
         return true;
       }
-      else if (typeof this.data.type === 'string') {
+      else if (typeof this.data?.type === 'string') {
         switch(this.data.type.toLowerCase()) {
           case 'text/html':
           case 'application/xhtml+xml':
diff --git a/src/components/StacHeader.vue b/src/components/StacHeader.vue
index 3fffdfb3..af54a2db 100644
--- a/src/components/StacHeader.vue
+++ b/src/components/StacHeader.vue
@@ -89,7 +89,7 @@ export default {
         else if (this.data.isCatalog()) {
           return this.$tc(`stacCatalog`);
         }
-        else {
+        else if (Utils.hasText(this.data.type)) {
           return this.data.type;
         }
       }
diff --git a/src/models/stac.js b/src/models/stac.js
index 3af950ef..631c01c5 100644
--- a/src/models/stac.js
+++ b/src/models/stac.js
@@ -35,6 +35,9 @@ class STAC {
         this[key] = data[key];
       }
     }
+    if (!Utils.hasText(this.type)) {
+      throw new Error('Not a valid STAC data source (no `type` present)');
+    }
   }
 
   isPotentiallyIncomplete() {
diff --git a/src/views/Catalog.vue b/src/views/Catalog.vue
index e3c5548f..4c6e611e 100644
--- a/src/views/Catalog.vue
+++ b/src/views/Catalog.vue
@@ -1,5 +1,5 @@
 <template>
-  <div :class="{cc: true, [data.type.toLowerCase()]: true, mixed: hasCatalogs && hasItems, empty: !hasCatalogs && !hasItems}" :key="data.id">
+  <div :class="{cc: true, [cssStacType]: true, mixed: hasCatalogs && hasItems, empty: !hasCatalogs && !hasItems}" :key="data.id">
     <b-row>
       <b-col class="meta">
         <section class="intro">
@@ -137,6 +137,12 @@ export default {
   computed: {
     ...mapState(['data', 'url', 'apiItems', 'apiItemsLink', 'apiItemsPagination', 'nextCollectionsLink', 'stateQueryParameters']),
     ...mapGetters(['additionalLinks', 'catalogs', 'collectionLink', 'isCollection', 'items', 'getApiItemsLoading', 'parentLink', 'rootLink']),
+    cssStacType() {
+      if (Utils.hasText(this.data?.type)) {
+        return this.data?.type.toLowerCase();
+      }
+      return null;
+    },
     showFilters() {
       return Boolean(this.stateQueryParameters['itemFilterOpen']);
     },