go-pkg/asynqmon
2
0
Fork 0
mirror of https://github.com/hibiken/asynqmon.git synced 2025-10-22 06:16:11 +08:00
Code Issues Projects Releases Wiki Activity

Use dynamic step when fetching metrics from Prometheus server

Browse Source
This commit is contained in:
Ken Hibino
2021-12-01 17:32:41 -08:00
parent 3a90416b52
commit 36a5ce4a5b
2 changed files with 47 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
ui/src/views/MetricsView.tsx
View File

@@ -68,13 +68,25 @@ function MetricsView(props: Props) {
);
const [endTimeOption, setEndTimeOption] = React.useState("real_time");
const [endTimeSec, setEndTimeSec] = React.useState(currentUnixtime());
const [durationOption, setDurationOption] = React.useState("1h");
const [durationSec, setDurationSec] = React.useState(60 * 60); // 1h
const handleEndTimeOptionChange = (
event: React.ChangeEvent<HTMLInputElement>
) => {
setEndTimeOption((event.target as HTMLInputElement).value);
const selected = (event.target as HTMLInputElement).value;
setEndTimeOption(selected);
switch (selected) {
case "real_time":
setEndTimeSec(currentUnixtime());
break;
case "freeze_at_now":
setEndTimeSec(currentUnixtime());
break;
case "custom":
// TODO:
}
};
const handleDurationOptionChange = (
@@ -115,14 +127,15 @@ function MetricsView(props: Props) {
const id = open ? "control-popover" : undefined;
React.useEffect(() => {
console.log("DEBUG: GETTING metrics", currentUnixtime(), durationSec);
getMetricsAsync(currentUnixtime(), durationSec);
const id = setInterval(() => {
console.log("DEBUG: GETTING metrics", currentUnixtime(), durationSec);
getMetricsAsync(currentUnixtime(), durationSec);
}, pollInterval * 1000);
return () => clearInterval(id);
}, [pollInterval, getMetricsAsync, durationSec]);
getMetricsAsync(endTimeSec, durationSec);
// Only set up polling if end_time option is "real_time"
if (endTimeOption === "real_time") {
const id = setInterval(() => {
getMetricsAsync(currentUnixtime(), durationSec);
}, pollInterval * 1000);
return () => clearInterval(id);
}
}, [pollInterval, getMetricsAsync, durationSec, endTimeSec, endTimeOption]);
return (
<Container maxWidth="lg" className={classes.container}>
@@ -136,7 +149,8 @@ function MetricsView(props: Props) {
color="primary"
onClick={handleClick}
>
Realtime: {durationOption}
{endTimeOption === "real_time" ? "Realtime" : "Historical"}:{" "}
{durationOption}
</Button>
<Popover
id={id}