Open-EO · m-mohr · Apr 25, 2025 · Apr 15, 2025 · Apr 17, 2025 · Apr 23, 2025
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+### Added
+
+- `FederationMissingNotice`: Prop `compact`
+
 ## [2.18.3] - 2025-01-15
 
 ### Fixed

diff --git a/README.md b/README.md
@@ -252,6 +252,7 @@ Show a message that a response is incomplete due to missing data from an inacces
 - `missing` (array, required): The identifiers of the federated back-ends that are not providing data for the list of processes due to an issue.
 - `federation` (object): The data of the `federation` property obtained from the capabilities.
 - `retry` (function): Displays a "retry" button which executes the given function. 
+- `compact` (boolean): Renders the notice more compact if set to `true`. Defaults to `false`.
 
 **Slots:**
 

diff --git a/components/Collection.vue b/components/Collection.vue
@@ -16,10 +16,11 @@
 
 		<slot name="before-description" v-bind="$props"></slot>
 
-		<section class="description" v-if="stac.description">
-			<h3>Description</h3>
-
-			<Description :description="stac.description"></Description>
+		<section class="description" v-if="stac.description || stac.deprecated || supportedBy || affectedByMissing">
+			<template v-if="stac.description">
+				<h3>Description</h3>
+				<Description :description="stac.description"></Description>
+			</template>
 			<DeprecationNotice v-if="stac.deprecated" entity="collection" />
 			<FederationNotice v-if="supportedBy" :backends="supportedBy" :federation="federation" entity="collection" />
 			<FederationMissingNotice v-if="affectedByMissing" :missing="missing" :federation="federation" />

diff --git a/components/FederationMissingNotice.vue b/components/FederationMissingNotice.vue
@@ -1,5 +1,5 @@
 <template>
-	<section v-if="services" class="vue-component message-block federation federation-backends">
+	<section v-if="services" class="vue-component message-block federation federation-backends federation-missing-notice" :class="{compact: compact}">
 		<AsyncButton v-if="retry" confirm class="retry" :fn="retry">Retry</AsyncButton>
 		<strong class="header">Incomplete</strong>
 		<p>
@@ -9,7 +9,7 @@
 			<li v-for="service in services" :key="service.url">
 				<div class="fed-header">
 					<strong class="fed-title">{{ service }}</strong>
-					<ul class="badges small inline">
+					<ul v-if="!compact" class="badges small inline">
 						<li class="badge red">offline</li>
 					</ul>
 				</div>
@@ -35,6 +35,10 @@ export default {
 			type: Function,
 			default: null
 		},
