Skip to content

Fix showing logic for notices, add compact style #107

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Fix showing logic for notices, add compact style #107

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
346e68f
Fix notices not showing if description not set
christophfriedrich Apr 15, 2025
50f2f34
Fix typo
christophfriedrich Apr 17, 2025
616ea05
Add `compact` prop to FederationMissingNotice
christophfriedrich Apr 23, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
1 change: 1 addition & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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:**

Expand Down
4 changes: 2 additions & 2 deletions components/Collection.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,10 +16,10 @@

<slot name="before-description" v-bind="$props"></slot>

<section class="description" v-if="stac.description">
<section class="description" v-if="stac.description || stac.deprecated || supportedBy || affectedByMissing">
<h3>Description</h3>

<Description :description="stac.description"></Description>
<Description v-if="stac.description" :description="stac.description"></Description>
Comment on lines +19 to +22
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The Description header is shown even if no description is shown, may also apply to other components.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes that's correct, for all the changed components. In my stump this happens e.g. for the service types in the ServerInfo modal. Looks like this:

image

I didn't find that overly inappropriate, so I left it as it is.

But would you prefer to show the heading only if there really is a description? Could easily be achieved with a v-if="stac.description" on the <h3>.

image

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, I think we can skip the description header in those cases. The proposed solution sounds reasonable.

Copy link
Collaborator Author

@christophfriedrich christophfriedrich Apr 23, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How about processes? Apart from the notices they always have a signature. This is what it would look like:

image

vs.

image

for reference with actual description:

image

In general: Would it be more consistent to always have the notices outside of the Description heading?

Copy link
Member

@m-mohr m-mohr Apr 23, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That's on the edge, both options seem fine for me. Implement your preferred way ;-)

<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" />
Expand Down
29 changes: 27 additions & 2 deletions components/FederationMissingNotice.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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" :class="{compact: compact}">
<AsyncButton v-if="retry" confirm class="retry" :fn="retry">Retry</AsyncButton>
<strong class="header">Incomplete</strong>
<p>
Expand All @@ -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>
Expand All @@ -35,6 +35,10 @@ export default {
type: Function,
default: null
},
compact: {
type: Boolean,
default: false
},
federation: {
type: Object,
default: () => ({})
Expand Down Expand Up @@ -78,4 +82,25 @@ export default {
float: right;
}
}

.vue-component.federation-backends.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>
4 changes: 2 additions & 2 deletions components/FileFormat.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,9 @@

<slot name="before-description" v-bind="$props"></slot>

<section class="description" v-if="format.description">
<section class="description" v-if="format.description || format.deprecated || format.experimental || format['federation:backends']">
<h3>Description</h3>
<Description :description="format.description" />
<Description v-if="format.description" :description="format.description" />
<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" />
Expand Down
4 changes: 2 additions & 2 deletions components/Item.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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" />
Expand Down
4 changes: 2 additions & 2 deletions components/Job.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,9 +47,9 @@

<slot name="before-description" v-bind="$props"></slot>

<summary class="description" v-if="job.description">
<summary class="description" v-if="job.description || job['federation:missing']">
<h3>Description</h3>
<Description :description="job.description" />
<Description v-if="job.description" :description="job.description" />

<FederationMissingNotice v-if="job['federation:missing']" :missing="job['federation:missing']" :federation="federation" />
</summary>
Expand Down
4 changes: 2 additions & 2 deletions components/Process.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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" />
Expand Down
4 changes: 2 additions & 2 deletions components/ServiceType.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,9 @@

<slot name="before-description" v-bind="$props"></slot>

<section class="description" v-if="service.description">
<section class="description" v-if="service.description || service.deprecated || service.experimental || service['federation:backends']">
<h3>Description</h3>
<Description :description="service.description" />
<Description v-if="service.description" :description="service.description" />
<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" />
Expand Down
4 changes: 2 additions & 2 deletions components/UdfRuntime.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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" />
Expand Down