@red-hat-developer-hub/backstage-plugin-scorecard 4.2.0 → 4.3.0

package/CHANGELOG.md

@@ -1,5 +1,52 @@
 # @red-hat-developer-hub/backstage-plugin-scorecard
 
+## 4.3.0
+
+### Minor Changes
+
+- c380e6b: Skip scalar aggregation threshold coloring when no successful samples contributed (`total` is 0). Return a null display color and keep the card grey fallback. Scalar aggregation responses now include `aggregationChartDisplayColor` (threshold-derived chart color, or `null` when `total` is 0).
+
+  **BREAKING**: Changed types in `scorecard-common` module:
+
+  - `WeightedStatusScoreAggregationResult.aggregationChartDisplayColor` widened from `string` to `string | null`.
+  - `ScalarAggregationResult` gained a required `aggregationChartDisplayColor: string | null` property.
+
+  These changes are intentional: the API can return `null` when no samples contribute, and scalar KPI results now expose the same display-color field as weighted status score aggregations.
+
+- 628533c: Add optional `titleKey` and `descriptionKey` on Scorecard layout groups so group titles and descriptions from app-config can be translated, with fallback to the configured English strings.
+- a1c3eb3: Updated DORA Mean Time to Restore to Median Time to Restore.
+- ff6683f: Add DORA metrics and a collectors framework for composing datasource data into metrics.
+
+  - New `@red-hat-developer-hub/backstage-plugin-scorecard-backend-module-dora` with Deployment Frequency, Median Lead Time for Changes, Mean Time to Restore, and Change Failure Rate
+  - New data collectors used by DORA: GitHub deployments, deployment workflow runs, and deployment pull requests; Jira incidents
+  - Metric time-series API `/metrics/catalog/:kind/:namespace/:name/time-series`
+  - Adds `defaultVisualization` to Metric metadata for sparkline
+
+- 08e6312: Render scalar aggregation KPI cards from result shape (`ScalarStatCard`) for sum, average, min, max, and count, including threshold status and an unsupported-shape fallback.
+- f3f71a5: Add unit to metric and display it in threshold legend
+- a7a1b4a: Backstage version bump to v1.54.6
+
+### Patch Changes
+
+- 1e93f4e: Add `HomePageWidgetBlueprint` for the README filecheck aggregated card so it appears in the NFS homepage add-widget dialog alongside the existing LICENSE and CODEOWNERS widgets.
+- 0754805: Scalar aggregation KPI cards now use `result.aggregationChartDisplayColor` from the backend instead of re-evaluating threshold expressions on the frontend. Min/max scalar drill-down pages now default-sort the entities table by metric value (ascending for min, descending for max).
+- 47ac76d: Export public `ScalarAggregationType` for scalar aggregation KPI types (`sum`, `average`, `count`, `min`, `max`).
+
+  Add legacy app E2E coverage for scalar and statusGrouped homepage aggregation KPI cards, including reusable Playwright registration helpers and legacy homepage widget entries for scalar KPIs.
+
+- Updated dependencies [9c1936e]
+- Updated dependencies [2bb0ec5]
+- Updated dependencies [485fadb]
+- Updated dependencies [befccc2]
+- Updated dependencies [c380e6b]
+- Updated dependencies [fea86e8]
+- Updated dependencies [ff6683f]
+- Updated dependencies [ecb789b]
+- Updated dependencies [47ac76d]
+- Updated dependencies [f3f71a5]
+- Updated dependencies [a7a1b4a]
+  - @red-hat-developer-hub/backstage-plugin-scorecard-common@4.3.0
+
 ## 4.2.0
 
 ### Minor Changes

package/README.md

@@ -9,7 +9,7 @@ For NFS, register the default `scorecardPlugin` plus `scorecardTranslationsModul
 **Features:**
 
 - **Entity scorecard tab** — View scorecard metrics on catalog entity pages (components, websites, etc.).
-- **Scorecard homepage card** — Show aggregated KPIs on the home page (e.g. GitHub open PRs, Jira open issues). Supports **`statusGrouped`** (multi-slice pie) and **`weightedStatusScore`** (weighted health donut) KPI types configured under **`scorecard.aggregationKPIs`**. Scalar types (`sum`, `average`, `max`, `min`, `count`) are supported by the backend API but not yet rendered by the bundled homepage card (see [Homepage scorecard cards](#homepage-scorecard-cards)).
+- **Scorecard homepage card** — Show aggregated KPIs on the home page (e.g. GitHub open PRs, Jira open issues). Supports **`statusGrouped`** (multi-slice pie), **`weightedStatusScore`** (weighted health donut), and scalar types (`sum`, `average`, `max`, `min`, `count`) configured under **`scorecard.aggregationKPIs`**.
 - **Scorecard Entities page** — Drill down from an aggregated metric to see the list of entities contributing to that metric, with entity-level values and status, so you can identify services impacting the KPI and investigate issues.
 - **Metric group cards (grid layout)** — Group related metrics into cards with threshold bucket tiles, a filterable/sortable data sources dialog, and a Masonry grid layout. Enabled via app-config.yaml.
 
@@ -133,7 +133,9 @@ To align with the legacy EntityPage (Scorecard on component pages and default en
              groups:
                codeQuality:
                  title: 'Code Quality'
+                 titleKey: groups.codeQuality.title
                  description: 'SonarQube code quality metrics'
+                 descriptionKey: groups.codeQuality.description
                  metrics:
                    - sonarqube.reliabilityIssues
                    - sonarqube.codeCoverage
@@ -147,11 +149,13 @@ To align with the legacy EntityPage (Scorecard on component pages and default en
 
    **Groups config schema:**
 
-   | Field         | Type       | Required | Description                                          |
-   | ------------- | ---------- | -------- | ---------------------------------------------------- |
-   | `title`       | `string`   | Yes      | Display title for the group card.                    |
-   | `description` | `string`   | No       | Optional description shown below the title.          |
-   | `metrics`     | `string[]` | Yes      | Ordered list of metric IDs to include in this group. |
+   | Field            | Type       | Required | Description                                                                                      |
+   | ---------------- | ---------- | -------- | ------------------------------------------------------------------------------------------------ |
+   | `title`          | `string`   | Yes      | Display title for the group card. Used when `titleKey` is omitted or the translation is missing. |
+   | `titleKey`       | `string`   | No       | Translation key under `plugin.scorecard` (for example `groups.codeQuality.title`).               |
+   | `description`    | `string`   | No       | Optional description shown below the title. Used when `descriptionKey` is omitted or missing.    |
+   | `descriptionKey` | `string`   | No       | Translation key under `plugin.scorecard` (for example `groups.codeQuality.description`).         |
+   | `metrics`        | `string[]` | Yes      | Ordered list of metric IDs to include in this group.                                             |
 
    **Behavior:**
 
@@ -239,9 +243,54 @@ To align with the legacy EntityPage (Scorecard on component pages and default en
                    sm: { w: 4, h: 6, x: 8 }
                    xs: { w: 4, h: 6, x: 8 }
                    xxs: { w: 4, h: 6, x: 8 }
+               AggregatedCardWithMaxOpenPrs:
+                 priority: 480
+                 breakpoints:
+                   xl: { w: 4, h: 6 }
+                   lg: { w: 4, h: 6 }
+                   md: { w: 4, h: 6 }
+                   sm: { w: 4, h: 6 }
+                   xs: { w: 4, h: 6 }
+                   xxs: { w: 4, h: 6 }
+               AggregatedCardWithMinOpenPrs:
+                 priority: 490
+                 breakpoints:
+                   xl: { w: 4, h: 6, x: 4 }
+                   lg: { w: 4, h: 6, x: 4 }
+                   md: { w: 4, h: 6, x: 4 }
+                   sm: { w: 4, h: 6, x: 4 }
+                   xs: { w: 4, h: 6, x: 4 }
+                   xxs: { w: 4, h: 6, x: 4 }
+               AggregatedCardWithTotalOpenBugs:
+                 priority: 500
+                 breakpoints:
+                   xl: { w: 4, h: 6, x: 8 }
+                   lg: { w: 4, h: 6, x: 8 }
+                   md: { w: 4, h: 6, x: 8 }
+                   sm: { w: 4, h: 6, x: 8 }
+                   xs: { w: 4, h: 6, x: 8 }
+                   xxs: { w: 4, h: 6, x: 8 }
+               AggregatedCardWithEntitiesWithOpenPrs:
+                 priority: 510
+                 breakpoints:
+                   xl: { w: 4, h: 6 }
+                   lg: { w: 4, h: 6 }
+                   md: { w: 4, h: 6 }
+                   sm: { w: 4, h: 6 }
+                   xs: { w: 4, h: 6 }
+                   xxs: { w: 4, h: 6 }
+               AggregatedCardWithAvgOpenPrs:
+                 priority: 520
+                 breakpoints:
+                   xl: { w: 4, h: 6, x: 4 }
+                   lg: { w: 4, h: 6, x: 4 }
+                   md: { w: 4, h: 6, x: 4 }
+                   sm: { w: 4, h: 6, x: 4 }
+                   xs: { w: 4, h: 6, x: 4 }
+                   xxs: { w: 4, h: 6, x: 4 }
    ```
 
