mudhorn/prometheus
1
0
Fork 0
mirror of https://github.com/prometheus/prometheus.git synced 2025-03-05 20:59:13 -08:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

Add "Show exemplars" button (doesn't do anything yet)

Browse source 
Signed-off-by: Julius Volz <julius.volz@gmail.com>
This commit is contained in:
Julius Volz 2024-09-04 17:45:31 +02:00
parent 88519152e5
commit 7103b35568
1 changed files with 82 additions and 76 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

158
web/ui/mantine-ui/src/pages/query/QueryPanel.tsx
View file

@ -205,82 +205,88 @@ const QueryPanel: FC<PanelProps> = ({ idx, metricNames }) => {
/> />
</Group> </Group>
<SegmentedControl <Group gap="lg">
onChange={(value) => <Button
dispatch( variant="subtle"
setVisualizer({ color="gray.9"
idx, size="xs"
visualizer: { leftSection={
...panel.visualizer, panel.visualizer.showExemplars ? (
displayMode: value as GraphDisplayMode, <IconCheckbox
}, style={{
}) width: "1.5em",
) height: "1.5em",
} marginRight: -1,
value={panel.visualizer.displayMode} }}
data={[ />
{ ) : (
value: GraphDisplayMode.Lines, <IconSquare
label: ( style={{
<Center> width: "1.3em",
<IconChartLine style={iconStyle} /> height: "1.3em",
<Box ml={10}>Unstacked</Box> }}
</Center> />
), )
}, }
{ onClick={() =>
value: GraphDisplayMode.Stacked, dispatch(
label: ( setVisualizer({
<Center> idx,
<IconChartAreaFilled style={iconStyle} /> visualizer: {
<Box ml={10}>Stacked</Box> ...panel.visualizer,
</Center> showExemplars: !panel.visualizer.showExemplars,
), },
}, })
{ )
value: GraphDisplayMode.Heatmap, }
label: ( >
<Center> Show exemplars
<IconChartGridDots style={iconStyle} /> </Button>
<Box ml={10}>Heatmap</Box>
</Center> <SegmentedControl
), onChange={(value) =>
}, dispatch(
]} setVisualizer({
/> idx,
{/* <Switch color="gray" defaultChecked label="Show exemplars" /> */} visualizer: {
{/* <Switch ...panel.visualizer,
checked={panel.visualizer.showExemplars} displayMode: value as GraphDisplayMode,
onChange={(event) => },
dispatch( })
setVisualizer({ )
idx, }
visualizer: { value={panel.visualizer.displayMode}
...panel.visualizer, data={[
showExemplars: event.currentTarget.checked, {
}, value: GraphDisplayMode.Lines,
}) label: (
) <Center>
} <IconChartLine style={iconStyle} />
color={"rgba(34,139,230,.1)"} <Box ml={10}>Unstacked</Box>
size="md" </Center>
label="Show exemplars" ),
thumbIcon={ },
panel.visualizer.showExemplars ? ( {
<IconCheck value: GraphDisplayMode.Stacked,
style={{ width: "0.9rem", height: "0.9rem" }} label: (
color={"rgba(34,139,230,.1)"} <Center>
stroke={3} <IconChartAreaFilled style={iconStyle} />
/> <Box ml={10}>Stacked</Box>
) : ( </Center>
<IconX ),
style={{ width: "0.9rem", height: "0.9rem" }} },
color="rgba(34,139,230,.1)" // {
stroke={3} // value: GraphDisplayMode.Heatmap,
/> // label: (
) // <Center>
} // <IconChartGridDots style={iconStyle} />
/> */} // <Box ml={10}>Heatmap</Box>
// </Center>
// ),
// },
]}
/>
</Group>
</Group> </Group>
<Space h="lg" /> <Space h="lg" />
<Graph <Graph