+		compact: {
+			type: Boolean,
+			default: false
+		},
 		federation: {
 			type: Object,
 			default: () => ({})
@@ -62,7 +66,7 @@ export default {
 <style lang="scss">
 @use './base.scss';
 
-.vue-component.federation-backends {
+.vue-component.federation-missing-notice {
 	background-color: rgba(255, 69, 0, 0.1);
 	border: 1px solid orangered;
 
@@ -78,4 +82,25 @@ export default {
 		float: right;
 	}
 }
+
+.vue-component.federation-missing-notice.compact {
+	margin: 0;
+	padding: 0.25em;
+
+	strong, p, ul, ul li, ul li div {
+		display: inline;
+	}
+
+	strong.header, p {
+		margin-right: 5px;
+	}
+
+	ul {
+		padding-left: 0;
+	}
+
+	li:not(:last-child)::after {
+		content: ", "
+	}
+}
 </style>
diff --git a/components/FileFormat.vue b/components/FileFormat.vue
@@ -24,9 +24,11 @@
 
 		<slot name="before-description" v-bind="$props"></slot>
 
-		<section class="description" v-if="format.description">
-			<h3>Description</h3>
-			<Description :description="format.description" />
+		<section class="description" v-if="format.description || format.deprecated || format.experimental || format['federation:backends']">
+			<template v-if="format.description">
+				<h3>Description</h3>
+				<Description :description="format.description" />
+			</template>
 			<DeprecationNotice v-if="format.deprecated" entity="file format" />
 			<ExperimentalNotice v-if="format.experimental" entity="file format" />
 			<FederationNotice v-if="format['federation:backends']" :backends="format['federation:backends']" :federation="federation" entity="file format" />

diff --git a/components/Item.vue b/components/Item.vue
@@ -8,8 +8,8 @@
 
 		<slot name="before-description" v-bind="$props"></slot>
 
-		<summary class="description" v-if="properties.description">
-			<Description :description="properties.description"></Description>
+		<summary class="description" v-if="properties.description || properties.deprecated || stac['federation:missing']">
+			<Description v-if="properties.description" :description="properties.description"></Description>
 
 			<DeprecationNotice v-if="properties.deprecated" entity="item" />
 			<FederationMissingNotice v-if="stac['federation:missing']" :missing="stac['federation:missing']" :federation="federation" />

diff --git a/components/Job.vue b/components/Job.vue
@@ -47,10 +47,11 @@
 
 		<slot name="before-description" v-bind="$props"></slot>
 
-		<summary class="description" v-if="job.description">
-			<h3>Description</h3>
-			<Description :description="job.description" />
-
+		<summary class="description" v-if="job.description || job['federation:missing']">
+			<template v-if="job.description">
+				<h3>Description</h3>
+				<Description :description="job.description" />
+			</template>
 			<FederationMissingNotice v-if="job['federation:missing']" :missing="job['federation:missing']" :federation="federation" />
 		</summary>
 

diff --git a/components/Process.vue b/components/Process.vue
@@ -33,10 +33,10 @@
 
 		<slot name="before-description" :v-bind="$props"></slot>
 
-		<section class="description" v-if="process.description">
+		<section class="description" v-if="process.description || process.deprecated || process.experimental || process['federation:backends']">
 			<h3>Description</h3>
 			<code class="signature" v-html="signature"></code>
-			<Description :description="process.description" :processUrl="processUrl" />
+			<Description v-if="process.description" :description="process.description" :processUrl="processUrl" />
 			<DeprecationNotice v-if="process.deprecated" entity="process" />
 			<ExperimentalNotice v-if="process.experimental" entity="process" />
 			<FederationNotice v-if="process['federation:backends']" :backends="process['federation:backends']" :federation="federation" entity="process" />

diff --git a/components/ServiceType.vue b/components/ServiceType.vue
@@ -14,9 +14,11 @@
 
 		<slot name="before-description" v-bind="$props"></slot>
 
-		<section class="description" v-if="service.description">
-			<h3>Description</h3>
-			<Description :description="service.description" />
+		<section class="description" v-if="service.description || service.deprecated || service.experimental || service['federation:backends']">
+			<template v-if="service.description">
+				<h3>Description</h3>
+				<Description :description="service.description" />
+			</template>
 			<DeprecationNotice v-if="service.deprecated" entity="type of secondary web service" />
 			<ExperimentalNotice v-if="service.experimental" entity="type of secondary web service" />
 			<FederationNotice v-if="service['federation:backends']" :backends="service['federation:backends']" :federation="federation" entity="type of secondary web service" />

diff --git a/components/UdfRuntime.vue b/components/UdfRuntime.vue
@@ -21,8 +21,8 @@
 
 		<slot name="before-description" v-bind="$props"></slot>
 
-		<section class="description" v-if="runtime.description">
-			<Description :description="runtime.description"></Description>
+		<section class="description" v-if="runtime.description || runtime.deprecated || runtime.experimental || runtime['federation:backends']">
+			<Description v-if="runtime.description" :description="runtime.description"></Description>
 			<DeprecationNotice v-if="runtime.deprecated" entity="UDF runtime" />
 			<ExperimentalNotice v-if="runtime.experimental" entity="UDF runtime" />
 			<FederationNotice v-if="runtime['federation:backends']" :backends="runtime['federation:backends']" :federation="federation" entity="UDF runtime" />

diff --git a/components/internal/FederationNotice.vue b/components/internal/FederationNotice.vue
@@ -1,5 +1,5 @@
 <template>
-	<section v-if="unsupported.length > 0" class="vue-component message-block federation federation-backends">
+	<section v-if="unsupported.length > 0" class="vue-component message-block federation federation-backends federation-notice">
 		<strong class="header">Federation</strong>
 		<p>This {{ entity }} is only available through the following service{{ services.length > 1 ? 's' : '' }} in the federation:</p>
 		<ul>
@@ -64,7 +64,7 @@ export default {
 <style lang="scss">
 @use '../base.scss';
 
-.vue-component.federation-backends {
+.vue-component.federation-notice {
 	background-color: rgba(184, 134, 11, 0.1);
 	border: 1px solid darkgoldenrod;
 

diff --git a/dev/create-wc-examples.js b/dev/create-wc-examples.js
@@ -4,7 +4,7 @@ const examples = require('./examples');
 const FOLDER = './examples';
 
 if (fs.existsSync(FOLDER)) {
-	fs.rmdirSync(FOLDER, { recursive: true });
+	fs.rmSync(FOLDER, { recursive: true });
 }
 fs.mkdirSync(FOLDER);
 

diff --git a/dev/examples.js b/dev/examples.js
@@ -171,6 +171,11 @@ if (a == b) console.log("Hello World");
 			"missing": ["wwu", "eodc"],
 			"federation": capabilities.federation,
 			"retry": asyncFn
+		},
+		"compact": {
+			"missing": ["wwu", "eodc"],
+			"federation": capabilities.federation,
+			"compact": true
 		}
 	},
 	"file-format": {