diff --git a/ui/src/Components/OverviewModal/OverviewModalContent.js b/ui/src/Components/OverviewModal/OverviewModalContent.js
index dd6b2bc33..f05dde437 100644
--- a/ui/src/Components/OverviewModal/OverviewModalContent.js
+++ b/ui/src/Components/OverviewModal/OverviewModalContent.js
@@ -38,6 +38,11 @@ const LabelsTable = observer(({ alertStore }) => (
}
/>
))}
+ {nameStats.values.length > 9 ? (
+
+ +{nameStats.values.length - 9} more
+
+ ) : null}
))}
diff --git a/ui/src/Components/OverviewModal/OverviewModalContent.test.js b/ui/src/Components/OverviewModal/OverviewModalContent.test.js
index c337a6119..4fd65343f 100644
--- a/ui/src/Components/OverviewModal/OverviewModalContent.test.js
+++ b/ui/src/Components/OverviewModal/OverviewModalContent.test.js
@@ -37,6 +37,17 @@ describe("", () => {
{ value: "bar3", raw: "foo=bar3", hits: 4, percent: 25, offset: 75 }
]
},
+ {
+ name: "bar",
+ hits: 20,
+ values: Array.from(Array(20).keys()).map(i => ({
+ value: `baz${i + 1}`,
+ raw: `bar=baz${i + 1}`,
+ hits: 1,
+ percent: 5,
+ offset: i * 5
+ }))
+ },
{
name: "alertname",
hits: 5,
diff --git a/ui/src/Components/OverviewModal/__snapshots__/OverviewModalContent.test.js.snap b/ui/src/Components/OverviewModal/__snapshots__/OverviewModalContent.test.js.snap
index 9946996cb..5f8dae447 100644
--- a/ui/src/Components/OverviewModal/__snapshots__/OverviewModalContent.test.js.snap
+++ b/ui/src/Components/OverviewModal/__snapshots__/OverviewModalContent.test.js.snap
@@ -142,6 +142,359 @@ exports[` matches snapshot with labels to show 1`] = `
+
+ |
+
+
+ 20
+
+ bar
+
+ |
+
+
+
+
+ 1
+
+
+
+ bar:
+
+
+ baz1
+
+
+
+
+
+
+
+ 1
+
+
+
+ bar:
+
+
+ baz2
+
+
+
+
+
+
+
+ 1
+
+
+
+ bar:
+
+
+ baz3
+
+
+
+
+
+
+
+ 1
+
+
+
+ bar:
+
+
+ baz4
+
+
+
+
+
+
+
+ 1
+
+
+
+ bar:
+
+
+ baz5
+
+
+
+
+
+
+
+ 1
+
+
+
+ bar:
+
+
+ baz6
+
+
+
+
+
+
+
+ 1
+
+
+
+ bar:
+
+
+ baz7
+
+
+
+
+
+
+
+ 1
+
+
+
+ bar:
+
+
+ baz8
+
+
+
+
+
+
+
+ 1
+
+
+
+ bar:
+
+
+ baz9
+
+
+
+
+
+ +11 more
+
+ |
+
| matches snapshot with labels to show 1`] = `