More cleanups to tree view stats
Some checks failed
CI / Go tests (push) Has been cancelled
CI / More Go tests (push) Has been cancelled
CI / Go tests with previous Go version (push) Has been cancelled
CI / UI tests (push) Has been cancelled
CI / Go tests on Windows (push) Has been cancelled
CI / Mixins tests (push) Has been cancelled
CI / Build Prometheus for common architectures (0) (push) Has been cancelled
CI / Build Prometheus for common architectures (1) (push) Has been cancelled
CI / Build Prometheus for common architectures (2) (push) Has been cancelled
CI / Build Prometheus for all architectures (0) (push) Has been cancelled
CI / Build Prometheus for all architectures (1) (push) Has been cancelled
CI / Build Prometheus for all architectures (10) (push) Has been cancelled
CI / Build Prometheus for all architectures (11) (push) Has been cancelled
CI / Build Prometheus for all architectures (2) (push) Has been cancelled
CI / Build Prometheus for all architectures (3) (push) Has been cancelled
CI / Build Prometheus for all architectures (4) (push) Has been cancelled
CI / Build Prometheus for all architectures (5) (push) Has been cancelled
CI / Build Prometheus for all architectures (6) (push) Has been cancelled
CI / Build Prometheus for all architectures (7) (push) Has been cancelled
CI / Build Prometheus for all architectures (8) (push) Has been cancelled
CI / Build Prometheus for all architectures (9) (push) Has been cancelled
CI / Check generated parser (push) Has been cancelled
CI / golangci-lint (push) Has been cancelled
CI / fuzzing (push) Has been cancelled
CI / codeql (push) Has been cancelled
CI / Report status of build Prometheus for all architectures (push) Has been cancelled
CI / Publish main branch artifacts (push) Has been cancelled
CI / Publish release artefacts (push) Has been cancelled
CI / Publish UI on npm Registry (push) Has been cancelled

Signed-off-by: Julius Volz <julius.volz@gmail.com>
This commit is contained in:
Julius Volz 2024-09-05 16:19:12 +02:00
parent 2d9f79f59e
commit c1c2e32137

View file

@ -33,7 +33,8 @@ import { useId } from "@mantine/hooks";
import { functionSignatures } from "../../promql/functionSignatures"; import { functionSignatures } from "../../promql/functionSignatures";
const nodeIndent = 20; const nodeIndent = 20;
const maxLabels = 10; const maxLabelNames = 10;
const maxLabelValues = 10;
type NodeState = "waiting" | "running" | "error" | "success"; type NodeState = "waiting" | "running" | "error" | "success";
@ -209,7 +210,7 @@ const TreeNode: FC<{
// Sort label values by their number of occurrences within this label name. // Sort label values by their number of occurrences within this label name.
labelExamples[ln] = Object.entries(lvs) labelExamples[ln] = Object.entries(lvs)
.sort(([, aCnt], [, bCnt]) => bCnt - aCnt) .sort(([, aCnt], [, bCnt]) => bCnt - aCnt)
.slice(0, 5) .slice(0, maxLabelValues)
.map(([lv, cnt]) => ({ value: lv, count: cnt })); .map(([lv, cnt]) => ({ value: lv, count: cnt }));
}); });
@ -285,11 +286,14 @@ const TreeNode: FC<{
<Text c="dimmed" fz="xs" style={{ whiteSpace: "nowrap" }}> <Text c="dimmed" fz="xs" style={{ whiteSpace: "nowrap" }}>
{resultStats.numSeries} result{resultStats.numSeries !== 1 && "s"} {resultStats.numSeries} result{resultStats.numSeries !== 1 && "s"}
&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;
{responseTime}ms &nbsp;&nbsp;&nbsp;&nbsp; {responseTime}ms
{resultStats.sortedLabelCards.length > 0 && (
<>&nbsp;&nbsp;&nbsp;&nbsp;</>
)}
</Text> </Text>
<Group gap="xs" wrap="nowrap"> <Group gap="xs" wrap="nowrap">
{resultStats.sortedLabelCards {resultStats.sortedLabelCards
.slice(0, maxLabels) .slice(0, maxLabelNames)
.map(([ln, cnt]) => ( .map(([ln, cnt]) => (
<Tooltip <Tooltip
key={ln} key={ln}
@ -302,7 +306,7 @@ const TreeNode: FC<{
{resultStats.labelExamples[ln].map( {resultStats.labelExamples[ln].map(
({ value, count }) => ( ({ value, count }) => (
<List.Item key={value} py={1}> <List.Item key={value} py={1}>
<Code c="red.3" bg="gray.7"> <Code c="red.3" bg="gray.8">
{escapeString(value)} {escapeString(value)}
</Code>{" "} </Code>{" "}
({count} ({count}
@ -310,7 +314,7 @@ const TreeNode: FC<{
</List.Item> </List.Item>
) )
)} )}
{cnt > 5 && <li>...</li>} {cnt > maxLabelValues && <li>...</li>}
</List> </List>
</Box> </Box>
} }
@ -330,14 +334,14 @@ const TreeNode: FC<{
</span> </span>
</Tooltip> </Tooltip>
))} ))}
{resultStats.sortedLabelCards.length > maxLabels ? ( {resultStats.sortedLabelCards.length > maxLabelNames ? (
<Text <Text
component="span" component="span"
c="dimmed" c="dimmed"
fz="xs" fz="xs"
style={{ whiteSpace: "nowrap" }} style={{ whiteSpace: "nowrap" }}
> >
...{resultStats.sortedLabelCards.length - maxLabels} more... ...{resultStats.sortedLabelCards.length - maxLabelNames} more...
</Text> </Text>
) : null} ) : null}
</Group> </Group>