-   The home module contributes seven widgets:
+   The home module contributes twelve widgets:
 
    - `AggregatedCardWithDeprecatedMetricId` (title: **Scorecard: With deprecated metricId property (Jira)**)
    - `AggregatedCardWithDefaultAggregation` (title: **Scorecard: With default aggregation config (GitHub)**)
@@ -250,6 +299,11 @@ To align with the legacy EntityPage (Scorecard on component pages and default en
    - `AggregatedCardWithGithubFilecheckLicense` (title: **Scorecard: LICENSE file exists**)
    - `AggregatedCardWithGithubFilecheckCodeowners` (title: **Scorecard: CODEOWNERS file exists**)
    - `AggregatedCardWithGithubOpenPrsWeighted` (title: **Scorecard: GitHub open PRs (weighted health)**)
+   - `AggregatedCardWithMaxOpenPrs` (title: **Scorecard: Maximum open PRs**)
+   - `AggregatedCardWithMinOpenPrs` (title: **Scorecard: Minimum open PRs**)
+   - `AggregatedCardWithTotalOpenBugs` (title: **Scorecard: Total open bugs**)
+   - `AggregatedCardWithEntitiesWithOpenPrs` (title: **Scorecard: Entities with open PRs**)
+   - `AggregatedCardWithAvgOpenPrs` (title: **Scorecard: Average open PRs**)
 
    These widgets render the `ScorecardHomepageCard` component used in legacy apps, preconfigured with different aggregation/metric configurations.
 
@@ -280,6 +334,11 @@ The default `scorecardPlugin` registers the Scorecard page, API, entity tab, lay
 | `home-page-widget:scorecard/scorecard-github-filecheck-license`    | Homepage widget for file check "License".                                                                                        |
 | `home-page-widget:scorecard/scorecard-github-filecheck-codeowners` | Homepage widget for file check "Codeowners".                                                                                     |
 | `home-page-widget:scorecard/scorecard-github-open-prs-weighted`    | Homepage widget for weighted GitHub open PRs health.                                                                             |
+| `home-page-widget:scorecard/scorecard-max-open-prs`                | Homepage widget for scalar max open PRs.                                                                                         |
+| `home-page-widget:scorecard/scorecard-min-open-prs`                | Homepage widget for scalar min open PRs.                                                                                         |
+| `home-page-widget:scorecard/scorecard-total-open-bugs`             | Homepage widget for scalar sum of open bugs.                                                                                     |
+| `home-page-widget:scorecard/scorecard-entities-with-open-prs`      | Homepage widget for scalar count of entities with open PRs.                                                                      |
+| `home-page-widget:scorecard/scorecard-avg-open-prs`                | Homepage widget for scalar average open PRs.                                                                                     |
 
 ##### Migration notes (NFS graduation)
 
@@ -458,11 +517,11 @@ Supported scorecard aggregation types (see [Entity Aggregation — Aggregation t
 - [`weightedStatusScore`](../scorecard-backend/docs/aggregation.md#weighted-status-score-type) — weighted portfolio health percentage (donut); requires `options.statusScores`.
 - Scalar types ([`sum`](../scorecard-backend/docs/aggregation.md#sum-type), [`average`](../scorecard-backend/docs/aggregation.md#average-type), [`max`](../scorecard-backend/docs/aggregation.md#max-type), [`min`](../scorecard-backend/docs/aggregation.md#min-type), [`count`](../scorecard-backend/docs/aggregation.md#count-type)) — roll up latest numeric metric values; number metrics only. Optional [`filter.status`](../scorecard-backend/docs/aggregation.md#status-filter-scalar-types) limits the rollup to a threshold status.
 
-**Scalar KPI types** (`sum`, `average`, `max`, `min`, `count`) are fully supported by **`GET /aggregations/:aggregationId`**, including optional **`filter.status`** and **`options.thresholds`**. The bundled **`ScorecardHomepageCard`** / **`AggregatedMetricCard`** only renders **`statusGrouped`** and **`weightedStatusScore`**; scalar types show an unsupported-type error panel. Build a custom card to display **`result.value`** and classify it with **`result.thresholds`**.
+**Scalar KPI types** (`sum`, `average`, `max`, `min`, `count`) are fully supported by **`GET /aggregations/:aggregationId`**, including optional **`filter.status`** and **`options.thresholds`**. **`AggregatedMetricCard`** chooses the UI from the **result shape**: a numeric `value` renders **`ScalarStatCard`** (large number, optional description, aggregation-type label, tile color from **`result.aggregationChartDisplayColor`**); a `values` array renders the existing pie/donut cards; anything else shows **`UnsupportedAggregationType`**. Unknown scalar type names still render **`ScalarStatCard`** when the payload is scalar-shaped.
 
 **Terminology:** Scalar **`average`** (mean of numeric metric values) is distinct from the former weighted KPI type also named `average`, which was renamed to **`weightedStatusScore`**. Update app-config **`type: average`** entries for weighted health scoring to **`type: weightedStatusScore`** and migrate API consumers from **`result.averageScore`** to **`result.weightedStatusScore`**.
 
-The NFS example widget **`AggregatedCardWithGithubOpenPrs`** uses **`aggregationId: maxOpenPrs`** (scalar **`max`** KPI). Uncomment and configure **`maxOpenPrs`** under **`scorecard.aggregationKPIs`** in app-config to exercise the API; expect the unsupported-type panel until scalar homepage UI is added.
+Configure a scalar KPI such as **`maxOpenPrs`** under **`scorecard.aggregationKPIs`** and pass that id as **`aggregationId`** to **`ScorecardHomepageCard`** to render the aggregated value.
 
 #### Card props
 
@@ -550,14 +609,19 @@ Translation keys follow this pattern:
 
 - **Metric titles**: `metric.{metric-id}.title`
 - **Metric descriptions**: `metric.{metric-id}.description`
+- **Layout group titles**: set `titleKey` on the group in app-config (for example `groups.codeQuality.title`)
+- **Layout group descriptions**: set `descriptionKey` on the group (for example `groups.codeQuality.description`)
+
+Use the same `metric.{id}.{field}` pattern with a **KPI id** as `{metric-id}` when localizing **`aggregationKPIs`** titles (for example **`metric.openIssuesKpi.title`**).
 
-Use the same pattern with a **KPI id** as `{metric-id}` when localizing **`aggregationKPIs`** titles (for example **`metric.openIssuesKpi.title`**).
+Group titles and descriptions do **not** use the `metric.{id}.{field}` convention. They are customer-defined in `scorecard-layout` config, so you pass explicit `titleKey` / `descriptionKey` values. Provide translations in plugin locale files or via RHDH `i18n.overrides` under `plugin.scorecard`. If a key is omitted or not found, the UI shows the group's `title` / `description` strings and never the raw key.
 
 ### 3. Fallback Behavior
 
 If a translation key is not found, the plugin will automatically fall back to:
 
 - The original `title` and `description` values from the metric definition
+- For layout groups: the `title` and `description` values from app-config
 - For thresholds: capitalized versions of the threshold keys
 
 ### Example: Adding GitHub Open PRs Translation

package/dist/alpha.d.ts

@@ -34,6 +34,14 @@ declare const scorecardTranslationRef: _backstage_frontend_plugin_api.Translatio
     readonly "errors.noDataFoundMessage": string;
     readonly "errors.unsupportedAggregationType": string;
     readonly "errors.authenticationErrorMessage": string;
+    readonly "metric.dora.deploymentFrequency.title": string;
+    readonly "metric.dora.deploymentFrequency.description": string;
+    readonly "metric.dora.medianLeadTimeForChanges.title": string;
+    readonly "metric.dora.medianLeadTimeForChanges.description": string;
+    readonly "metric.dora.changeFailureRate.title": string;
+    readonly "metric.dora.changeFailureRate.description": string;
+    readonly "metric.dora.medianTimeToRestore.title": string;
+    readonly "metric.dora.medianTimeToRestore.description": string;
     readonly "metric.github.openPRs.title": string;
     readonly "metric.github.openPRs.description": string;
     readonly "metric.jira.openIssues.title": string;
@@ -77,9 +85,17 @@ declare const scorecardTranslationRef: _backstage_frontend_plugin_api.Translatio
     readonly "metric.drillDownCalculationFailures": string;
     readonly "metric.homepageEntityHealthRatio": string;
     readonly "metric.homepageEntityCalculationHealth": string;
+    readonly "aggregation.min": string;
+    readonly "aggregation.max": string;
+    readonly "aggregation.sum": string;
+    readonly "aggregation.count": string;
+    readonly "aggregation.average": string;
     readonly "thresholds.success": string;
     readonly "thresholds.warning": string;
     readonly "thresholds.error": string;
+    readonly "thresholds.elite": string;
+    readonly "thresholds.medium": string;
+    readonly "thresholds.low": string;
     readonly "thresholds.exist": string;
     readonly "thresholds.missing": string;
     readonly "thresholds.noEntities": string;

package/dist/blueprints/ScorecardLayoutBlueprint.esm.js

@@ -1,5 +1,6 @@
 import { createElement } from 'react';
 import { createExtensionDataRef, createExtensionBlueprint, coreExtensionData, ExtensionBoundary } from '@backstage/frontend-plugin-api';
+import { z } from 'zod';
 
 const scorecardLayoutTitleDataRef = createExtensionDataRef().with({ id: "scorecard.layout-title" });
 const ScorecardEntityContentLayoutBlueprint = createExtensionBlueprint({
@@ -12,16 +13,17 @@ const ScorecardEntityContentLayoutBlueprint = createExtensionBlueprint({
   dataRefs: {
     title: scorecardLayoutTitleDataRef
   },
-  config: {
-    schema: {
-      groups: (schema) => schema.record(
-        schema.object({
-          title: schema.string(),
-          description: schema.string().optional(),
-          metrics: schema.array(schema.string())
-        })
-      ).optional().default({})
-    }
+  configSchema: {
+    groups: z.record(
+      z.string(),
+      z.object({
+        title: z.string(),
+        titleKey: z.string().optional(),
+        description: z.string().optional(),
+        descriptionKey: z.string().optional(),
+        metrics: z.array(z.string())
+      })
+    ).optional().default({})
   },
   *factory(params, { config, node }) {
     yield scorecardLayoutTitleDataRef(params.title);

package/dist/blueprints/ScorecardLayoutBlueprint.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScorecardLayoutBlueprint.esm.js","sources":["../../src/blueprints/ScorecardLayoutBlueprint.ts"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { ComponentType, createElement } from 'react';\nimport {\n  coreExtensionData,\n  createExtensionBlueprint,\n  createExtensionDataRef,\n  ExtensionBoundary,\n} from '@backstage/frontend-plugin-api';\n\n/**\n * Props for custom Scorecard entity-tab layout components.\n *\n * @public\n */\nexport interface ScorecardLayoutProps {\n  /**\n   * Metric groups to render, keyed by group id.\n   */\n  groups: Record<\n    string,\n    { title: string; description?: string; metrics: string[] }\n  >;\n}\n\n/**\n * Extension data ref carrying the human-readable layout title\n * (e.g. \"Grid\", \"List\") so the entity tab can build a toggle.\n *\n * @public\n */\nexport const scorecardLayoutTitleDataRef =\n  createExtensionDataRef<string>().with({ id: 'scorecard.layout-title' });\n\n/**\n * Blueprint for creating scorecard layout extensions.\n *\n * Each layout is a separate extension that attaches to the Scorecard entity tab.\n * Platform engineers enable/disable individual layouts via app-config.yaml;\n * when multiple layouts are enabled the tab renders a toggle to switch between them.\n *\n * @public\n */\nexport const ScorecardEntityContentLayoutBlueprint = createExtensionBlueprint({\n  kind: 'scorecard-layout',\n  attachTo: {\n    id: 'entity-content:scorecard/entity-content-scorecard',\n    input: 'layouts',\n  },\n  output: [coreExtensionData.reactElement, scorecardLayoutTitleDataRef],\n  dataRefs: {\n    title: scorecardLayoutTitleDataRef,\n  },\n  config: {\n    schema: {\n      groups: schema =>\n        schema\n          .record(\n            schema.object({\n              title: schema.string(),\n              description: schema.string().optional(),\n              metrics: schema.array(schema.string()),\n            }),\n          )\n          .optional()\n          .default({}),\n    },\n  },\n  *factory(\n    params: {\n      title: string;\n      loader: () => Promise<ComponentType<ScorecardLayoutProps>>;\n    },\n    { config, node },\n  ) {\n    yield scorecardLayoutTitleDataRef(params.title);\n    yield coreExtensionData.reactElement(\n      ExtensionBoundary.lazy(node, async () => {\n        const Component = await params.loader();\n        return createElement(Component, {\n          groups: config.groups,\n        });\n      }),\n    );\n  },\n});\n"],"names":[],"mappings":";;;AA6CO,MAAM,8BACX,sBAAA,EAA+B,CAAE,KAAK,EAAE,EAAA,EAAI,0BAA0B;AAWjE,MAAM,wCAAwC,wBAAA,CAAyB;AAAA,EAC5E,IAAA,EAAM,kBAAA;AAAA,EACN,QAAA,EAAU;AAAA,IACR,EAAA,EAAI,mDAAA;AAAA,IACJ,KAAA,EAAO;AAAA,GACT;AAAA,EACA,MAAA,EAAQ,CAAC,iBAAA,CAAkB,YAAA,EAAc,2BAA2B,CAAA;AAAA,EACpE,QAAA,EAAU;AAAA,IACR,KAAA,EAAO;AAAA,GACT;AAAA,EACA,MAAA,EAAQ;AAAA,IACN,MAAA,EAAQ;AAAA,MACN,MAAA,EAAQ,YACN,MAAA,CACG,MAAA;AAAA,QACC,OAAO,MAAA,CAAO;AAAA,UACZ,KAAA,EAAO,OAAO,MAAA,EAAO;AAAA,UACrB,WAAA,EAAa,MAAA,CAAO,MAAA,EAAO,CAAE,QAAA,EAAS;AAAA,UACtC,OAAA,EAAS,MAAA,CAAO,KAAA,CAAM,MAAA,CAAO,QAAQ;AAAA,SACtC;AAAA,OACH,CACC,QAAA,EAAS,CACT,OAAA,CAAQ,EAAE;AAAA;AACjB,GACF;AAAA,EACA,CAAC,OAAA,CACC,MAAA,EAIA,EAAE,MAAA,EAAQ,MAAK,EACf;AACA,IAAA,MAAM,2BAAA,CAA4B,OAAO,KAAK,CAAA;AAC9C,IAAA,MAAM,iBAAA,CAAkB,YAAA;AAAA,MACtB,iBAAA,CAAkB,IAAA,CAAK,IAAA,EAAM,YAAY;AACvC,QAAA,MAAM,SAAA,GAAY,MAAM,MAAA,CAAO,MAAA,EAAO;AACtC,QAAA,OAAO,cAAc,SAAA,EAAW;AAAA,UAC9B,QAAQ,MAAA,CAAO;AAAA,SAChB,CAAA;AAAA,MACH,CAAC;AAAA,KACH;AAAA,EACF;AACF,CAAC;;;;"}
+{"version":3,"file":"ScorecardLayoutBlueprint.esm.js","sources":["../../src/blueprints/ScorecardLayoutBlueprint.ts"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { ComponentType, createElement } from 'react';\nimport {\n  coreExtensionData,\n  createExtensionBlueprint,\n  createExtensionDataRef,\n  ExtensionBoundary,\n} from '@backstage/frontend-plugin-api';\nimport { z } from 'zod';\n\n/**\n * Props for custom Scorecard entity-tab layout components.\n *\n * @public\n */\nexport interface ScorecardLayoutProps {\n  /**\n   * Metric groups to render, keyed by group id.\n   */\n  groups: Record<\n    string,\n    {\n      title: string;\n      titleKey?: string;\n      description?: string;\n      descriptionKey?: string;\n      metrics: string[];\n    }\n  >;\n}\n\n/**\n * Extension data ref carrying the human-readable layout title\n * (e.g. \"Grid\", \"List\") so the entity tab can build a toggle.\n *\n * @public\n */\nexport const scorecardLayoutTitleDataRef =\n  createExtensionDataRef<string>().with({ id: 'scorecard.layout-title' });\n\n/**\n * Blueprint for creating scorecard layout extensions.\n *\n * Each layout is a separate extension that attaches to the Scorecard entity tab.\n * Platform engineers enable/disable individual layouts via app-config.yaml;\n * when multiple layouts are enabled the tab renders a toggle to switch between them.\n *\n * @public\n */\nexport const ScorecardEntityContentLayoutBlueprint = createExtensionBlueprint({\n  kind: 'scorecard-layout',\n  attachTo: {\n    id: 'entity-content:scorecard/entity-content-scorecard',\n    input: 'layouts',\n  },\n  output: [coreExtensionData.reactElement, scorecardLayoutTitleDataRef],\n  dataRefs: {\n    title: scorecardLayoutTitleDataRef,\n  },\n  configSchema: {\n    groups: z\n      .record(\n        z.string(),\n        z.object({\n          title: z.string(),\n          titleKey: z.string().optional(),\n          description: z.string().optional(),\n          descriptionKey: z.string().optional(),\n          metrics: z.array(z.string()),\n        }),\n      )\n      .optional()\n      .default({}),\n  },\n  *factory(\n    params: {\n      title: string;\n      loader: () => Promise<ComponentType<ScorecardLayoutProps>>;\n    },\n    { config, node },\n  ) {\n    yield scorecardLayoutTitleDataRef(params.title);\n    yield coreExtensionData.reactElement(\n      ExtensionBoundary.lazy(node, async () => {\n        const Component = await params.loader();\n        return createElement(Component, {\n          groups: config.groups,\n        });\n      }),\n    );\n  },\n});\n"],"names":[],"mappings":";;;;AAoDO,MAAM,8BACX,sBAAA,EAA+B,CAAE,KAAK,EAAE,EAAA,EAAI,0BAA0B;AAWjE,MAAM,wCAAwC,wBAAA,CAAyB;AAAA,EAC5E,IAAA,EAAM,kBAAA;AAAA,EACN,QAAA,EAAU;AAAA,IACR,EAAA,EAAI,mDAAA;AAAA,IACJ,KAAA,EAAO;AAAA,GACT;AAAA,EACA,MAAA,EAAQ,CAAC,iBAAA,CAAkB,YAAA,EAAc,2BAA2B,CAAA;AAAA,EACpE,QAAA,EAAU;AAAA,IACR,KAAA,EAAO;AAAA,GACT;AAAA,EACA,YAAA,EAAc;AAAA,IACZ,QAAQ,CAAA,CACL,MAAA;AAAA,MACC,EAAE,MAAA,EAAO;AAAA,MACT,EAAE,MAAA,CAAO;AAAA,QACP,KAAA,EAAO,EAAE,MAAA,EAAO;AAAA,QAChB,QAAA,EAAU,CAAA,CAAE,MAAA,EAAO,CAAE,QAAA,EAAS;AAAA,QAC9B,WAAA,EAAa,CAAA,CAAE,MAAA,EAAO,CAAE,QAAA,EAAS;AAAA,QACjC,cAAA,EAAgB,CAAA,CAAE,MAAA,EAAO,CAAE,QAAA,EAAS;AAAA,QACpC,OAAA,EAAS,CAAA,CAAE,KAAA,CAAM,CAAA,CAAE,QAAQ;AAAA,OAC5B;AAAA,KACH,CACC,QAAA,EAAS,CACT,OAAA,CAAQ,EAAE;AAAA,GACf;AAAA,EACA,CAAC,OAAA,CACC,MAAA,EAIA,EAAE,MAAA,EAAQ,MAAK,EACf;AACA,IAAA,MAAM,2BAAA,CAA4B,OAAO,KAAK,CAAA;AAC9C,IAAA,MAAM,iBAAA,CAAkB,YAAA;AAAA,MACtB,iBAAA,CAAkB,IAAA,CAAK,IAAA,EAAM,YAAY;AACvC,QAAA,MAAM,SAAA,GAAY,MAAM,MAAA,CAAO,MAAA,EAAO;AACtC,QAAA,OAAO,cAAc,SAAA,EAAW;AAAA,UAC9B,QAAQ,MAAA,CAAO;AAAA,SAChB,CAAA;AAAA,MACH,CAAC;AAAA,KACH;AAAA,EACF;AACF,CAAC;;;;"}

package/dist/components/AggregatedMetricCards/AggregatedMetricCard.esm.js

@@ -1,19 +1,26 @@
 import { jsx } from 'react/jsx-runtime';
-import { aggregationTypes } from '@red-hat-developer-hub/backstage-plugin-scorecard-common';
 import { StatusGroupedCardComponent } from './StatusGroupedCard/StatusGroupedCardComponent.esm.js';
 import { WeightedStatusScoreCardComponent } from './WeightedStatusScoreCard/WeightedStatusScoreCardComponent.esm.js';
+import { ScalarStatCard } from './ScalarStatCard/ScalarStatCard.esm.js';
 import { UnsupportedAggregationType } from './UnsupportedAggregationType.esm.js';
+import 'date-fns';
+import { isScalarAggregationResult, isWeightedStatusScoreResult, isDistributionAggregationResult } from '../../utils/isScalarAggregation.esm.js';
+import '@red-hat-developer-hub/backstage-plugin-scorecard-common';
 
-const isStatusGroupedCardProps = (props) => props.scorecard.metadata.aggregationType === aggregationTypes.statusGrouped;
-const isWeightedStatusScoreCardProps = (props) => props.scorecard.metadata.aggregationType === aggregationTypes.weightedStatusScore;
+const isScalarStatCardProps = (props) => isScalarAggregationResult(props.scorecard.result);
+const isWeightedStatusScoreCardProps = (props) => isWeightedStatusScoreResult(props.scorecard.result);
+const isStatusGroupedCardProps = (props) => isDistributionAggregationResult(props.scorecard.result);
 const AggregatedMetricCard = (props) => {
   const { cardTitle, description, dataTestId, scorecard } = props;
-  if (isStatusGroupedCardProps(props)) {
-    return /* @__PURE__ */ jsx(StatusGroupedCardComponent, { ...props });
+  if (isScalarStatCardProps(props)) {
+    return /* @__PURE__ */ jsx(ScalarStatCard, { ...props });
   }
   if (isWeightedStatusScoreCardProps(props)) {
     return /* @__PURE__ */ jsx(WeightedStatusScoreCardComponent, { ...props });
   }
+  if (isStatusGroupedCardProps(props)) {
+    return /* @__PURE__ */ jsx(StatusGroupedCardComponent, { ...props });
+  }
   return /* @__PURE__ */ jsx(
     UnsupportedAggregationType,
     {

package/dist/components/AggregatedMetricCards/AggregatedMetricCard.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"AggregatedMetricCard.esm.js","sources":["../../../src/components/AggregatedMetricCards/AggregatedMetricCard.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  aggregationTypes,\n  type AggregatedMetricResult,\n} from '@red-hat-developer-hub/backstage-plugin-scorecard-common';\nimport { StatusGroupedCardComponent } from './StatusGroupedCard/StatusGroupedCardComponent';\nimport { WeightedStatusScoreCardComponent } from './WeightedStatusScoreCard/WeightedStatusScoreCardComponent';\nimport { UnsupportedAggregationType } from './UnsupportedAggregationType';\n\nimport type { WeightedStatusScoreCardComponentProps } from './WeightedStatusScoreCard/types';\nimport type { StatusGroupedCardComponentProps } from './StatusGroupedCard/types';\nimport type { AggregatedMetricCardBaseProps } from './types';\n\ntype AggregatedMetricCardProps = AggregatedMetricCardBaseProps & {\n  scorecard: AggregatedMetricResult;\n};\n\nconst isStatusGroupedCardProps = (\n  props: AggregatedMetricCardProps,\n): props is StatusGroupedCardComponentProps =>\n  props.scorecard.metadata.aggregationType === aggregationTypes.statusGrouped;\n\nconst isWeightedStatusScoreCardProps = (\n  props: AggregatedMetricCardProps,\n): props is WeightedStatusScoreCardComponentProps =>\n  props.scorecard.metadata.aggregationType ===\n  aggregationTypes.weightedStatusScore;\n\nexport const AggregatedMetricCard = (props: AggregatedMetricCardProps) => {\n  const { cardTitle, description, dataTestId, scorecard } = props;\n\n  if (isStatusGroupedCardProps(props)) {\n    return <StatusGroupedCardComponent {...props} />;\n  }\n  if (isWeightedStatusScoreCardProps(props)) {\n    return <WeightedStatusScoreCardComponent {...props} />;\n  }\n  return (\n    <UnsupportedAggregationType\n      cardTitle={cardTitle}\n      description={description}\n      dataTestId={dataTestId}\n      aggregationType={String(scorecard.metadata.aggregationType)}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;AAgCA,MAAM,2BAA2B,CAC/B,KAAA,KAEA,MAAM,SAAA,CAAU,QAAA,CAAS,oBAAoB,gBAAA,CAAiB,aAAA;AAEhE,MAAM,iCAAiC,CACrC,KAAA,KAEA,MAAM,SAAA,CAAU,QAAA,CAAS,oBACzB,gBAAA,CAAiB,mBAAA;AAEZ,MAAM,oBAAA,GAAuB,CAAC,KAAA,KAAqC;AACxE,EAAA,MAAM,EAAE,SAAA,EAAW,WAAA,EAAa,UAAA,EAAY,WAAU,GAAI,KAAA;AAE1D,EAAA,IAAI,wBAAA,CAAyB,KAAK,CAAA,EAAG;AACnC,IAAA,uBAAO,GAAA,CAAC,0BAAA,EAAA,EAA4B,GAAG,KAAA,EAAO,CAAA;AAAA,EAChD;AACA,EAAA,IAAI,8BAAA,CAA+B,KAAK,CAAA,EAAG;AACzC,IAAA,uBAAO,GAAA,CAAC,gCAAA,EAAA,EAAkC,GAAG,KAAA,EAAO,CAAA;AAAA,EACtD;AACA,EAAA,uBACE,GAAA;AAAA,IAAC,0BAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MACA,eAAA,EAAiB,MAAA,CAAO,SAAA,CAAU,QAAA,CAAS,eAAe;AAAA;AAAA,GAC5D;AAEJ;;;;"}
+{"version":3,"file":"AggregatedMetricCard.esm.js","sources":["../../../src/components/AggregatedMetricCards/AggregatedMetricCard.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { AggregatedMetricResult } from '@red-hat-developer-hub/backstage-plugin-scorecard-common';\nimport { StatusGroupedCardComponent } from './StatusGroupedCard/StatusGroupedCardComponent';\nimport { WeightedStatusScoreCardComponent } from './WeightedStatusScoreCard/WeightedStatusScoreCardComponent';\nimport { ScalarStatCard } from './ScalarStatCard/ScalarStatCard';\nimport { UnsupportedAggregationType } from './UnsupportedAggregationType';\nimport {\n  isDistributionAggregationResult,\n  isScalarAggregationResult,\n  isWeightedStatusScoreResult,\n} from '../../utils';\n\nimport type { WeightedStatusScoreCardComponentProps } from './WeightedStatusScoreCard/types';\nimport type { StatusGroupedCardComponentProps } from './StatusGroupedCard/types';\nimport type { ScalarStatCardProps } from './ScalarStatCard/types';\nimport type { AggregatedMetricCardBaseProps } from './types';\n\ntype AggregatedMetricCardProps = AggregatedMetricCardBaseProps & {\n  scorecard: AggregatedMetricResult;\n};\n\nconst isScalarStatCardProps = (\n  props: AggregatedMetricCardProps,\n): props is ScalarStatCardProps =>\n  isScalarAggregationResult(props.scorecard.result);\n\nconst isWeightedStatusScoreCardProps = (\n  props: AggregatedMetricCardProps,\n): props is WeightedStatusScoreCardComponentProps =>\n  isWeightedStatusScoreResult(props.scorecard.result);\n\nconst isStatusGroupedCardProps = (\n  props: AggregatedMetricCardProps,\n): props is StatusGroupedCardComponentProps =>\n  isDistributionAggregationResult(props.scorecard.result);\n\nexport const AggregatedMetricCard = (props: AggregatedMetricCardProps) => {\n  const { cardTitle, description, dataTestId, scorecard } = props;\n\n  if (isScalarStatCardProps(props)) {\n    return <ScalarStatCard {...props} />;\n  }\n  if (isWeightedStatusScoreCardProps(props)) {\n    return <WeightedStatusScoreCardComponent {...props} />;\n  }\n  if (isStatusGroupedCardProps(props)) {\n    return <StatusGroupedCardComponent {...props} />;\n  }\n  return (\n    <UnsupportedAggregationType\n      cardTitle={cardTitle}\n      description={description}\n      dataTestId={dataTestId}\n      aggregationType={String(scorecard.metadata.aggregationType)}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAoCA,MAAM,wBAAwB,CAC5B,KAAA,KAEA,yBAAA,CAA0B,KAAA,CAAM,UAAU,MAAM,CAAA;AAElD,MAAM,iCAAiC,CACrC,KAAA,KAEA,2BAAA,CAA4B,KAAA,CAAM,UAAU,MAAM,CAAA;AAEpD,MAAM,2BAA2B,CAC/B,KAAA,KAEA,+BAAA,CAAgC,KAAA,CAAM,UAAU,MAAM,CAAA;AAEjD,MAAM,oBAAA,GAAuB,CAAC,KAAA,KAAqC;AACxE,EAAA,MAAM,EAAE,SAAA,EAAW,WAAA,EAAa,UAAA,EAAY,WAAU,GAAI,KAAA;AAE1D,EAAA,IAAI,qBAAA,CAAsB,KAAK,CAAA,EAAG;AAChC,IAAA,uBAAO,GAAA,CAAC,cAAA,EAAA,EAAgB,GAAG,KAAA,EAAO,CAAA;AAAA,EACpC;AACA,EAAA,IAAI,8BAAA,CAA+B,KAAK,CAAA,EAAG;AACzC,IAAA,uBAAO,GAAA,CAAC,gCAAA,EAAA,EAAkC,GAAG,KAAA,EAAO,CAAA;AAAA,EACtD;AACA,EAAA,IAAI,wBAAA,CAAyB,KAAK,CAAA,EAAG;AACnC,IAAA,uBAAO,GAAA,CAAC,0BAAA,EAAA,EAA4B,GAAG,KAAA,EAAO,CAAA;AAAA,EAChD;AACA,EAAA,uBACE,GAAA;AAAA,IAAC,0BAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MACA,eAAA,EAAiB,MAAA,CAAO,SAAA,CAAU,QAAA,CAAS,eAAe;AAAA;AAAA,GAC5D;AAEJ;;;;"}

package/dist/components/AggregatedMetricCards/ScalarStatCard/ScalarStatCard.esm.js

@@ -0,0 +1,76 @@
+import { jsx } from 'react/jsx-runtime';
+import { useTheme } from '@mui/material/styles';
+import { CardWrapper } from '../../Common/CardWrapper.esm.js';
+import 'date-fns';
+import { formatWithMetricUnit } from '../../../utils/formatMetricUnit.esm.js';
+import '@red-hat-developer-hub/backstage-plugin-scorecard-common';
+import { resolveStatusColor } from '../../../utils/statusUtils.esm.js';
+import { useTranslation } from '../../../hooks/useTranslation.esm.js';
+import { CardInfoButton } from '../components/CardInfoButton.esm.js';
+import { CardSubheader } from '../components/CardSubheader.esm.js';
+import { CardChartContainer } from '../components/CardChartContainer.esm.js';
+import { formatAggregationScoreDetail } from '../WeightedStatusScoreCard/TooltipContent.esm.js';
+import { ScalarStatTile } from './ScalarStatTile.esm.js';
+
+function getAggregationTypeLabel(aggregationType, t) {
+  if (!aggregationType) {
+    return "";
+  }
+  const key = `aggregation.${aggregationType}`;
+  const translated = t(key, {});
+  if (translated !== key) {
+    return translated;
+  }
+  return aggregationType.charAt(0).toUpperCase() + aggregationType.slice(1);
+}
+const ScalarStatCard = ({
+  scorecard,
+  cardTitle,
+  description,
+  aggregationId,
+  showSubheader = true,
+  showInfo = true,
+  dataTestId
+}) => {
+  const theme = useTheme();
+  const { t } = useTranslation();
+  const { result, metadata, id: scorecardId } = scorecard;
+  const resolvedColor = result.aggregationChartDisplayColor ? resolveStatusColor(theme, result.aggregationChartDisplayColor) : theme.palette.grey[300];
+  const displayValue = formatWithMetricUnit(
+    formatAggregationScoreDetail(result.value),
+    metadata.unit
+  );
+  const aggregationLabel = getAggregationTypeLabel(metadata.aggregationType, t);
+  const subheader = showSubheader ? /* @__PURE__ */ jsx(
+    CardSubheader,
+    {
+      aggregationId,
+      scorecardId,
+      entitiesCount: result.total,
+      entitiesConsidered: result.entitiesConsidered,
+      calculationErrorCount: result.calculationErrorCount
+    }
+  ) : null;
+  const info = showInfo ? /* @__PURE__ */ jsx(CardInfoButton, { timestamp: result.timestamp }) : null;
+  return /* @__PURE__ */ jsx(
+    CardWrapper,
+    {
+      title: cardTitle,
+      dataTestId,
+      subheader,
+      description,
+      info,
+      children: /* @__PURE__ */ jsx(CardChartContainer, { children: /* @__PURE__ */ jsx(
+        ScalarStatTile,
+        {
+          displayValue,
+          label: aggregationLabel,
+          resolvedColor
+        }
+      ) })
+    }
+  );
+};
+
+export { ScalarStatCard };
+//# sourceMappingURL=ScalarStatCard.esm.js.map

package/dist/components/AggregatedMetricCards/ScalarStatCard/ScalarStatCard.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarStatCard.esm.js","sources":["../../../../src/components/AggregatedMetricCards/ScalarStatCard/ScalarStatCard.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useTheme } from '@mui/material/styles';\nimport type { TranslationFunction } from '@backstage/core-plugin-api/alpha';\n\nimport { CardWrapper } from '../../Common/CardWrapper';\nimport { formatWithMetricUnit, resolveStatusColor } from '../../../utils';\nimport { useTranslation } from '../../../hooks/useTranslation';\nimport { scorecardTranslationRef } from '../../../translations';\nimport { CardInfoButton } from '../components/CardInfoButton';\nimport { CardSubheader } from '../components/CardSubheader';\nimport { CardChartContainer } from '../components/CardChartContainer';\nimport { formatAggregationScoreDetail } from '../WeightedStatusScoreCard/TooltipContent';\nimport { ScalarStatTile } from './ScalarStatTile';\nimport type { ScalarStatCardProps } from './types';\n\nfunction getAggregationTypeLabel(\n  aggregationType: string,\n  t: TranslationFunction<typeof scorecardTranslationRef.T>,\n): string {\n  if (!aggregationType) {\n    return '';\n  }\n\n  const key = `aggregation.${aggregationType}`;\n  const translated = t(key as any, {});\n  if (translated !== key) {\n    return translated;\n  }\n\n  return aggregationType.charAt(0).toUpperCase() + aggregationType.slice(1);\n}\n\nexport const ScalarStatCard = ({\n  scorecard,\n  cardTitle,\n  description,\n  aggregationId,\n  showSubheader = true,\n  showInfo = true,\n  dataTestId,\n}: ScalarStatCardProps) => {\n  const theme = useTheme();\n  const { t } = useTranslation();\n  const { result, metadata, id: scorecardId } = scorecard;\n\n  const resolvedColor = result.aggregationChartDisplayColor\n    ? resolveStatusColor(theme, result.aggregationChartDisplayColor)\n    : theme.palette.grey[300];\n  const displayValue = formatWithMetricUnit(\n    formatAggregationScoreDetail(result.value),\n    metadata.unit,\n  );\n  const aggregationLabel = getAggregationTypeLabel(metadata.aggregationType, t);\n\n  const subheader = showSubheader ? (\n    <CardSubheader\n      aggregationId={aggregationId}\n      scorecardId={scorecardId}\n      entitiesCount={result.total}\n      entitiesConsidered={result.entitiesConsidered}\n      calculationErrorCount={result.calculationErrorCount}\n    />\n  ) : null;\n\n  const info = showInfo ? (\n    <CardInfoButton timestamp={result.timestamp} />\n  ) : null;\n\n  return (\n    <CardWrapper\n      title={cardTitle}\n      dataTestId={dataTestId}\n      subheader={subheader}\n      description={description}\n      info={info}\n    >\n      <CardChartContainer>\n        <ScalarStatTile\n          displayValue={displayValue}\n          label={aggregationLabel}\n          resolvedColor={resolvedColor}\n        />\n      </CardChartContainer>\n    </CardWrapper>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;AA8BA,SAAS,uBAAA,CACP,iBACA,CAAA,EACQ;AACR,EAAA,IAAI,CAAC,eAAA,EAAiB;AACpB,IAAA,OAAO,EAAA;AAAA,EACT;AAEA,EAAA,MAAM,GAAA,GAAM,eAAe,eAAe,CAAA,CAAA;AAC1C,EAAA,MAAM,UAAA,GAAa,CAAA,CAAE,GAAA,EAAY,EAAE,CAAA;AACnC,EAAA,IAAI,eAAe,GAAA,EAAK;AACtB,IAAA,OAAO,UAAA;AAAA,EACT;AAEA,EAAA,OAAO,eAAA,CAAgB,OAAO,CAAC,CAAA,CAAE,aAAY,GAAI,eAAA,CAAgB,MAAM,CAAC,CAAA;AAC1E;AAEO,MAAM,iBAAiB,CAAC;AAAA,EAC7B,SAAA;AAAA,EACA,SAAA;AAAA,EACA,WAAA;AAAA,EACA,aAAA;AAAA,EACA,aAAA,GAAgB,IAAA;AAAA,EAChB,QAAA,GAAW,IAAA;AAAA,EACX;AACF,CAAA,KAA2B;AACzB,EAAA,MAAM,QAAQ,QAAA,EAAS;AACvB,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,cAAA,EAAe;AAC7B,EAAA,MAAM,EAAE,MAAA,EAAQ,QAAA,EAAU,EAAA,EAAI,aAAY,GAAI,SAAA;AAE9C,EAAA,MAAM,aAAA,GAAgB,MAAA,CAAO,4BAAA,GACzB,kBAAA,CAAmB,KAAA,EAAO,MAAA,CAAO,4BAA4B,CAAA,GAC7D,KAAA,CAAM,OAAA,CAAQ,IAAA,CAAK,GAAG,CAAA;AAC1B,EAAA,MAAM,YAAA,GAAe,oBAAA;AAAA,IACnB,4BAAA,CAA6B,OAAO,KAAK,CAAA;AAAA,IACzC,QAAA,CAAS;AAAA,GACX;AACA,EAAA,MAAM,gBAAA,GAAmB,uBAAA,CAAwB,QAAA,CAAS,eAAA,EAAiB,CAAC,CAAA;AAE5E,EAAA,MAAM,YAAY,aAAA,mBAChB,GAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACC,aAAA;AAAA,MACA,WAAA;AAAA,MACA,eAAe,MAAA,CAAO,KAAA;AAAA,MACtB,oBAAoB,MAAA,CAAO,kBAAA;AAAA,MAC3B,uBAAuB,MAAA,CAAO;AAAA;AAAA,GAChC,GACE,IAAA;AAEJ,EAAA,MAAM,OAAO,QAAA,mBACX,GAAA,CAAC,kBAAe,SAAA,EAAW,MAAA,CAAO,WAAW,CAAA,GAC3C,IAAA;AAEJ,EAAA,uBACE,GAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,SAAA;AAAA,MACP,UAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,IAAA;AAAA,MAEA,8BAAC,kBAAA,EAAA,EACC,QAAA,kBAAA,GAAA;AAAA,QAAC,cAAA;AAAA,QAAA;AAAA,UACC,YAAA;AAAA,UACA,KAAA,EAAO,gBAAA;AAAA,UACP;AAAA;AAAA,OACF,EACF;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/components/AggregatedMetricCards/ScalarStatCard/ScalarStatTile.esm.js

@@ -0,0 +1,66 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import Box from '@mui/material/Box';
+import Typography from '@mui/material/Typography';
+import { darken, alpha } from '@mui/material/styles';
+
+const ScalarStatTile = ({
+  displayValue,
+  label,
+  resolvedColor
+}) => {
+  const textColor = darken(resolvedColor, 0.3);
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      "data-testid": "scalar-stat-tile",
+      "aria-label": `${label} ${displayValue}`,
+      sx: {
+        width: "100%",
+        minHeight: 140,
+        py: 4,
+        px: 2,
+        borderRadius: 2,
+        backgroundColor: alpha(resolvedColor, 0.16),
+        textAlign: "center",
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center"
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          Typography,
+          {
+            "data-testid": "scalar-stat-value",
+            variant: "h3",
+            sx: {
+              fontSize: "2.5rem",
+              fontWeight: 700,
+              color: textColor,
+              lineHeight: 1.2
+            },
+            children: displayValue
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Typography,
+          {
+            "data-testid": "scalar-stat-label",
+            variant: "body1",
+            sx: {
+              fontSize: "1rem",
+              fontWeight: 500,
+              color: textColor,
+              lineHeight: 1.3,
+              mt: 0.5
+            },
+            children: label
+          }
+        )
+      ]
+    }
+  );
+};
+
+export { ScalarStatTile };
+//# sourceMappingURL=ScalarStatTile.esm.js.map

package/dist/components/AggregatedMetricCards/ScalarStatCard/ScalarStatTile.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScalarStatTile.esm.js","sources":["../../../../src/components/AggregatedMetricCards/ScalarStatCard/ScalarStatTile.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport Box from '@mui/material/Box';\nimport Typography from '@mui/material/Typography';\nimport { alpha, darken } from '@mui/material/styles';\n\ntype ScalarStatTileProps = {\n  displayValue: string;\n  label: string;\n  resolvedColor: string;\n};\n\nexport const ScalarStatTile = ({\n  displayValue,\n  label,\n  resolvedColor,\n}: ScalarStatTileProps) => {\n  const textColor = darken(resolvedColor, 0.3);\n\n  return (\n    <Box\n      data-testid=\"scalar-stat-tile\"\n      aria-label={`${label} ${displayValue}`}\n      sx={{\n        width: '100%',\n        minHeight: 140,\n        py: 4,\n        px: 2,\n        borderRadius: 2,\n        backgroundColor: alpha(resolvedColor, 0.16),\n        textAlign: 'center',\n        display: 'flex',\n        flexDirection: 'column',\n        alignItems: 'center',\n        justifyContent: 'center',\n      }}\n    >\n      <Typography\n        data-testid=\"scalar-stat-value\"\n        variant=\"h3\"\n        sx={{\n          fontSize: '2.5rem',\n          fontWeight: 700,\n          color: textColor,\n          lineHeight: 1.2,\n        }}\n      >\n        {displayValue}\n      </Typography>\n      <Typography\n        data-testid=\"scalar-stat-label\"\n        variant=\"body1\"\n        sx={{\n          fontSize: '1rem',\n          fontWeight: 500,\n          color: textColor,\n          lineHeight: 1.3,\n          mt: 0.5,\n        }}\n      >\n        {label}\n      </Typography>\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;AA0BO,MAAM,iBAAiB,CAAC;AAAA,EAC7B,YAAA;AAAA,EACA,KAAA;AAAA,EACA;AACF,CAAA,KAA2B;AACzB,EAAA,MAAM,SAAA,GAAY,MAAA,CAAO,aAAA,EAAe,GAAG,CAAA;AAE3C,EAAA,uBACE,IAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,aAAA,EAAY,kBAAA;AAAA,MACZ,YAAA,EAAY,CAAA,EAAG,KAAK,CAAA,CAAA,EAAI,YAAY,CAAA,CAAA;AAAA,MACpC,EAAA,EAAI;AAAA,QACF,KAAA,EAAO,MAAA;AAAA,QACP,SAAA,EAAW,GAAA;AAAA,QACX,EAAA,EAAI,CAAA;AAAA,QACJ,EAAA,EAAI,CAAA;AAAA,QACJ,YAAA,EAAc,CAAA;AAAA,QACd,eAAA,EAAiB,KAAA,CAAM,aAAA,EAAe,IAAI,CAAA;AAAA,QAC1C,SAAA,EAAW,QAAA;AAAA,QACX,OAAA,EAAS,MAAA;AAAA,QACT,aAAA,EAAe,QAAA;AAAA,QACf,UAAA,EAAY,QAAA;AAAA,QACZ,cAAA,EAAgB;AAAA,OAClB;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,UAAA;AAAA,UAAA;AAAA,YACC,aAAA,EAAY,mBAAA;AAAA,YACZ,OAAA,EAAQ,IAAA;AAAA,YACR,EAAA,EAAI;AAAA,cACF,QAAA,EAAU,QAAA;AAAA,cACV,UAAA,EAAY,GAAA;AAAA,cACZ,KAAA,EAAO,SAAA;AAAA,cACP,UAAA,EAAY;AAAA,aACd;AAAA,YAEC,QAAA,EAAA;AAAA;AAAA,SACH;AAAA,wBACA,GAAA;AAAA,UAAC,UAAA;AAAA,UAAA;AAAA,YACC,aAAA,EAAY,mBAAA;AAAA,YACZ,OAAA,EAAQ,OAAA;AAAA,YACR,EAAA,EAAI;AAAA,cACF,QAAA,EAAU,MAAA;AAAA,cACV,UAAA,EAAY,GAAA;AAAA,cACZ,KAAA,EAAO,SAAA;AAAA,cACP,UAAA,EAAY,GAAA;AAAA,cACZ,EAAA,EAAI;AAAA,aACN;AAAA,YAEC,QAAA,EAAA;AAAA;AAAA;AACH;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/components/AggregatedMetricCards/StatusGroupedCard/StatusGroupedCardComponent.esm.js

@@ -3,6 +3,7 @@ import { useTheme } from '@mui/material/styles';
 import { useState } from 'react';
 import { SCORECARD_ERROR_STATE_COLOR } from '../../../utils/constants.esm.js';
 import 'date-fns';
+import '@red-hat-developer-hub/backstage-plugin-scorecard-common';
 import { resolveStatusColor } from '../../../utils/statusUtils.esm.js';
 import { getThresholdRuleColor } from '../../../utils/thresholdUtils.esm.js';
 import { CardWrapper } from '../../Common/CardWrapper.esm.js';

package/dist/components/AggregatedMetricCards/StatusGroupedCard/StatusGroupedCardComponent.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusGroupedCardComponent.esm.js","sources":["../../../../src/components/AggregatedMetricCards/StatusGroupedCard/StatusGroupedCardComponent.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useTheme } from '@mui/material/styles';\nimport { useState } from 'react';\nimport { PieData } from '../../types';\nimport type { TooltipPosition } from '../types';\nimport {\n  getThresholdRuleColor,\n  SCORECARD_ERROR_STATE_COLOR,\n  resolveStatusColor,\n} from '../../../utils';\nimport { CardWrapper } from '../../Common/CardWrapper';\nimport { CardInfoButton } from '../components/CardInfoButton';\nimport { ResponsivePieChart } from '../../ScorecardHomepageSection/ResponsivePieChart';\nimport { CardLegendContent } from '../components/CardLegendContent';\nimport { CardPieTooltipContent } from '../components/CardPieTooltipContent';\nimport { CardChartContainer } from '../components/CardChartContainer';\nimport { CardSubheader } from '../components/CardSubheader';\nimport { CardTooltip } from '../components/CardTooltip';\nimport { StatusGroupedCardComponentProps } from './types';\n\nexport const StatusGroupedCardComponent = ({\n  scorecard,\n  cardTitle,\n  description,\n  aggregationId,\n  showSubheader = true,\n  showInfo = true,\n  dataTestId,\n}: StatusGroupedCardComponentProps) => {\n  const theme = useTheme();\n\n  const [activeIndex, setActiveIndex] = useState<number | null>(null);\n  const [tooltipPosition, setTooltipPosition] =\n    useState<TooltipPosition | null>(null);\n\n  const { id: scorecardId, result } = scorecard;\n\n  const pieData: PieData[] =\n    result.values?.map(value => ({\n      name: value.name,\n      value: value.count,\n      color: resolveStatusColor(\n        theme,\n        getThresholdRuleColor(result.thresholds.rules, value.name) ??\n          SCORECARD_ERROR_STATE_COLOR,\n      ),\n    })) ?? [];\n\n  const subheader = showSubheader ? (\n    <CardSubheader\n      aggregationId={aggregationId}\n      scorecardId={scorecardId}\n      entitiesCount={result.total}\n      entitiesConsidered={result.entitiesConsidered}\n      calculationErrorCount={result.calculationErrorCount}\n    />\n  ) : null;\n\n  const info = showInfo ? (\n    <CardInfoButton timestamp={result.timestamp} />\n  ) : null;\n\n  return (\n    <CardWrapper\n      title={cardTitle}\n      dataTestId={dataTestId}\n      subheader={subheader}\n      description={description}\n      info={info}\n    >\n      <CardChartContainer>\n        <ResponsivePieChart\n          pieData={pieData}\n          legendContent={props => (\n            <CardLegendContent\n              {...props}\n              activeIndex={activeIndex}\n              setActiveIndex={setActiveIndex}\n              setTooltipPosition={setTooltipPosition}\n              pieData={pieData}\n            />\n          )}\n          tooltipContent={({ active, payload }) => (\n            <CardPieTooltipContent\n              active={active}\n              payload={payload}\n              pieData={pieData}\n            />\n          )}\n        />\n\n        {activeIndex !== null && tooltipPosition && (\n          <CardTooltip\n            tooltipPosition={tooltipPosition}\n            pieData={pieData}\n            payload={[\n              {\n                name: pieData[activeIndex].name,\n                value: pieData[activeIndex].value,\n                payload: pieData[activeIndex],\n              },\n            ]}\n          />\n        )}\n      </CardChartContainer>\n    </CardWrapper>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAmCO,MAAM,6BAA6B,CAAC;AAAA,EACzC,SAAA;AAAA,EACA,SAAA;AAAA,EACA,WAAA;AAAA,EACA,aAAA;AAAA,EACA,aAAA,GAAgB,IAAA;AAAA,EAChB,QAAA,GAAW,IAAA;AAAA,EACX;AACF,CAAA,KAAuC;AACrC,EAAA,MAAM,QAAQ,QAAA,EAAS;AAEvB,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAAwB,IAAI,CAAA;AAClE,EAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,GACxC,SAAiC,IAAI,CAAA;AAEvC,EAAA,MAAM,EAAE,EAAA,EAAI,WAAA,EAAa,MAAA,EAAO,GAAI,SAAA;AAEpC,EAAA,MAAM,OAAA,GACJ,MAAA,CAAO,MAAA,EAAQ,GAAA,CAAI,CAAA,KAAA,MAAU;AAAA,IAC3B,MAAM,KAAA,CAAM,IAAA;AAAA,IACZ,OAAO,KAAA,CAAM,KAAA;AAAA,IACb,KAAA,EAAO,kBAAA;AAAA,MACL,KAAA;AAAA,MACA,sBAAsB,MAAA,CAAO,UAAA,CAAW,KAAA,EAAO,KAAA,CAAM,IAAI,CAAA,IACvD;AAAA;AACJ,GACF,CAAE,KAAK,EAAC;AAEV,EAAA,MAAM,YAAY,aAAA,mBAChB,GAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACC,aAAA;AAAA,MACA,WAAA;AAAA,MACA,eAAe,MAAA,CAAO,KAAA;AAAA,MACtB,oBAAoB,MAAA,CAAO,kBAAA;AAAA,MAC3B,uBAAuB,MAAA,CAAO;AAAA;AAAA,GAChC,GACE,IAAA;AAEJ,EAAA,MAAM,OAAO,QAAA,mBACX,GAAA,CAAC,kBAAe,SAAA,EAAW,MAAA,CAAO,WAAW,CAAA,GAC3C,IAAA;AAEJ,EAAA,uBACE,GAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,SAAA;AAAA,MACP,UAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,IAAA;AAAA,MAEA,+BAAC,kBAAA,EAAA,EACC,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,kBAAA;AAAA,UAAA;AAAA,YACC,OAAA;AAAA,YACA,eAAe,CAAA,KAAA,qBACb,GAAA;AAAA,cAAC,iBAAA;AAAA,cAAA;AAAA,gBACE,GAAG,KAAA;AAAA,gBACJ,WAAA;AAAA,gBACA,cAAA;AAAA,gBACA,kBAAA;AAAA,gBACA;AAAA;AAAA,aACF;AAAA,YAEF,cAAA,EAAgB,CAAC,EAAE,MAAA,EAAQ,SAAQ,qBACjC,GAAA;AAAA,cAAC,qBAAA;AAAA,cAAA;AAAA,gBACC,MAAA;AAAA,gBACA,OAAA;AAAA,gBACA;AAAA;AAAA;AACF;AAAA,SAEJ;AAAA,QAEC,WAAA,KAAgB,QAAQ,eAAA,oBACvB,GAAA;AAAA,UAAC,WAAA;AAAA,UAAA;AAAA,YACC,eAAA;AAAA,YACA,OAAA;AAAA,YACA,OAAA,EAAS;AAAA,cACP;AAAA,gBACE,IAAA,EAAM,OAAA,CAAQ,WAAW,CAAA,CAAE,IAAA;AAAA,gBAC3B,KAAA,EAAO,OAAA,CAAQ,WAAW,CAAA,CAAE,KAAA;AAAA,gBAC5B,OAAA,EAAS,QAAQ,WAAW;AAAA;AAC9B;AACF;AAAA;AACF,OAAA,EAEJ;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"StatusGroupedCardComponent.esm.js","sources":["../../../../src/components/AggregatedMetricCards/StatusGroupedCard/StatusGroupedCardComponent.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useTheme } from '@mui/material/styles';\nimport { useState } from 'react';\nimport { PieData } from '../../types';\nimport type { TooltipPosition } from '../types';\nimport {\n  getThresholdRuleColor,\n  SCORECARD_ERROR_STATE_COLOR,\n  resolveStatusColor,\n} from '../../../utils';\nimport { CardWrapper } from '../../Common/CardWrapper';\nimport { CardInfoButton } from '../components/CardInfoButton';\nimport { ResponsivePieChart } from '../../ScorecardHomepageSection/ResponsivePieChart';\nimport { CardLegendContent } from '../components/CardLegendContent';\nimport { CardPieTooltipContent } from '../components/CardPieTooltipContent';\nimport { CardChartContainer } from '../components/CardChartContainer';\nimport { CardSubheader } from '../components/CardSubheader';\nimport { CardTooltip } from '../components/CardTooltip';\nimport { StatusGroupedCardComponentProps } from './types';\n\nexport const StatusGroupedCardComponent = ({\n  scorecard,\n  cardTitle,\n  description,\n  aggregationId,\n  showSubheader = true,\n  showInfo = true,\n  dataTestId,\n}: StatusGroupedCardComponentProps) => {\n  const theme = useTheme();\n\n  const [activeIndex, setActiveIndex] = useState<number | null>(null);\n  const [tooltipPosition, setTooltipPosition] =\n    useState<TooltipPosition | null>(null);\n\n  const { id: scorecardId, result } = scorecard;\n\n  const pieData: PieData[] =\n    result.values?.map(value => ({\n      name: value.name,\n      value: value.count,\n      color: resolveStatusColor(\n        theme,\n        getThresholdRuleColor(result.thresholds.rules, value.name) ??\n          SCORECARD_ERROR_STATE_COLOR,\n      ),\n    })) ?? [];\n\n  const subheader = showSubheader ? (\n    <CardSubheader\n      aggregationId={aggregationId}\n      scorecardId={scorecardId}\n      entitiesCount={result.total}\n      entitiesConsidered={result.entitiesConsidered}\n      calculationErrorCount={result.calculationErrorCount}\n    />\n  ) : null;\n\n  const info = showInfo ? (\n    <CardInfoButton timestamp={result.timestamp} />\n  ) : null;\n\n  return (\n    <CardWrapper\n      title={cardTitle}\n      dataTestId={dataTestId}\n      subheader={subheader}\n      description={description}\n      info={info}\n    >\n      <CardChartContainer>\n        <ResponsivePieChart\n          pieData={pieData}\n          legendContent={props => (\n            <CardLegendContent\n              {...props}\n              activeIndex={activeIndex}\n              setActiveIndex={setActiveIndex}\n              setTooltipPosition={setTooltipPosition}\n              pieData={pieData}\n            />\n          )}\n          tooltipContent={({ active, payload }) => (\n            <CardPieTooltipContent\n              active={active}\n              payload={payload}\n              pieData={pieData}\n            />\n          )}\n        />\n\n        {activeIndex !== null && tooltipPosition && (\n          <CardTooltip\n            tooltipPosition={tooltipPosition}\n            pieData={pieData}\n            payload={[\n              {\n                name: pieData[activeIndex].name,\n                value: pieData[activeIndex].value,\n                payload: pieData[activeIndex],\n              },\n            ]}\n          />\n        )}\n      </CardChartContainer>\n    </CardWrapper>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAmCO,MAAM,6BAA6B,CAAC;AAAA,EACzC,SAAA;AAAA,EACA,SAAA;AAAA,EACA,WAAA;AAAA,EACA,aAAA;AAAA,EACA,aAAA,GAAgB,IAAA;AAAA,EAChB,QAAA,GAAW,IAAA;AAAA,EACX;AACF,CAAA,KAAuC;AACrC,EAAA,MAAM,QAAQ,QAAA,EAAS;AAEvB,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAAwB,IAAI,CAAA;AAClE,EAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,GACxC,SAAiC,IAAI,CAAA;AAEvC,EAAA,MAAM,EAAE,EAAA,EAAI,WAAA,EAAa,MAAA,EAAO,GAAI,SAAA;AAEpC,EAAA,MAAM,OAAA,GACJ,MAAA,CAAO,MAAA,EAAQ,GAAA,CAAI,CAAA,KAAA,MAAU;AAAA,IAC3B,MAAM,KAAA,CAAM,IAAA;AAAA,IACZ,OAAO,KAAA,CAAM,KAAA;AAAA,IACb,KAAA,EAAO,kBAAA;AAAA,MACL,KAAA;AAAA,MACA,sBAAsB,MAAA,CAAO,UAAA,CAAW,KAAA,EAAO,KAAA,CAAM,IAAI,CAAA,IACvD;AAAA;AACJ,GACF,CAAE,KAAK,EAAC;AAEV,EAAA,MAAM,YAAY,aAAA,mBAChB,GAAA;AAAA,IAAC,aAAA;AAAA,IAAA;AAAA,MACC,aAAA;AAAA,MACA,WAAA;AAAA,MACA,eAAe,MAAA,CAAO,KAAA;AAAA,MACtB,oBAAoB,MAAA,CAAO,kBAAA;AAAA,MAC3B,uBAAuB,MAAA,CAAO;AAAA;AAAA,GAChC,GACE,IAAA;AAEJ,EAAA,MAAM,OAAO,QAAA,mBACX,GAAA,CAAC,kBAAe,SAAA,EAAW,MAAA,CAAO,WAAW,CAAA,GAC3C,IAAA;AAEJ,EAAA,uBACE,GAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,SAAA;AAAA,MACP,UAAA;AAAA,MACA,SAAA;AAAA,MACA,WAAA;AAAA,MACA,IAAA;AAAA,MAEA,+BAAC,kBAAA,EAAA,EACC,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,kBAAA;AAAA,UAAA;AAAA,YACC,OAAA;AAAA,YACA,eAAe,CAAA,KAAA,qBACb,GAAA;AAAA,cAAC,iBAAA;AAAA,cAAA;AAAA,gBACE,GAAG,KAAA;AAAA,gBACJ,WAAA;AAAA,gBACA,cAAA;AAAA,gBACA,kBAAA;AAAA,gBACA;AAAA;AAAA,aACF;AAAA,YAEF,cAAA,EAAgB,CAAC,EAAE,MAAA,EAAQ,SAAQ,qBACjC,GAAA;AAAA,cAAC,qBAAA;AAAA,cAAA;AAAA,gBACC,MAAA;AAAA,gBACA,OAAA;AAAA,gBACA;AAAA;AAAA;AACF;AAAA,SAEJ;AAAA,QAEC,WAAA,KAAgB,QAAQ,eAAA,oBACvB,GAAA;AAAA,UAAC,WAAA;AAAA,UAAA;AAAA,YACC,eAAA;AAAA,YACA,OAAA;AAAA,YACA,OAAA,EAAS;AAAA,cACP;AAAA,gBACE,IAAA,EAAM,OAAA,CAAQ,WAAW,CAAA,CAAE,IAAA;AAAA,gBAC3B,KAAA,EAAO,OAAA,CAAQ,WAAW,CAAA,CAAE,KAAA;AAAA,gBAC5B,OAAA,EAAS,QAAQ,WAAW;AAAA;AAC9B;AACF;AAAA;AACF,OAAA,EAEJ;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/components/AggregatedMetricCards/WeightedStatusScoreCard/DonutChartTooltipContent.esm.js

@@ -5,8 +5,8 @@ import Typography from '@mui/material/Typography';
 import { TooltipContent, formatAggregationScoreDetail } from './TooltipContent.esm.js';
 import { useTranslation } from '../../../hooks/useTranslation.esm.js';
 import 'date-fns';
-import { getTranslatedStatus } from '../../../utils/statusUtils.esm.js';
 import '@red-hat-developer-hub/backstage-plugin-scorecard-common';
+import { getTranslatedStatus } from '../../../utils/statusUtils.esm.js';
 
 const DonutChartTooltipContent = ({
   weightedSum,

package/dist/components/AggregatedMetricCards/WeightedStatusScoreCard/WeightedStatusScoreCardComponent.esm.js

@@ -3,8 +3,8 @@ import { useState } from 'react';
 import { useTheme } from '@mui/material/styles';
 import { CardWrapper } from '../../Common/CardWrapper.esm.js';
 import 'date-fns';
-import { resolveStatusColor } from '../../../utils/statusUtils.esm.js';
 import '@red-hat-developer-hub/backstage-plugin-scorecard-common';
+import { resolveStatusColor } from '../../../utils/statusUtils.esm.js';
 import { ResponsivePieChart } from '../../ScorecardHomepageSection/ResponsivePieChart.esm.js';
 import { CardInfoButton } from '../components/CardInfoButton.esm.js';
 import { CardSubheader } from '../components/CardSubheader.esm.js';
@@ -41,10 +41,7 @@ const WeightedStatusScoreCardComponent = ({
   const weightedStatusScorePercent = scorecard.result.weightedStatusScore;
   const { fill: chartFillPercent, remainder: chartRemainderPercent } = clampPercentForDonut(weightedStatusScorePercent);
   const centerPercentLabel = `${formatPercentage(weightedStatusScorePercent)}%`;
-  const arcResolvedColor = resolveStatusColor(
-    theme,
-    scorecard.result.aggregationChartDisplayColor
-  );
+  const arcResolvedColor = scorecard.result.aggregationChartDisplayColor ? resolveStatusColor(theme, scorecard.result.aggregationChartDisplayColor) : theme.palette.grey[300];
   const weightedStatusScorePieData = [
     {
       name: WEIGHTED_STATUS_SCORE_SLICE,