Presentation Highlight

See it in the scaffold: settings/presentations/cart.sty in the scaffold defines a highlight section with fields, provisioning, related resources and events; checkout.sty adds a links entry (string-template target/tooltip with a CEL filter); and database.sty shows a related-resources panel in the opposite direction.

Highlight

Defines fields and sections shown on highlight pages. For a component, all applicable presentations can contribute fields to display.

Each field contains a title and a projection. The title is displayed as the name of the field. The projection determines how a value, or a combination of values, are shown. Values are either expressed using CEL expressions, evaluated against the various attributes of a component, or they represent a (metric) query that can be executed. For example a ComponentLinkProjection expects 2 arguments, a name and an identifier:

rank:
  specificity: 10
presentation:
  highlight:
    fields:
      - fieldId: "namespace"
        title: "Namespace"
        order: 85.0
        projection:
          _type: ComponentLinkProjection
          name: "tags['service.namespace']"
          identifier: "'urn:opentelemetry:namespace/' + tags['service.namespace']"

A more specific presentation can override field definitions of a more generic one, e.g. for reordering or suppression. A field provided by the generic presentation can be hidden by including a field with the same fieldId, but without a projection.

The order field can take on any value, with higher values ending up closer to the top of the "About" section in the highlights perspective. To maintain a consistent UI, we use the following conventions:

Generic fields

(e.g., name, health) should use high order numbers (e.g., 80-100) to appear at the top by default.

Specialized fields

should use lower order numbers to appear after generic ones.

Overrides

A specialized presentation can hide a generic section (like health) or move it by overriding the field and providing a different order (e.g., a negative value to push it further down).

Provisioning

The "Show Configuration", "Show Last Change" and "Show Status" buttons reveal provisioning data. Such data is received in "Source Components" - one or more sources of data.

presentation:
  highlight:
    provisioning:
      topologySourceSelector: "matches(source.mapping.identifier, '^urn:open-telemetry:.*')"
      showConfiguration: true
      showStatus: true

Related resources

Related resources are sections on a component’s highlight page that show other components related to the one being viewed (for example, "This service instance has 5 related pods"). Each section renders as an overview table.

A related resource references another ComponentPresentation by identifier, reusing its overview spec (columns, name) for rendering. The stql field scopes which components appear in the section, and the backend intersects it with the referenced presentation’s binding query — so you don’t need to redundantly include the type filter.

presentation:
  highlight:
    relatedResources:
      - resourceId: "related-pods"
        title: "Related Pods"
        topologyQuery: 'withNeighborsOf(direction = "both", components = (id = "${identifiers[0]}"), levels = "1") AND type = "pod"'
        order: 100
        presentationIdentifier: "urn:stackpack:otel:component-presentation:pod"
      - resourceId: "related-endpoints"
        title: "Related Endpoints"
        topologyQuery: 'withNeighborsOf(direction = "both", components = (id = "${identifiers[0]}"), levels = "1") AND type = "endpoint"'
        order: 200
        presentationIdentifier: "urn:stackpack:otel:component-presentation:endpoint"

STQL templates

The topologyQuery field is a template string that supports ${CEL_EXPRESSION} placeholders. Each placeholder is a CEL expression evaluated against the current component’s data — the same CEL context variables are available. All expressions must evaluate to a string. Refer to the STQL reference for the available query syntax.

Merging

Related resources follow the same merge semantics as highlight fields:

  • All matching presentations contribute related resources.

  • Same resourceId with higher specificity wins (override).

  • Different resourceId values from different presentations are both included (append).

  • The order field controls display order.

A more specific presentation can override or suppress related resource definitions of a more generic one. A related resource provided by the generic presentation can be hidden by including a related resource with the same resourceId, but without topologyQuery and presentationIdentifier.

Constraints

  • presentationIdentifier must reference a presentation within the same stackpack.

Links

Links are navigation entries shown on the component highlight page. They can point to an internal SUSE® Observability URL or an external system such as a dashboard, runbook or management console.

presentation:
  highlight:
    links:
      - linkId: "service-dashboard"
        title: "Service dashboard"
        target: "${properties['dashboardUrl']}"
        tooltip: "Open dashboard for ${name}"
        filter: "'dashboardUrl' in properties"
        openInNewTab: true
        order: 100

The title, target, and tooltip fields are string templates. Literal text is used as-is, and dynamic values can be inserted with ${CEL_EXPRESSION} placeholders evaluated against the current component. Each placeholder must evaluate to a string-compatible value.

The filter field is a pure CEL boolean expression. It is evaluated first. If it evaluates to false, the link is hidden. If the filter includes the link but title, target, or tooltip cannot be evaluated, the UI shows an error entry for that link.

Only linkId is required on an individual link definition. The other fields are optional so that more-specific presentations can override or inherit individual fields from less-specific definitions. After merging, an included link needs a target to resolve successfully. If title is omitted after merging, the linkId is used as the displayed title. A link definition that only specifies linkId and no other field is invalid.

Merging

Links follow the same merge semantics as related resources:

  • All matching presentations contribute links.

  • Same linkId with higher specificity wins (override).

  • Optional fields can be inherited from less-specific definitions when omitted by the winning definition.

  • Different linkId values from different presentations are both included (append).

  • The optional order field controls display order. Higher values are shown first.

Events

Configures the "Events" section of the highlights page. Controls whether to show the section at all and, if so, events for which "related resources" to include. The relatedResourceQuery and exludedRelatedResourcesQuery fields are template strings that supports ${CEL_EXPRESSION} placeholders.

highlight:
  events:
    showEvents: true
    relatedResourcesQuery: 'withNeighborsOf(direction = "both", components = (id = "${identifiers[0]}"), levels = "1") AND type IN ("endpoint", "pod")'
    excludedRelatedResourcesQuery: 'type = "service"'

Merging

Events use the following merge semantics:

  • All matching presentations can contribute components to include events for

  • The most specific presentation determines whether the event section is shown at all

More specific presentations can suppress related resources from more generic presentations by specifying the excludedRelatedResourcesQuery topology query.