mirror of
https://github.com/VictoriaMetrics/VictoriaMetrics.git
synced 2026-08-23 03:39:17 +03:00
Compare commits
3 Commits
RequestErr
...
fs-fadvise
| Author | SHA1 | Date | |
|---|---|---|---|
|
facf947dcd | ||
|
|
a6081fb1a0 | ||
|
|
ab2c91fd61 |
@@ -18,7 +18,7 @@ groups:
|
||||
concurrency: 2
|
||||
rules:
|
||||
- alert: RequestErrorsToAPI
|
||||
expr: increase(vm_http_request_errors_total{path=~".+"}[5m]) > 0
|
||||
expr: increase(vm_http_request_errors_total[5m]) > 0
|
||||
for: 15m
|
||||
labels:
|
||||
severity: warning
|
||||
|
||||
@@ -1,5 +0,0 @@
|
||||
<svg width="48" height="48" fill="#020202" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M24.5475 0C10.3246.0265251 1.11379 3.06365 4.40623 6.10077c0 0 12.32997 11.23333 16.58217 14.84083.8131.6896 2.1728 1.1936 3.5191 1.2201h.1199c1.3463-.0265 2.706-.5305 3.5191-1.2201 4.2522-3.5942 16.5422-14.84083 16.5422-14.84083C48.0478 3.06365 38.8636.0265251 24.6674 0"/>
|
||||
<path d="M28.1579 27.0159c-.8131.6896-2.1728 1.1936-3.5191 1.2201h-.12c-1.3463-.0265-2.7059-.5305-3.519-1.2201-2.9725-2.5067-13.35639-11.87-17.26201-15.3979v5.4112c0 .5968.22661 1.3793.6265 1.7506C7.00358 21.1936 17.2675 30.5437 20.9731 33.6737c.8132.6896 2.1728 1.1936 3.5191 1.2201h.12c1.3463-.0265 2.7059-.5305 3.519-1.2201 3.679-3.13 13.9429-12.4536 16.6089-14.8939.4132-.3713.6265-1.1538.6265-1.7506V11.618c-3.9323 3.5411-14.3162 12.931-17.2354 15.3979h.0267Z"/>
|
||||
<path d="M28.1579 39.748c-.8131.6897-2.1728 1.1937-3.5191 1.2202h-.12c-1.3463-.0265-2.7059-.5305-3.519-1.2202-2.9725-2.4933-13.35639-11.8567-17.26201-15.3978v5.4111c0 .5969.22661 1.3793.6265 1.7507C7.00358 33.9258 17.2675 43.2759 20.9731 46.4058c.8132.6897 2.1728 1.1937 3.5191 1.2202h.12c1.3463-.0265 2.7059-.5305 3.519-1.2202 3.679-3.1299 13.9429-12.4535 16.6089-14.8938.4132-.3714.6265-1.1538.6265-1.7507v-5.4111c-3.9323 3.5411-14.3162 12.931-17.2354 15.3978h.0267Z"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.3 KiB |
@@ -2,9 +2,9 @@
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<link id="favicon" rel="icon" href="/assets/favicon.svg" />
|
||||
<link rel="apple-touch-icon" href="/assets/favicon.svg" />
|
||||
<link id="mask-icon" rel="mask-icon" href="/assets/favicon.svg?no-inline" color="#000000">
|
||||
<link rel="icon" href="/favicon.svg"/>
|
||||
<link rel="apple-touch-icon" href="/favicon.svg"/>
|
||||
<link rel="mask-icon" href="/favicon.svg" color="#000000">
|
||||
|
||||
<meta name="robots" content="noindex">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=5"/>
|
||||
|
||||
1
app/vmui/packages/vmui/public/favicon.svg
Normal file
1
app/vmui/packages/vmui/public/favicon.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg width="48" height="48" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M24.5475 0C10.3246.0265251 1.11379 3.06365 4.40623 6.10077c0 0 12.32997 11.23333 16.58217 14.84083.8131.6896 2.1728 1.1936 3.5191 1.2201h.1199c1.3463-.0265 2.706-.5305 3.5191-1.2201 4.2522-3.5942 16.5422-14.84083 16.5422-14.84083C48.0478 3.06365 38.8636.0265251 24.6674 0" fill="#020202"/><path d="M28.1579 27.0159c-.8131.6896-2.1728 1.1936-3.5191 1.2201h-.12c-1.3463-.0265-2.7059-.5305-3.519-1.2201-2.9725-2.5067-13.35639-11.87-17.26201-15.3979v5.4112c0 .5968.22661 1.3793.6265 1.7506C7.00358 21.1936 17.2675 30.5437 20.9731 33.6737c.8132.6896 2.1728 1.1936 3.5191 1.2201h.12c1.3463-.0265 2.7059-.5305 3.519-1.2201 3.679-3.13 13.9429-12.4536 16.6089-14.8939.4132-.3713.6265-1.1538.6265-1.7506V11.618c-3.9323 3.5411-14.3162 12.931-17.2354 15.3979h.0267Z" fill="#020202"/><path d="M28.1579 39.748c-.8131.6897-2.1728 1.1937-3.5191 1.2202h-.12c-1.3463-.0265-2.7059-.5305-3.519-1.2202-2.9725-2.4933-13.35639-11.8567-17.26201-15.3978v5.4111c0 .5969.22661 1.3793.6265 1.7507C7.00358 33.9258 17.2675 43.2759 20.9731 46.4058c.8132.6897 2.1728 1.1937 3.5191 1.2202h.12c1.3463-.0265 2.7059-.5305 3.519-1.2202 3.679-3.1299 13.9429-12.4535 16.6089-14.8938.4132-.3714.6265-1.1538.6265-1.7507v-5.4111c-3.9323 3.5411-14.3162 12.931-17.2354 15.3978h.0267Z" fill="#020202"/></svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
@@ -3,7 +3,7 @@
|
||||
"name": "vmui",
|
||||
"icons": [
|
||||
{
|
||||
"src": "./assets/favicon.svg",
|
||||
"src": "favicon.svg",
|
||||
"sizes": "any",
|
||||
"type": "image/svg+xml"
|
||||
}
|
||||
|
||||
@@ -1,61 +0,0 @@
|
||||
import { FC, useMemo } from "preact/compat";
|
||||
import "./style.scss";
|
||||
import { createFaviconUrl } from "../../../../utils/favicon";
|
||||
import classNames from "classnames";
|
||||
import { useBrowserTabSync } from "./hooks/useBrowserTabSync";
|
||||
import { CloseIcon } from "../../../Main/Icons";
|
||||
import { faviconColors } from "../../../../constants/faviconColors";
|
||||
|
||||
const BrowserTabController: FC = () => {
|
||||
const { faviconColor, changeFaviconColor } = useBrowserTabSync();
|
||||
|
||||
const faviconUrl = useMemo(() => {
|
||||
return createFaviconUrl(faviconColor);
|
||||
}, [faviconColor]);
|
||||
|
||||
const createHandlerClick = (color?: string) => () => {
|
||||
changeFaviconColor(color);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="vm-browser-tab-controller">
|
||||
<p className="vm-server-configurator__title">Favicon color</p>
|
||||
|
||||
<div className="vm-browser-tab-controller-palette">
|
||||
<div className="vm-browser-tab-controller-palette-list">
|
||||
<button
|
||||
className="vm-browser-tab-controller-palette-list__item vm-browser-tab-controller-palette-list__item_reset"
|
||||
type="button"
|
||||
onClick={createHandlerClick()}
|
||||
aria-label="Reset favicon color"
|
||||
>
|
||||
<CloseIcon />
|
||||
</button>
|
||||
|
||||
{faviconColors.map(color => (
|
||||
<button
|
||||
className={classNames({
|
||||
"vm-browser-tab-controller-palette-list__item": true,
|
||||
"vm-browser-tab-controller-palette-list__item_selected": faviconColor === color
|
||||
})}
|
||||
key={color}
|
||||
type="button"
|
||||
style={{ color }}
|
||||
onClick={createHandlerClick(color)}
|
||||
aria-label={`Set favicon color to ${color}`}
|
||||
aria-pressed={faviconColor === color}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<img
|
||||
className="vm-browser-tab-controller-palette__preview"
|
||||
src={faviconUrl}
|
||||
alt="Favicon preview"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default BrowserTabController;
|
||||
@@ -1,41 +0,0 @@
|
||||
import useEventListener from "../../../../../hooks/useEventListener";
|
||||
import { useEffect, useState } from "preact/compat";
|
||||
import { getFromStorage, removeFromStorage, saveToStorage } from "../../../../../utils/storage";
|
||||
import { getFaviconStorageKey, updateFaviconColor } from "../../../../../utils/favicon";
|
||||
|
||||
const storageKey = `FAVICON_COLOR:${getFaviconStorageKey()}` as const;
|
||||
|
||||
const getColorFromStorage = () => {
|
||||
return getFromStorage(storageKey) as string | undefined;
|
||||
};
|
||||
|
||||
export const useBrowserTabSync = () => {
|
||||
const [faviconColor, setFaviconColor] = useState(getColorFromStorage);
|
||||
|
||||
const handleUpdateColor = () => {
|
||||
setFaviconColor(getColorFromStorage());
|
||||
};
|
||||
|
||||
const changeFaviconColor = (color?: string) => {
|
||||
if (color) {
|
||||
saveToStorage(storageKey, color);
|
||||
} else {
|
||||
removeFromStorage([storageKey]);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
handleUpdateColor();
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
updateFaviconColor(faviconColor);
|
||||
}, [faviconColor]);
|
||||
|
||||
useEventListener("storage", handleUpdateColor);
|
||||
|
||||
return {
|
||||
faviconColor,
|
||||
changeFaviconColor,
|
||||
};
|
||||
};
|
||||
@@ -1,71 +0,0 @@
|
||||
@use "src/styles/variables" as *;
|
||||
|
||||
$color-item-size: 28px;
|
||||
$outline-width: 2px;
|
||||
$outline-offset: 2px;
|
||||
$outline-space: $outline-width + $outline-offset;
|
||||
|
||||
.vm-browser-tab-controller {
|
||||
.vm-server-configurator__title {
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
|
||||
&-palette {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: calc($padding-large * 2);
|
||||
|
||||
&-list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
flex-wrap: wrap;
|
||||
gap: $padding-small;
|
||||
|
||||
&__item {
|
||||
width: $color-item-size;
|
||||
height: $color-item-size;
|
||||
aspect-ratio: 1;
|
||||
border-radius: 50%;
|
||||
background-color: currentColor;
|
||||
cursor: pointer;
|
||||
transition-property: transform;
|
||||
transition-duration: 0.15s;
|
||||
transition-timing-function: linear;
|
||||
|
||||
&:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
&_reset {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: transparent;
|
||||
border: $border-divider;
|
||||
color: $color-text-disabled;
|
||||
padding: calc($padding-small / 2);
|
||||
}
|
||||
|
||||
&_selected {
|
||||
width: $color-item-size - 2 * $outline-space;
|
||||
height: $color-item-size - 2 * $outline-space;
|
||||
margin: $outline-space;
|
||||
outline: $outline-width solid currentColor;
|
||||
outline-offset: $outline-offset;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__preview {
|
||||
width: $color-item-size;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -8,12 +8,10 @@ import Tooltip from "../../Main/Tooltip/Tooltip";
|
||||
import LimitsConfigurator from "./LimitsConfigurator/LimitsConfigurator";
|
||||
import { getAppModeEnable } from "../../../utils/app-mode";
|
||||
import classNames from "classnames";
|
||||
import TimezonesPicker from "./Timezones/TimezonesPicker";
|
||||
import Timezones from "./Timezones/Timezones";
|
||||
import ThemeControl from "../ThemeControl/ThemeControl";
|
||||
import useDeviceDetect from "../../../hooks/useDeviceDetect";
|
||||
import useBoolean from "../../../hooks/useBoolean";
|
||||
import BrowserTabController from "./BrowserTabController/BrowserTabController";
|
||||
import LegendCollapseController from "./LegendCollapseController/LegendCollapseController";
|
||||
|
||||
const title = "Settings";
|
||||
|
||||
@@ -28,6 +26,7 @@ const GlobalSettings: FC = () => {
|
||||
|
||||
const serverSettingRef = useRef<ChildComponentHandle>(null);
|
||||
const limitsSettingRef = useRef<ChildComponentHandle>(null);
|
||||
const timezoneSettingRef = useRef<ChildComponentHandle>(null);
|
||||
|
||||
const {
|
||||
value: open,
|
||||
@@ -38,6 +37,7 @@ const GlobalSettings: FC = () => {
|
||||
const handleApply = () => {
|
||||
serverSettingRef.current && serverSettingRef.current.handleApply();
|
||||
limitsSettingRef.current && limitsSettingRef.current.handleApply();
|
||||
timezoneSettingRef.current && timezoneSettingRef.current.handleApply();
|
||||
handleClose();
|
||||
};
|
||||
|
||||
@@ -49,10 +49,6 @@ const GlobalSettings: FC = () => {
|
||||
onClose={handleClose}
|
||||
/>
|
||||
},
|
||||
{
|
||||
show: true,
|
||||
component: <TimezonesPicker/>
|
||||
},
|
||||
{
|
||||
show: true,
|
||||
component: <LimitsConfigurator
|
||||
@@ -62,16 +58,12 @@ const GlobalSettings: FC = () => {
|
||||
},
|
||||
{
|
||||
show: true,
|
||||
component: <LegendCollapseController/>
|
||||
component: <Timezones ref={timezoneSettingRef}/>
|
||||
},
|
||||
{
|
||||
show: !appModeEnable,
|
||||
component: <ThemeControl/>
|
||||
},
|
||||
{
|
||||
show: true,
|
||||
component: <BrowserTabController/>
|
||||
},
|
||||
}
|
||||
].filter(control => control.show);
|
||||
|
||||
return <>
|
||||
|
||||
@@ -1,30 +0,0 @@
|
||||
import { FC, useEffect, useState } from "preact/compat";
|
||||
import { getFromStorage, saveToStorage } from "../../../../utils/storage";
|
||||
import Switch from "../../../Main/Switch/Switch";
|
||||
import { LEGEND_COLLAPSE_SERIES_LIMIT } from "../../../../constants/graph";
|
||||
import "./style.scss";
|
||||
|
||||
const LegendCollapseController: FC = () => {
|
||||
const storageCollapse = getFromStorage("LEGEND_AUTO_COLLAPSE");
|
||||
const [legendCollapse, setLegendCollapse] = useState(storageCollapse ? storageCollapse === "true" : true);
|
||||
|
||||
useEffect(() => {
|
||||
saveToStorage("LEGEND_AUTO_COLLAPSE", `${legendCollapse}`);
|
||||
}, [legendCollapse]);
|
||||
|
||||
return (
|
||||
<div className="vm-legend-collapse-controller">
|
||||
<Switch
|
||||
fullWidth
|
||||
color="neutral"
|
||||
value={legendCollapse}
|
||||
onChange={setLegendCollapse}
|
||||
label={<span className="vm-server-configurator__title">Auto-collapse legend</span>}
|
||||
/>
|
||||
<span className="vm-legend-collapse-controller__description">
|
||||
Collapses the legend when series count exceeds {LEGEND_COLLAPSE_SERIES_LIMIT} to reduce UI load.
|
||||
</span>
|
||||
</div>);
|
||||
};
|
||||
|
||||
export default LegendCollapseController;
|
||||
@@ -1,19 +0,0 @@
|
||||
@use "src/styles/variables" as *;
|
||||
|
||||
.vm-legend-collapse-controller {
|
||||
background-color: $color-hover-black;
|
||||
border-radius: $border-radius-medium;
|
||||
padding: $padding-large;
|
||||
border: $border-divider;
|
||||
|
||||
.vm-graph-settings-row__label {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&__description {
|
||||
padding-top: $padding-global;
|
||||
font-size: $font-size-small;
|
||||
line-height: 1.3;
|
||||
text-wrap: pretty;
|
||||
}
|
||||
}
|
||||
@@ -1,21 +1,23 @@
|
||||
import { forwardRef, useCallback, useImperativeHandle, useState } from "preact/compat";
|
||||
import { forwardRef, useCallback, useEffect, useImperativeHandle, useState } from "preact/compat";
|
||||
import { DisplayType, ErrorTypes } from "../../../../types";
|
||||
import TextField from "../../../Main/TextField/TextField";
|
||||
import Tooltip from "../../../Main/Tooltip/Tooltip";
|
||||
import { InfoIcon, RestartIcon } from "../../../Main/Icons";
|
||||
import Button from "../../../Main/Button/Button";
|
||||
import { DEFAULT_MAX_SERIES } from "../../../../constants/graph";
|
||||
import { DEFAULT_MAX_SERIES, LEGEND_COLLAPSE_SERIES_LIMIT } from "../../../../constants/graph";
|
||||
import "./style.scss";
|
||||
import classNames from "classnames";
|
||||
import useDeviceDetect from "../../../../hooks/useDeviceDetect";
|
||||
import { ChildComponentHandle } from "../GlobalSettings";
|
||||
import { useCustomPanelDispatch, useCustomPanelState } from "../../../../state/customPanel/CustomPanelStateContext";
|
||||
import Switch from "../../../Main/Switch/Switch";
|
||||
import { getFromStorage, saveToStorage } from "../../../../utils/storage";
|
||||
|
||||
interface ServerConfiguratorProps {
|
||||
onClose: () => void;
|
||||
onClose: () => void
|
||||
}
|
||||
|
||||
const fields: { label: string, type: DisplayType }[] = [
|
||||
const fields: {label: string, type: DisplayType}[] = [
|
||||
{ label: "Graph", type: DisplayType.chart },
|
||||
{ label: "JSON", type: DisplayType.code },
|
||||
{ label: "Table", type: DisplayType.table }
|
||||
@@ -27,7 +29,8 @@ const LimitsConfigurator = forwardRef<ChildComponentHandle, ServerConfiguratorPr
|
||||
const { seriesLimits } = useCustomPanelState();
|
||||
const customPanelDispatch = useCustomPanelDispatch();
|
||||
|
||||
|
||||
const storageCollapse = getFromStorage("LEGEND_AUTO_COLLAPSE");
|
||||
const [legendCollapse, setLegendCollapse] = useState(storageCollapse ? storageCollapse === "true" : true);
|
||||
|
||||
const [limits, setLimits] = useState(seriesLimits);
|
||||
const [error, setError] = useState({
|
||||
@@ -40,7 +43,7 @@ const LimitsConfigurator = forwardRef<ChildComponentHandle, ServerConfiguratorPr
|
||||
setLimits(DEFAULT_MAX_SERIES);
|
||||
};
|
||||
|
||||
const createChangeHandler = (type: DisplayType) => (val: string) => {
|
||||
const createChangeHandler = (type: DisplayType) => (val: string) => {
|
||||
const value = val || "";
|
||||
setError(prev => ({ ...prev, [type]: +value < 0 ? ErrorTypes.positiveNumber : "" }));
|
||||
setLimits({
|
||||
@@ -54,6 +57,10 @@ const LimitsConfigurator = forwardRef<ChildComponentHandle, ServerConfiguratorPr
|
||||
onClose();
|
||||
}, [limits]);
|
||||
|
||||
useEffect(() => {
|
||||
saveToStorage("LEGEND_AUTO_COLLAPSE", `${legendCollapse}`);
|
||||
}, [legendCollapse]);
|
||||
|
||||
useImperativeHandle(ref, () => ({ handleApply }), [handleApply]);
|
||||
|
||||
return (
|
||||
@@ -99,6 +106,19 @@ const LimitsConfigurator = forwardRef<ChildComponentHandle, ServerConfiguratorPr
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<div className="vm-graph-settings-row">
|
||||
<span className="vm-graph-settings-row__label">Auto-collapse legend</span>
|
||||
<Switch
|
||||
value={legendCollapse}
|
||||
onChange={setLegendCollapse}
|
||||
label={legendCollapse ? "Enabled" : "Disabled"}
|
||||
fullWidth={isMobile}
|
||||
/>
|
||||
<span className="vm-legend-configs-item__info">
|
||||
Collapses the legend when series count exceeds {LEGEND_COLLAPSE_SERIES_LIMIT} to reduce UI load.
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
||||
@@ -0,0 +1,183 @@
|
||||
import { FC, forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState } from "preact/compat";
|
||||
import { getBrowserTimezone, getTimezoneList, getUTCByTimezone } from "../../../../utils/time";
|
||||
import { ArrowDropDownIcon } from "../../../Main/Icons";
|
||||
import classNames from "classnames";
|
||||
import Popper from "../../../Main/Popper/Popper";
|
||||
import Accordion from "../../../Main/Accordion/Accordion";
|
||||
import TextField from "../../../Main/TextField/TextField";
|
||||
import { Timezone } from "../../../../types";
|
||||
import "./style.scss";
|
||||
import useDeviceDetect from "../../../../hooks/useDeviceDetect";
|
||||
import useBoolean from "../../../../hooks/useBoolean";
|
||||
import WarningTimezone from "./WarningTimezone";
|
||||
import { useTimeDispatch, useTimeState } from "../../../../state/time/TimeStateContext";
|
||||
|
||||
interface PinnedTimezone extends Timezone {
|
||||
title: string;
|
||||
isInvalid?: boolean;
|
||||
}
|
||||
|
||||
const browserTimezone = getBrowserTimezone();
|
||||
|
||||
const Timezones: FC = forwardRef((props, ref) => {
|
||||
const { isMobile } = useDeviceDetect();
|
||||
const timezones = getTimezoneList();
|
||||
|
||||
const { timezone: stateTimezone, defaultTimezone } = useTimeState();
|
||||
const timeDispatch = useTimeDispatch();
|
||||
|
||||
const [timezone, setTimezone] = useState(stateTimezone);
|
||||
const [search, setSearch] = useState("");
|
||||
const targetRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
const {
|
||||
value: openList,
|
||||
toggle: toggleOpenList,
|
||||
setFalse: handleCloseList,
|
||||
} = useBoolean(false);
|
||||
|
||||
const pinnedTimezones = useMemo(() => [
|
||||
{
|
||||
title: `Default time (${defaultTimezone})`,
|
||||
region: defaultTimezone,
|
||||
utc: defaultTimezone ? getUTCByTimezone(defaultTimezone) : "UTC"
|
||||
},
|
||||
{
|
||||
title: browserTimezone.title,
|
||||
region: browserTimezone.region,
|
||||
utc: getUTCByTimezone(browserTimezone.region),
|
||||
isInvalid: !browserTimezone.isValid
|
||||
},
|
||||
{
|
||||
title: "UTC (Coordinated Universal Time)",
|
||||
region: "UTC",
|
||||
utc: "UTC"
|
||||
},
|
||||
].filter(t => t.region) as PinnedTimezone[], [defaultTimezone]);
|
||||
|
||||
const searchTimezones = useMemo(() => {
|
||||
if (!search) return timezones;
|
||||
try {
|
||||
return getTimezoneList(search);
|
||||
} catch (e) {
|
||||
return {};
|
||||
}
|
||||
}, [search, timezones]);
|
||||
|
||||
const timezonesGroups = useMemo(() => Object.keys(searchTimezones), [searchTimezones]);
|
||||
|
||||
const activeTimezone = useMemo(() => ({
|
||||
region: timezone,
|
||||
utc: getUTCByTimezone(timezone)
|
||||
}), [timezone]);
|
||||
|
||||
const handleChangeSearch = (val: string) => {
|
||||
setSearch(val);
|
||||
};
|
||||
|
||||
const handleSetTimezone = (val: Timezone) => {
|
||||
setTimezone(val.region);
|
||||
setSearch("");
|
||||
handleCloseList();
|
||||
};
|
||||
|
||||
const createHandlerSetTimezone = (val: Timezone) => () => {
|
||||
handleSetTimezone(val);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
setTimezone(stateTimezone);
|
||||
}, [stateTimezone]);
|
||||
|
||||
useImperativeHandle(ref, () => ({
|
||||
handleApply: () => {
|
||||
timeDispatch({ type: "SET_TIMEZONE", payload: timezone });
|
||||
}
|
||||
}), [timezone]);
|
||||
|
||||
return (
|
||||
<div className="vm-timezones">
|
||||
<div className="vm-server-configurator__title">
|
||||
Time zone
|
||||
</div>
|
||||
<div
|
||||
className="vm-timezones-item vm-timezones-item_selected"
|
||||
onClick={toggleOpenList}
|
||||
ref={targetRef}
|
||||
>
|
||||
<div className="vm-timezones-item__title">{activeTimezone.region}</div>
|
||||
<div className="vm-timezones-item__utc">{activeTimezone.utc}</div>
|
||||
<div
|
||||
className={classNames({
|
||||
"vm-timezones-item__icon": true,
|
||||
"vm-timezones-item__icon_open": openList
|
||||
})}
|
||||
>
|
||||
<ArrowDropDownIcon/>
|
||||
</div>
|
||||
</div>
|
||||
<Popper
|
||||
open={openList}
|
||||
buttonRef={targetRef}
|
||||
placement="bottom-left"
|
||||
onClose={handleCloseList}
|
||||
fullWidth
|
||||
title={isMobile ? "Time zone" : undefined}
|
||||
>
|
||||
<div
|
||||
className={classNames({
|
||||
"vm-timezones-list": true,
|
||||
"vm-timezones-list_mobile": isMobile,
|
||||
})}
|
||||
>
|
||||
<div className="vm-timezones-list-header">
|
||||
<div className="vm-timezones-list-header__search">
|
||||
<TextField
|
||||
autofocus
|
||||
label="Search"
|
||||
value={search}
|
||||
onChange={handleChangeSearch}
|
||||
/>
|
||||
</div>
|
||||
{pinnedTimezones.map((t, i) => t && (
|
||||
<div
|
||||
key={`${i}_${t.region}`}
|
||||
className="vm-timezones-item vm-timezones-list-group-options__item"
|
||||
onClick={createHandlerSetTimezone(t)}
|
||||
>
|
||||
<div className="vm-timezones-item__title">{t.title}{t.isInvalid && <WarningTimezone/>}</div>
|
||||
<div className="vm-timezones-item__utc">{t.utc}</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
{timezonesGroups.map(t => (
|
||||
<div
|
||||
className="vm-timezones-list-group"
|
||||
key={t}
|
||||
>
|
||||
<Accordion
|
||||
defaultExpanded={true}
|
||||
title={<div className="vm-timezones-list-group__title">{t}</div>}
|
||||
>
|
||||
<div className="vm-timezones-list-group-options">
|
||||
{searchTimezones[t] && searchTimezones[t].map(item => (
|
||||
<div
|
||||
className="vm-timezones-item vm-timezones-list-group-options__item"
|
||||
onClick={createHandlerSetTimezone(item)}
|
||||
key={item.search}
|
||||
>
|
||||
<div className="vm-timezones-item__title">{item.region}</div>
|
||||
<div className="vm-timezones-item__utc">{item.utc}</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</Accordion>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</Popper>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
||||
export default Timezones;
|
||||
@@ -1,129 +0,0 @@
|
||||
import { FC, useMemo, useState } from "preact/compat";
|
||||
import { getBrowserTimezone, getTimezoneList, getUTCByTimezone } from "../../../../utils/time";
|
||||
import classNames from "classnames";
|
||||
import Accordion from "../../../Main/Accordion/Accordion";
|
||||
import TextField from "../../../Main/TextField/TextField";
|
||||
import { Timezone } from "../../../../types";
|
||||
import "./style.scss";
|
||||
import useDeviceDetect from "../../../../hooks/useDeviceDetect";
|
||||
import WarningTimezone from "./WarningTimezone";
|
||||
import { useTimeState } from "../../../../state/time/TimeStateContext";
|
||||
|
||||
interface PinnedTimezone extends Timezone {
|
||||
title: string;
|
||||
isInvalid?: boolean;
|
||||
}
|
||||
|
||||
type Props = {
|
||||
onChange: (tz: Timezone) => void;
|
||||
}
|
||||
|
||||
const browserTimezone = getBrowserTimezone();
|
||||
|
||||
const TimezonesList: FC<Props> = ({ onChange }) => {
|
||||
const { isMobile } = useDeviceDetect();
|
||||
const { defaultTimezone } = useTimeState();
|
||||
|
||||
const timezones = useMemo(() => getTimezoneList(), []);
|
||||
|
||||
const [search, setSearch] = useState("");
|
||||
|
||||
const pinnedTimezones = useMemo(() => [
|
||||
{
|
||||
title: `Default time (${defaultTimezone})`,
|
||||
region: defaultTimezone,
|
||||
utc: defaultTimezone ? getUTCByTimezone(defaultTimezone) : "UTC"
|
||||
},
|
||||
{
|
||||
title: browserTimezone.title,
|
||||
region: browserTimezone.region,
|
||||
utc: getUTCByTimezone(browserTimezone.region),
|
||||
isInvalid: !browserTimezone.isValid
|
||||
},
|
||||
{
|
||||
title: "UTC (Coordinated Universal Time)",
|
||||
region: "UTC",
|
||||
utc: "UTC"
|
||||
},
|
||||
].filter(t => t.region) as PinnedTimezone[], [defaultTimezone]);
|
||||
|
||||
const searchTimezones = useMemo(() => {
|
||||
if (!search) return timezones;
|
||||
try {
|
||||
return getTimezoneList(search);
|
||||
} catch (e) {
|
||||
return {};
|
||||
}
|
||||
}, [search, timezones]);
|
||||
|
||||
const timezonesGroups = useMemo(() => Object.keys(searchTimezones), [searchTimezones]);
|
||||
|
||||
const handleChangeSearch = (val: string) => {
|
||||
setSearch(val);
|
||||
};
|
||||
|
||||
const handleSetTimezone = (tz: Timezone) => {
|
||||
onChange(tz);
|
||||
setSearch("");
|
||||
};
|
||||
|
||||
const createHandlerSetTimezone = (val: Timezone) => () => {
|
||||
handleSetTimezone(val);
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
className={classNames({
|
||||
"vm-list": true,
|
||||
"vm-timezones-list": true,
|
||||
"vm-timezones-list_mobile": isMobile,
|
||||
})}
|
||||
>
|
||||
<div className="vm-timezones-list-header">
|
||||
<div className="vm-timezones-list-header__search">
|
||||
<TextField
|
||||
label="Search"
|
||||
value={search}
|
||||
onChange={handleChangeSearch}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
{pinnedTimezones.map((t, i) => t && (
|
||||
<div
|
||||
key={`${i}_${t.region}`}
|
||||
className="vm-list-item vm-timezones-item vm-timezones-list-group-options__item"
|
||||
onClick={createHandlerSetTimezone(t)}
|
||||
>
|
||||
<div className="vm-timezones-item__title">{t.title}{t.isInvalid && <WarningTimezone/>}</div>
|
||||
<div className="vm-timezones-item__utc">{t.utc}</div>
|
||||
</div>
|
||||
))}
|
||||
{timezonesGroups.map(t => (
|
||||
<div
|
||||
className="vm-timezones-list-group"
|
||||
key={t}
|
||||
>
|
||||
<Accordion
|
||||
defaultExpanded={true}
|
||||
title={<div className="vm-timezones-list-group__title">{t}</div>}
|
||||
>
|
||||
<div className="vm-timezones-list-group-options">
|
||||
{searchTimezones[t] && searchTimezones[t].map(item => (
|
||||
<div
|
||||
className="vm-list-item vm-timezones-item vm-timezones-list-group-options__item"
|
||||
onClick={createHandlerSetTimezone(item)}
|
||||
key={item.search}
|
||||
>
|
||||
<div className="vm-timezones-item__title">{item.region}</div>
|
||||
<div className="vm-timezones-item__utc">{item.utc}</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</Accordion>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default TimezonesList;
|
||||
@@ -1,71 +0,0 @@
|
||||
import { FC, useMemo, useRef } from "preact/compat";
|
||||
import { getUTCByTimezone } from "../../../../utils/time";
|
||||
import { ArrowDropDownIcon } from "../../../Main/Icons";
|
||||
import classNames from "classnames";
|
||||
import { Timezone } from "../../../../types";
|
||||
import "./style.scss";
|
||||
import useBoolean from "../../../../hooks/useBoolean";
|
||||
import { useTimeDispatch, useTimeState } from "../../../../state/time/TimeStateContext";
|
||||
import TimezonesList from "./TimezonesList";
|
||||
import Popper from "../../../Main/Popper/Popper";
|
||||
import useDeviceDetect from "../../../../hooks/useDeviceDetect";
|
||||
|
||||
const TimezonesPicker: FC = () => {
|
||||
const { isMobile } = useDeviceDetect();
|
||||
const { timezone: stateTimezone } = useTimeState();
|
||||
const timeDispatch = useTimeDispatch();
|
||||
|
||||
const triggerRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
const {
|
||||
value: isOpenList,
|
||||
toggle: toggleOpenList,
|
||||
setFalse: handleCloseList,
|
||||
} = useBoolean(false);
|
||||
|
||||
const activeTimezone = useMemo(() => ({
|
||||
region: stateTimezone,
|
||||
utc: getUTCByTimezone(stateTimezone)
|
||||
}), [stateTimezone]);
|
||||
|
||||
const handleSetTimezone = (tz: Timezone) => {
|
||||
timeDispatch({ type: "SET_TIMEZONE", payload: tz.region });
|
||||
handleCloseList();
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="vm-timezones">
|
||||
<div className="vm-server-configurator__title">
|
||||
Time zone
|
||||
</div>
|
||||
<div
|
||||
className="vm-timezones-item vm-timezones-item_selected"
|
||||
onClick={toggleOpenList}
|
||||
ref={triggerRef}
|
||||
>
|
||||
<div className="vm-timezones-item__title">{activeTimezone.region}</div>
|
||||
<div className="vm-timezones-item__utc">{activeTimezone.utc}</div>
|
||||
<div
|
||||
className={classNames({
|
||||
"vm-timezones-item__icon": true,
|
||||
"vm-timezones-item__icon_open": isOpenList
|
||||
})}
|
||||
>
|
||||
<ArrowDropDownIcon/>
|
||||
</div>
|
||||
</div>
|
||||
<Popper
|
||||
open={isOpenList}
|
||||
buttonRef={triggerRef}
|
||||
placement="bottom-left"
|
||||
onClose={handleCloseList}
|
||||
fullWidth
|
||||
title={isMobile ? "Time zone" : undefined}
|
||||
>
|
||||
<TimezonesList onChange={handleSetTimezone}/>
|
||||
</Popper>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default TimezonesPicker;
|
||||
@@ -16,7 +16,6 @@
|
||||
}
|
||||
|
||||
&__title {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: $padding-small;
|
||||
@@ -35,7 +34,6 @@
|
||||
background-color: $color-hover-black;
|
||||
padding: calc($padding-small/2);
|
||||
border-radius: $border-radius-small;
|
||||
font-size: $font-size-small;
|
||||
}
|
||||
|
||||
&__icon {
|
||||
@@ -56,11 +54,9 @@
|
||||
}
|
||||
|
||||
&-list {
|
||||
padding-top: 0;
|
||||
max-height: 300px;
|
||||
background-color: $color-background-block;
|
||||
border-radius: $border-radius-medium;
|
||||
font-size: $font-size-small;
|
||||
overflow: auto;
|
||||
|
||||
&_mobile {
|
||||
@@ -76,9 +72,10 @@
|
||||
top: 0;
|
||||
background-color: $color-background-block;
|
||||
z-index: 2;
|
||||
border-bottom: $border-divider;
|
||||
|
||||
&__search {
|
||||
padding: $padding-small $padding-small calc($padding-small / 2);
|
||||
padding: $padding-small;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -94,7 +91,6 @@
|
||||
font-weight: bold;
|
||||
color: $color-text-secondary;
|
||||
padding: $padding-small $padding-global;
|
||||
font-size: $font-size-small;
|
||||
}
|
||||
|
||||
&-options {
|
||||
@@ -102,7 +98,7 @@
|
||||
align-items: flex-start;
|
||||
|
||||
&__item {
|
||||
padding: calc($padding-small / 2) $padding-global;
|
||||
padding: $padding-small $padding-global;
|
||||
transition: background-color 200ms ease;
|
||||
|
||||
&:hover {
|
||||
|
||||
@@ -4,9 +4,9 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: calc($padding-global * 2);
|
||||
gap: $padding-large;
|
||||
width: 600px;
|
||||
padding-inline: $padding-large;
|
||||
padding-bottom: $padding-medium;
|
||||
|
||||
&_mobile {
|
||||
grid-auto-rows: min-content;
|
||||
@@ -62,7 +62,6 @@
|
||||
justify-content: flex-end;
|
||||
gap: $padding-small;
|
||||
width: 100%;
|
||||
padding-block: $padding-global;
|
||||
}
|
||||
|
||||
&_mobile &-footer {
|
||||
|
||||
@@ -22,10 +22,12 @@ const StepConfigurator: FC = () => {
|
||||
const { isMobile } = useDeviceDetect();
|
||||
|
||||
const { customStep: value, isHistogram } = useGraphState();
|
||||
const { period: { end, start } } = useTimeState();
|
||||
const { period: { step, end, start } } = useTimeState();
|
||||
const graphDispatch = useGraphDispatch();
|
||||
const { displayType } = useCustomPanelState();
|
||||
|
||||
const prevDuration = usePrevious(end - start);
|
||||
|
||||
const defaultStep = useMemo(() => {
|
||||
return getStepFromDuration(end - start, isHistogram, displayType);
|
||||
}, [end, start, isHistogram, displayType]);
|
||||
@@ -104,14 +106,16 @@ const StepConfigurator: FC = () => {
|
||||
}, [defaultStep]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!prevDefaultStep) return;
|
||||
if (value !== prevDefaultStep) return;
|
||||
if (value === defaultStep) return;
|
||||
const dur = end - start;
|
||||
if (dur === prevDuration || !prevDuration || value !== prevDefaultStep) return;
|
||||
if (defaultStep) {
|
||||
handleApply(defaultStep);
|
||||
}
|
||||
}, [prevDuration, defaultStep]);
|
||||
|
||||
graphDispatch({ type: "SET_CUSTOM_STEP", payload: defaultStep });
|
||||
setCustomStep(defaultStep);
|
||||
setError("");
|
||||
}, [defaultStep, prevDefaultStep, value, graphDispatch]);
|
||||
useEffect(() => {
|
||||
if (step === value || step === defaultStep) handleApply(defaultStep);
|
||||
}, [isHistogram, displayType]);
|
||||
|
||||
return (
|
||||
<div
|
||||
|
||||
@@ -5,20 +5,8 @@ import useDeviceDetect from "../../../hooks/useDeviceDetect";
|
||||
import classNames from "classnames";
|
||||
import { FC } from "preact/compat";
|
||||
import { useAppDispatch, useAppState } from "../../../state/common/StateContext";
|
||||
import { DarkIcon, LightIcon, SystemIcon } from "../../Main/Icons";
|
||||
|
||||
const themeIcons = {
|
||||
[Theme.system]: <SystemIcon/>,
|
||||
[Theme.light]: <LightIcon/>,
|
||||
[Theme.dark]: <DarkIcon/>,
|
||||
};
|
||||
|
||||
const options = Object.values(Theme).map(value => ({
|
||||
title: value,
|
||||
value,
|
||||
icon: themeIcons[value],
|
||||
}));
|
||||
|
||||
const options = Object.values(Theme).map(value => ({ title: value, value }));
|
||||
const ThemeControl: FC = () => {
|
||||
const { isMobile } = useDeviceDetect();
|
||||
const dispatch = useAppDispatch();
|
||||
@@ -37,14 +25,13 @@ const ThemeControl: FC = () => {
|
||||
})}
|
||||
>
|
||||
<div className="vm-server-configurator__title">
|
||||
Theme
|
||||
Theme preferences
|
||||
</div>
|
||||
<div
|
||||
className="vm-theme-control__toggle"
|
||||
key={`${isMobile}`}
|
||||
>
|
||||
<Toggle
|
||||
size="large"
|
||||
options={options}
|
||||
value={theme}
|
||||
onChange={handleClickItem}
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
|
||||
&__toggle {
|
||||
display: inline-flex;
|
||||
width: 100%;
|
||||
min-width: 300px;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
|
||||
@@ -633,60 +633,3 @@ export const DebugIcon = () => (
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
||||
export const SystemIcon = () => (
|
||||
<svg
|
||||
viewBox="0 0 24 24"
|
||||
fill="currentColor"
|
||||
>
|
||||
<path
|
||||
d="M18 4C18.7957 4 19.5595 4.3163 20.1221 4.87891C20.6845 5.44148 21 6.20452 21 7V15.5264L21.0069 15.6426C21.0203 15.7579 21.0542 15.8702 21.1065 15.9746L22.1729 18.0996C22.3271 18.4056 22.4009 18.7466 22.3858 19.0889C22.3705 19.431 22.2675 19.7637 22.0869 20.0547C21.9063 20.3457 21.6534 20.5855 21.3535 20.751C21.0555 20.9154 20.7202 21.0003 20.3799 20.999L3.62013 21C3.28002 21.0012 2.94535 20.9153 2.64748 20.751C2.34748 20.5855 2.09477 20.3458 1.91408 20.0547C1.73343 19.7636 1.63047 19.4311 1.61525 19.0889C1.60006 18.7466 1.67297 18.4056 1.82716 18.0996L2.89455 15.9746L2.94045 15.8682C2.9801 15.7589 3.00007 15.6432 3.00002 15.5264V7C3.00002 6.20442 3.3164 5.4415 3.87892 4.87891C4.44146 4.31636 5.20447 4.00007 6.00002 4H18ZM4.62404 16.9873L3.61427 18.999L3.6133 19H20.3877L20.3867 18.999L19.376 16.9873H4.62404ZM6.00002 6C5.7349 6.00007 5.48045 6.1055 5.29298 6.29297C5.10554 6.48049 5.00002 6.73485 5.00002 7V14.9873H19V7C19 6.73478 18.8946 6.48051 18.707 6.29297C18.5195 6.10552 18.2652 6 18 6H6.00002Z"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
||||
export const LightIcon = () => (
|
||||
<svg
|
||||
viewBox="0 0 24 24"
|
||||
fill="currentColor"
|
||||
>
|
||||
<path
|
||||
d="M12 19C12.5523 19 13 19.4477 13 20V22C13 22.5523 12.5523 23 12 23C11.4477 23 11 22.5523 11 22V20C11 19.4477 11.4477 19 12 19Z"
|
||||
/>
|
||||
<path
|
||||
d="M5.63281 16.9531C6.02334 16.5627 6.65638 16.5626 7.04688 16.9531C7.43717 17.3436 7.43725 17.9767 7.04688 18.3672L5.63672 19.7773C5.24625 20.1676 4.61313 20.1676 4.22266 19.7773C3.8322 19.3869 3.83233 18.7538 4.22266 18.3633L5.63281 16.9531Z"
|
||||
/>
|
||||
<path
|
||||
d="M16.9531 16.9531C17.3436 16.5626 17.9767 16.5626 18.3672 16.9531L19.7773 18.3633C20.1676 18.7538 20.1678 19.3869 19.7773 19.7773C19.3869 20.1677 18.7538 20.1675 18.3633 19.7773L16.9531 18.3672C16.5626 17.9767 16.5627 17.3437 16.9531 16.9531Z"
|
||||
/>
|
||||
<path
|
||||
d="M12 7C14.7614 7 17 9.23858 17 12C17 14.7614 14.7614 17 12 17C9.23858 17 7 14.7614 7 12C7 9.23858 9.23858 7 12 7ZM12 9C10.3431 9 9 10.3431 9 12C9 13.6569 10.3431 15 12 15C13.6569 15 15 13.6569 15 12C15 10.3431 13.6569 9 12 9Z"
|
||||
/>
|
||||
<path
|
||||
d="M4 11C4.55228 11 5 11.4477 5 12C5 12.5523 4.55228 13 4 13H2C1.44772 13 1 12.5523 1 12C1 11.4477 1.44772 11 2 11H4Z"
|
||||
/>
|
||||
<path
|
||||
d="M22 11C22.5523 11 23 11.4477 23 12C23 12.5523 22.5523 13 22 13H20C19.4477 13 19 12.5523 19 12C19 11.4477 19.4477 11 20 11H22Z"
|
||||
/>
|
||||
<path
|
||||
d="M4.22266 4.22266C4.61315 3.83229 5.24623 3.83229 5.63672 4.22266L7.04688 5.63281C7.4372 6.02331 7.43723 6.65639 7.04688 7.04688C6.6564 7.43735 6.02335 7.43724 5.63281 7.04688L4.22266 5.63672C3.83225 5.24618 3.83217 4.61314 4.22266 4.22266Z"
|
||||
/>
|
||||
<path
|
||||
d="M18.3633 4.22266C18.7538 3.83237 19.3869 3.83232 19.7773 4.22266C20.1677 4.61312 20.1676 5.2462 19.7773 5.63672L18.3672 7.04688C17.9767 7.4373 17.3436 7.4373 16.9531 7.04688C16.5627 6.65637 16.5627 6.0233 16.9531 5.63281L18.3633 4.22266Z"
|
||||
/>
|
||||
<path
|
||||
d="M12 1C12.5523 1 13 1.44772 13 2V4C13 4.55228 12.5523 5 12 5C11.4477 5 11 4.55228 11 4V2C11 1.44772 11.4477 1 12 1Z"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
||||
export const DarkIcon = () => (
|
||||
<svg
|
||||
viewBox="0 0 24 24"
|
||||
fill="currentColor"
|
||||
>
|
||||
<path
|
||||
d="M11.5809 2.01318C12.1851 2.02907 12.6373 2.40742 12.8475 2.84717C13.0627 3.29758 13.0619 3.86893 12.7615 4.34814L12.7606 4.34717C12.1616 5.30581 11.9061 6.43987 12.034 7.56299C12.162 8.68628 12.6672 9.73328 13.4666 10.5327C14.2661 11.332 15.3131 11.8364 16.4363 11.9644C17.5596 12.0922 18.6934 11.836 19.6522 11.2368L19.8348 11.1382C20.2701 10.9405 20.7563 10.9617 21.1512 11.1499C21.6217 11.3742 22.0194 11.8752 21.9832 12.5405C21.8789 14.4693 21.2181 16.3268 20.0809 17.8882C18.9435 19.4496 17.378 20.6484 15.574 21.3394C13.7701 22.0302 11.8042 22.184 9.91485 21.7817C8.02549 21.3794 6.29356 20.4376 4.92754 19.0718C3.56149 17.7059 2.62012 15.9739 2.21758 14.0845C1.81507 12.195 1.96826 10.2294 2.65899 8.42529C3.34975 6.62115 4.5487 5.05596 6.11016 3.91846C7.6716 2.781 9.52882 2.11947 11.4578 2.01514L11.5809 2.01318ZM10.6209 4.12061C9.42038 4.33038 8.27873 4.81214 7.28692 5.53467C6.03798 6.44459 5.07973 7.69705 4.52715 9.14014C3.97456 10.5834 3.85165 12.156 4.17364 13.6675C4.49565 15.179 5.24872 16.5649 6.34161 17.6577C7.43448 18.7505 8.82026 19.5038 10.3318 19.8257C11.8434 20.1475 13.416 20.0239 14.8592 19.4712C16.3024 18.9184 17.5548 17.9597 18.4647 16.7104C19.1869 15.7188 19.6671 14.5776 19.8768 13.3774C18.7333 13.8927 17.4674 14.0949 16.2098 13.9517C14.637 13.7725 13.1709 13.0661 12.0516 11.9468C10.9324 10.8275 10.2258 9.36126 10.0467 7.78857C9.90352 6.53075 10.1054 5.26417 10.6209 4.12061Z"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
||||
@@ -1,10 +1,11 @@
|
||||
import { FC, ReactNode } from "preact/compat";
|
||||
import { ReactNode } from "react";
|
||||
import classNames from "classnames";
|
||||
import "./style.scss";
|
||||
import { FC } from "preact/compat";
|
||||
|
||||
interface SwitchProps {
|
||||
value: boolean
|
||||
color?: "primary" | "secondary" | "error" | "neutral"
|
||||
color?: "primary" | "secondary" | "error"
|
||||
disabled?: boolean
|
||||
label?: string | ReactNode
|
||||
fullWidth?: boolean
|
||||
|
||||
@@ -29,10 +29,6 @@ $switch-border-radius: $switch-handle-size + ($switch-padding * 2);
|
||||
background-color: $color-secondary;
|
||||
}
|
||||
|
||||
&_neutral_active &-track {
|
||||
background-color: $color-text;
|
||||
}
|
||||
|
||||
&_primary_active &-track {
|
||||
background-color: $color-primary;
|
||||
}
|
||||
|
||||
@@ -1,21 +1,22 @@
|
||||
import { FC, useEffect, useRef, useState, ReactNode } from "preact/compat";
|
||||
import { FC, useEffect, useRef, useState } from "preact/compat";
|
||||
import classNames from "classnames";
|
||||
import { ReactNode } from "react";
|
||||
import "./style.scss";
|
||||
|
||||
interface ToggleProps {
|
||||
options: { value: string, title?: string, icon?: ReactNode }[];
|
||||
value: string;
|
||||
onChange: (val: string) => void;
|
||||
label?: string;
|
||||
size?: "medium" | "large";
|
||||
options: {value: string, title?: string, icon?: ReactNode}[]
|
||||
value: string
|
||||
onChange: (val: string) => void
|
||||
label?: string
|
||||
}
|
||||
|
||||
const Toggle: FC<ToggleProps> = ({ options, value, label, size = "medium", onChange }) => {
|
||||
const Toggle: FC<ToggleProps> = ({ options, value, label, onChange }) => {
|
||||
|
||||
const activeRef = useRef<HTMLDivElement>(null);
|
||||
const [position, setPosition] = useState({
|
||||
width: "0px",
|
||||
left: "0px",
|
||||
borderRadius: "0px"
|
||||
});
|
||||
|
||||
const createHandlerChange = (value: string) => () => {
|
||||
@@ -27,25 +28,35 @@ const Toggle: FC<ToggleProps> = ({ options, value, label, size = "medium", onCha
|
||||
setPosition({
|
||||
width: "0px",
|
||||
left: "0px",
|
||||
borderRadius: "0px"
|
||||
});
|
||||
return;
|
||||
}
|
||||
const index = options.findIndex(o => o.value === value);
|
||||
const { width: widthRect } = activeRef.current.getBoundingClientRect();
|
||||
|
||||
const width = widthRect;
|
||||
const left = index * width;
|
||||
let width = widthRect;
|
||||
let left = index * width;
|
||||
let borderRadius = "0";
|
||||
if (index === 0) borderRadius = "16px 0 0 16px";
|
||||
|
||||
setPosition({ width: `${width}px`, left: `${left}px` });
|
||||
if (index === options.length - 1) {
|
||||
borderRadius = "10px";
|
||||
left -= 1;
|
||||
borderRadius = "0 16px 16px 0";
|
||||
}
|
||||
|
||||
if (index !== 0 && (index !== options.length - 1)) {
|
||||
width += 1;
|
||||
left -= 1;
|
||||
}
|
||||
|
||||
|
||||
setPosition({ width: `${width}px`, left: `${left}px`, borderRadius });
|
||||
}, [activeRef, value, options]);
|
||||
|
||||
return (
|
||||
<div
|
||||
className={classNames({
|
||||
"vm-toggles": true,
|
||||
[`vm-toggles_${size}`]: size,
|
||||
})}
|
||||
>
|
||||
<div className="vm-toggles">
|
||||
{label && (
|
||||
<label className="vm-toggles__label">
|
||||
{label}
|
||||
@@ -55,14 +66,15 @@ const Toggle: FC<ToggleProps> = ({ options, value, label, size = "medium", onCha
|
||||
className="vm-toggles-group"
|
||||
style={{ gridTemplateColumns: `repeat(${options.length}, 1fr)` }}
|
||||
>
|
||||
<div
|
||||
{position.borderRadius && <div
|
||||
className="vm-toggles-group__highlight"
|
||||
style={position}
|
||||
/>
|
||||
{options.map((option) => (
|
||||
/>}
|
||||
{options.map((option, i) => (
|
||||
<div
|
||||
className={classNames({
|
||||
"vm-toggles-group-item": true,
|
||||
"vm-toggles-group-item_first": i === 0,
|
||||
"vm-toggles-group-item_active": option.value === value,
|
||||
"vm-toggles-group-item_icon": option.icon && option.title
|
||||
})}
|
||||
|
||||
@@ -20,8 +20,6 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
border-radius: $border-radius-small;
|
||||
background: $color-hover-black;
|
||||
|
||||
&-item {
|
||||
position: relative;
|
||||
@@ -29,68 +27,55 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: $padding-small;
|
||||
border-right: $border-divider;
|
||||
border-top: $border-divider;
|
||||
border-bottom: $border-divider;
|
||||
font-size: $font-size-small;
|
||||
color: $color-text-secondary;
|
||||
font-weight: 500;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
transition: opacity 150ms ease-in, color 150ms ease-in;
|
||||
transition: color 150ms ease-in;
|
||||
z-index: 2;
|
||||
user-select: none;
|
||||
|
||||
&_icon {
|
||||
grid-template-columns: 14px auto;
|
||||
gap: calc($padding-small / 2);
|
||||
&_first {
|
||||
border-radius: 16px 0 0 16px;
|
||||
border-left: $border-divider
|
||||
}
|
||||
|
||||
&:hover:not(&_active) {
|
||||
opacity: 0.8;
|
||||
&:last-child {
|
||||
border-radius: 0 16px 16px 0;
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
&_icon {
|
||||
grid-template-columns: 14px auto;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: $color-primary;
|
||||
}
|
||||
|
||||
&_active {
|
||||
color: $color-text;
|
||||
font-weight: 600;
|
||||
color: $color-primary;
|
||||
border-color: transparent;
|
||||
|
||||
&:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__highlight {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 3px;
|
||||
height: 100%;
|
||||
background-color: rgba($color-primary, 0.08);
|
||||
border: 1px solid $color-primary;
|
||||
transition: left 200ms cubic-bezier(0.280, 0.840, 0.420, 1), border-radius 200ms linear;
|
||||
z-index: 1;
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background-color: $color-background-block;
|
||||
border-radius: $border-radius-small;
|
||||
box-shadow: $box-shadow;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&_large &-group {
|
||||
border-radius: $border-radius-medium;
|
||||
|
||||
&-item {
|
||||
padding: $padding-global $padding-small;
|
||||
|
||||
&_icon {
|
||||
grid-template-columns: 16px auto;
|
||||
gap: $padding-small;
|
||||
}
|
||||
}
|
||||
|
||||
&__highlight {
|
||||
padding: 4px;
|
||||
border-radius: $border-radius-medium;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,14 +0,0 @@
|
||||
export const faviconColors = [
|
||||
"#A1A1AA",
|
||||
"#71717A",
|
||||
"#020202",
|
||||
"#E94600",
|
||||
"#FF7A00",
|
||||
"#F2B705",
|
||||
"#84CC16",
|
||||
"#16B86A",
|
||||
"#00AFAF",
|
||||
"#2979FF",
|
||||
"#8B5CF6",
|
||||
"#E83E9A",
|
||||
] as const;
|
||||
@@ -14,9 +14,6 @@ import useFetchDefaultTimezone from "../../hooks/useFetchDefaultTimezone";
|
||||
import useFetchAppConfig from "../../hooks/useFetchAppConfig";
|
||||
import WebStorageCheck from "../../components/WebStorageCheck/WebStorageCheck";
|
||||
import { migrateStorageToPrefixedKeys } from "../../utils/storage";
|
||||
import {
|
||||
useBrowserTabSync
|
||||
} from "../../components/Configurators/GlobalSettings/BrowserTabController/hooks/useBrowserTabSync";
|
||||
|
||||
const MainLayout: FC = () => {
|
||||
const appModeEnable = getAppModeEnable();
|
||||
@@ -24,7 +21,6 @@ const MainLayout: FC = () => {
|
||||
const { pathname } = useLocation();
|
||||
const [searchParams, setSearchParams] = useSearchParams();
|
||||
|
||||
useBrowserTabSync();
|
||||
useFetchDashboards();
|
||||
useFetchDefaultTimezone();
|
||||
useFetchAppConfig();
|
||||
|
||||
@@ -1,29 +0,0 @@
|
||||
import faviconRaw from "../../assets/favicon.svg?raw";
|
||||
|
||||
export const createFaviconUrl = (color = "#020202"): string => {
|
||||
const svgDocument = new DOMParser().parseFromString(faviconRaw, "image/svg+xml");
|
||||
const svg = svgDocument.documentElement;
|
||||
|
||||
if (svg.localName !== "svg") {
|
||||
throw new Error("Invalid favicon SVG");
|
||||
}
|
||||
|
||||
svg.setAttribute("fill", color);
|
||||
|
||||
const serializedSvg = new XMLSerializer().serializeToString(svg);
|
||||
return `data:image/svg+xml;charset=utf-8,${encodeURIComponent(serializedSvg)}`;
|
||||
};
|
||||
|
||||
export const updateFaviconColor = (color = "#020202"): void => {
|
||||
const favicon = document.querySelector<HTMLLinkElement>("#favicon");
|
||||
if (favicon) {
|
||||
favicon.href = createFaviconUrl(color);
|
||||
}
|
||||
|
||||
const maskIcon = document.querySelector<HTMLLinkElement>("#mask-icon");
|
||||
if (maskIcon) {
|
||||
maskIcon.setAttribute("color", color);
|
||||
}
|
||||
};
|
||||
|
||||
export const getFaviconStorageKey = () => window.location.pathname.replace(/\/+$/, "") || "/";
|
||||
@@ -17,11 +17,7 @@ export const ALL_STORAGE_KEYS = [
|
||||
"POINTS_SHOW_ALL",
|
||||
] as const;
|
||||
|
||||
export type FaviconStorageKey = `FAVICON_COLOR:${string}`;
|
||||
|
||||
export type StorageKeys =
|
||||
| (typeof ALL_STORAGE_KEYS)[number]
|
||||
| FaviconStorageKey;
|
||||
export type StorageKeys = (typeof ALL_STORAGE_KEYS)[number];
|
||||
|
||||
type PrefixedStorageKeys = `${typeof STORAGE_PREFIX}${StorageKeys}`;
|
||||
|
||||
@@ -62,10 +58,7 @@ export const getFromStorage = (key: StorageKeys, withPrefix = true): undefined |
|
||||
|
||||
export const removeFromStorage = (keys: StorageKeys[], withPrefix = true): void => {
|
||||
const storageKeys = withPrefix ? keys.map(toPrefixedKey) : keys;
|
||||
storageKeys.forEach(k => {
|
||||
window.localStorage.removeItem(k);
|
||||
window.dispatchEvent(new StorageEvent("storage", { key: k }));
|
||||
});
|
||||
storageKeys.forEach(k => window.localStorage.removeItem(k));
|
||||
};
|
||||
|
||||
/**
|
||||
|
||||
@@ -205,21 +205,19 @@ export const getUTCByTimezone = (timezone: string) => {
|
||||
};
|
||||
|
||||
export const getTimezoneList = (search = "") => {
|
||||
const normalizedSearch = search.toLowerCase();
|
||||
const regexp = new RegExp(search, "i");
|
||||
|
||||
return supportedTimezones.reduce((acc: { [key: string]: Timezone[] }, region) => {
|
||||
return supportedTimezones.reduce((acc: {[key: string]: Timezone[]}, region) => {
|
||||
const zone = (region.match(/^(.*?)\//) || [])[1] || "unknown";
|
||||
const utc = getUTCByTimezone(region);
|
||||
const utcForSearch = utc.replace(/^UTC/, "");
|
||||
const utcForSearch = utc.replace(/UTC|0/, "");
|
||||
const regionForSearch = region.replace(/[/_]/g, " ");
|
||||
|
||||
const item = {
|
||||
region,
|
||||
utc,
|
||||
search: `${region} ${utc} ${regionForSearch} ${utcForSearch}`
|
||||
};
|
||||
|
||||
const includeZone = !normalizedSearch || item.search.toLowerCase().includes(normalizedSearch);
|
||||
const includeZone = !search || (search && regexp.test(item.search));
|
||||
|
||||
if (includeZone && acc[zone]) {
|
||||
acc[zone].push(item);
|
||||
|
||||
@@ -50,13 +50,6 @@ export default defineConfig(() => {
|
||||
return "vendor";
|
||||
}
|
||||
},
|
||||
assetFileNames: (assetInfo) => {
|
||||
if (assetInfo.names.includes("favicon.svg")) {
|
||||
return "assets/favicon.svg";
|
||||
}
|
||||
|
||||
return "assets/[name]-[hash][extname]";
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
@@ -75,7 +75,7 @@ groups:
|
||||
Consider to limit the ingestion rate, decrease retention or scale the disk space if possible."
|
||||
|
||||
- alert: RequestErrorsToAPI
|
||||
expr: increase(vm_http_request_errors_total{path=~".+", path!="*"}[5m]) > 0
|
||||
expr: increase(vm_http_request_errors_total[5m]) > 0
|
||||
for: 15m
|
||||
labels:
|
||||
severity: warning
|
||||
@@ -83,24 +83,8 @@ groups:
|
||||
annotations:
|
||||
dashboard: "{{ $externalURL }}/d/oS7Bi_0Wz?viewPanel=52&var-instance={{ $labels.instance }}"
|
||||
summary: "Too many errors served for {{ $labels.job }} path {{ $labels.path }} (instance {{ $labels.instance }})"
|
||||
description: |
|
||||
Requests to path {{ $labels.path }} are receiving errors.
|
||||
Please verify if clients are sending correct requests.
|
||||
|
||||
# Auth errors and unknown paths should be handled by a different alert
|
||||
# See https://github.com/VictoriaMetrics/VictoriaMetrics/blob/fdd9a221df835daa378ae2e6c9f12e4e3be79c76/lib/httpserver/httpserver.go#L589-L591
|
||||
- alert: RequestErrorsToUnknownPaths
|
||||
expr: sum(increase(vm_http_request_errors_total{path=~"^(\*|)$"}[5m])) by(job, instance, reason) > 0
|
||||
for: 15m
|
||||
labels:
|
||||
severity: warning
|
||||
show_at: dashboard
|
||||
annotations:
|
||||
dashboard: "{{ $externalURL }}/d/oS7Bi_0Wz?viewPanel=52&var-instance={{ $labels.instance }}"
|
||||
summary: "Too many errors served for {{ $labels.job }} with reason {{ $labels.reason }} (instance {{ $labels.instance }})"
|
||||
description: |
|
||||
Requests are failing with reason {{ $labels.reason }}.
|
||||
Please verify if clients are sending correct requests.
|
||||
description: "Requests to path {{ $labels.path }} are receiving errors.
|
||||
Please verify if clients are sending correct requests."
|
||||
|
||||
- alert: RPCErrors
|
||||
expr: |
|
||||
|
||||
@@ -75,7 +75,7 @@ groups:
|
||||
Consider to limit the ingestion rate, decrease retention or scale the disk space if possible."
|
||||
|
||||
- alert: RequestErrorsToAPI
|
||||
expr: increase(vm_http_request_errors_total{path=~".+"}[5m]) > 0
|
||||
expr: increase(vm_http_request_errors_total[5m]) > 0
|
||||
for: 15m
|
||||
labels:
|
||||
severity: warning
|
||||
@@ -85,21 +85,6 @@ groups:
|
||||
description: "Requests to path {{ $labels.path }} are receiving errors.
|
||||
Please verify if clients are sending correct requests."
|
||||
|
||||
# Auth errors and unknown paths should be handled by a different alert
|
||||
# See https://github.com/VictoriaMetrics/VictoriaMetrics/blob/fdd9a221df835daa378ae2e6c9f12e4e3be79c76/lib/httpserver/httpserver.go#L589-L591
|
||||
- alert: RequestErrorsToUnknownPaths
|
||||
expr: sum(increase(vm_http_request_errors_total{path=~"^(\*|)$"}[5m])) by(job, instance, reason) > 0
|
||||
for: 15m
|
||||
labels:
|
||||
severity: warning
|
||||
show_at: dashboard
|
||||
annotations:
|
||||
dashboard: "{{ $externalURL }}/d/oS7Bi_0Wz?viewPanel=52&var-instance={{ $labels.instance }}"
|
||||
summary: "Too many errors served for {{ $labels.job }} with reason {{ $labels.reason }} (instance {{ $labels.instance }})"
|
||||
description: |
|
||||
Requests are failing with reason {{ $labels.reason }}.
|
||||
Please verify if clients are sending correct requests.
|
||||
|
||||
- alert: TooHighChurnRate
|
||||
expr: |
|
||||
(
|
||||
|
||||
@@ -1,11 +1,3 @@
|
||||
---
|
||||
build:
|
||||
list: never
|
||||
publishResources: false
|
||||
render: never
|
||||
sitemap:
|
||||
disable: true
|
||||
---
|
||||
VictoriaMetrics Observability Stack integrates with AI assistants through [MCP servers](https://docs.victoriametrics.com/ai-tools/#mcp-servers)
|
||||
and [agent skills](https://docs.victoriametrics.com/ai-tools/#agent-skills).
|
||||
The integrations allow AI agents and automation tools to query Metrics, Logs, and Traces, analyze telemetry data,
|
||||
|
||||
@@ -1,11 +1,3 @@
|
||||
---
|
||||
build:
|
||||
list: never
|
||||
publishResources: false
|
||||
render: never
|
||||
sitemap:
|
||||
disable: true
|
||||
---
|
||||
Several VictoriaMetrics components can connect to cloud storage to read or write object data.
|
||||
|
||||
The following table shows the supported types of storage for each component:
|
||||
|
||||
@@ -1,11 +1,3 @@
|
||||
---
|
||||
build:
|
||||
list: never
|
||||
publishResources: false
|
||||
render: never
|
||||
sitemap:
|
||||
disable: true
|
||||
---
|
||||
Using [Grafana](https://grafana.com/) with [vmauth](https://docs.victoriametrics.com/victoriametrics/vmauth/) is an effective way to provide [multi-tenant](https://docs.victoriametrics.com/victoriametrics/cluster-victoriametrics/#multitenancy) access to your metrics, logs, and traces.
|
||||
vmauth provides a way to authenticate users using [JWT tokens](https://en.wikipedia.org/wiki/JSON_Web_Token) {{% available_from "v1.138.0" %}} issued by an external identity provider.
|
||||
Those tokens can include information about the user and their tenant, which vmauth can use to restrict access so users only see metrics in their own tenant.
|
||||
|
||||
@@ -1,11 +1,3 @@
|
||||
---
|
||||
build:
|
||||
list: never
|
||||
publishResources: false
|
||||
render: never
|
||||
sitemap:
|
||||
disable: true
|
||||
---
|
||||
VictoriaMetrics software provides native [OpenTelemetry](https://opentelemetry.io/) ingestion across **metrics**, **logs**, and **traces** via dedicated components.
|
||||
This allows running OpenTelemetry-based observability pipeline with VictoriaMetrics software as your backend.
|
||||
|
||||
@@ -96,4 +88,4 @@ Depending on the Grafana datasource plugin there could be multiple correlations
|
||||
1. Trace to metrics, metric to logs, metric to traces - see [correlations via VictoriaMetrics plugin](https://docs.victoriametrics.com/victoriametrics/integrations/grafana/datasource/#correlations).
|
||||
1. Metrics to logs or traces correlations are possible via Prometheus datasource as well.
|
||||
1. Plugins Tempo, Jaeger, and Zipkin can correlate with logs or metrics using [Trace to logs](https://grafana.com/docs/grafana/latest/explore/trace-integration/#trace-to-logs)
|
||||
and [Trace to metrics](https://grafana.com/docs/grafana/latest/visualizations/explore/trace-integration/#trace-to-metrics) feature.
|
||||
and [Trace to metrics](https://grafana.com/docs/grafana/latest/visualizations/explore/trace-integration/#trace-to-metrics) feature.
|
||||
@@ -1,11 +1,3 @@
|
||||
---
|
||||
build:
|
||||
list: never
|
||||
publishResources: false
|
||||
render: never
|
||||
sitemap:
|
||||
disable: true
|
||||
---
|
||||
VictoriaMetrics offers public playgrounds where you can try the full observability stack online.
|
||||
|
||||
Some playgrounds are based on the [OpenTelemetry Astronomy Shop demo](https://github.com/open-telemetry/opentelemetry-demo), a sample microservices application that generates realistic metrics, logs, and traces. Other playgrounds use benchmark workloads such as [prometheus-benchmark](https://github.com/VictoriaMetrics/prometheus-benchmark) to demonstrate ingestion and query performance for Prometheus-compatible systems.
|
||||
@@ -166,4 +158,4 @@ Iximiuz Labs provides various [learning-by-doing resources for VictoriaMetrics](
|
||||
- [VictoriaMetrics cluster](https://labs.iximiuz.com/playgrounds/victoriametrics-cluster)
|
||||
- [VictoriaMetrics on Kubernetes](https://labs.iximiuz.com/playgrounds/victoriametrics-kubernetes)
|
||||
|
||||
Iximiuz Labs requires a [free account](https://labs.iximiuz.com/signup) to access the materials.
|
||||
Iximiuz Labs requires a [free account](https://labs.iximiuz.com/signup) to access the materials.
|
||||
@@ -291,7 +291,7 @@ If you need multi-AZ setup, then it is recommended running independent clusters
|
||||
into all the cluster - see [these docs](https://docs.victoriametrics.com/victoriametrics/vmagent/#multitenancy) for details.
|
||||
Then an additional `vmselect` nodes can be configured for reading the data from multiple clusters according to [these docs](#multi-level-cluster-setup).
|
||||
|
||||
See [VMDistributed](https://docs.victoriametrics.com/operator/resources/vmdistributed/) Kubernetes operator resource for an example.
|
||||
See [victoria-metrics-distributed chart](https://docs.victoriametrics.com/helm/victoria-metrics-distributed/) for an example.
|
||||
|
||||
## Cluster setup
|
||||
|
||||
|
||||
@@ -1306,7 +1306,7 @@ since it uses lower amounts of RAM, CPU and network bandwidth than Prometheus.
|
||||
If you use identically configured [vmagent](https://docs.victoriametrics.com/victoriametrics/vmagent/) instances for collecting the same data
|
||||
and sending it to VictoriaMetrics, then do not forget enabling [deduplication](#deduplication) at VictoriaMetrics side.
|
||||
|
||||
See [VMDistributed](https://docs.victoriametrics.com/operator/resources/vmdistributed/) Kubernetes operator resource for an example.
|
||||
See [victoria-metrics-distributed chart](https://docs.victoriametrics.com/helm/victoria-metrics-distributed/) for an example.
|
||||
|
||||
## Deduplication
|
||||
|
||||
|
||||
@@ -25,12 +25,10 @@ The sandbox cluster installation runs under the constant load generated by
|
||||
See also [LTS releases](https://docs.victoriametrics.com/victoriametrics/lts-releases/).
|
||||
|
||||
## tip
|
||||
|
||||
* FEATURE: [vmui](https://docs.victoriametrics.com/victoriametrics/single-server-victoriametrics/#vmui): add an option to customize the favicon color. This makes it easier to distinguish between different installations opened in multiple browser tabs. See [#11329](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/11329).
|
||||
* FEATURE: [alerts](https://github.com/VictoriaMetrics/VictoriaMetrics/blob/master/deployment/docker/rules): limit the `RequestErrorsToAPI` alert to known API paths. Introduce a new `RequestErrorsToUnknownPaths` alert for authentication failures and requests to unknown paths. See [#11200](https://github.com/VictoriaMetrics/VictoriaMetrics/pull/11200).
|
||||
|
||||
* FEATURE: all VictoriaMetrics components: expose the `process_cpu_cgroup_limited` metric, which is set to `1` when the cgroup CPU quota is lower than the number of logical CPU cores available to the process and `0` otherwise.
|
||||
* FEATURE: [vmsingle](https://docs.victoriametrics.com/victoriametrics/single-server-victoriametrics/) and `vmstorage` in [VictoriaMetrics cluster](https://docs.victoriametrics.com/victoriametrics/cluster-victoriametrics/): hint the OS with `fadvise(FADV_RANDOM)` and `madvise(MADV_RANDOM)` that data and index files are read at random offsets during queries. This disables OS readahead for these files and reduces disk read amplification on hosts with high `read_ahead_kb` settings. The hints can be disabled with the `-fs.disableFadviseRandomRead` command-line flag.
|
||||
* BUGFIX: [vmagent](https://docs.victoriametrics.com/victoriametrics/vmagent/): include `vm_account_id` and `vm_project_id` labels in the instance identity used by [monitoring data exchange](https://docs.victoriametrics.com/victoriametrics/vmagent/#monitoring-data-exchange) filtering. Previously, when [multitenant handlers](https://docs.victoriametrics.com/victoriametrics/vmagent/#multitenancy) were enabled, series from different tenants sharing the same `job` and `instance` labels could be misidentified as coming from a discovered VictoriaMetrics instance and leak into the `-remoteWrite.mdx.enable` destination. See [#11381](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/11381).
|
||||
* BUGFIX: [vmsingle](https://docs.victoriametrics.com/victoriametrics/single-server-victoriametrics/), `vmselect` in [VictoriaMetrics cluster](https://docs.victoriametrics.com/victoriametrics/cluster-victoriametrics/) and [vmctl](https://docs.victoriametrics.com/victoriametrics/vmctl/): properly parse small fractional Unix timestamps in timestamp args such as `start` and `end` in `/api/v1/query_range` and `--vm-native-filter-time-start` and `--vm-native-filter-time-end` in `vmctl`. Previously, fractional Unix timestamps with the integer part below `9223372` were interpreted with the wrong unit, for example `12.0` was parsed as `12000` seconds instead of `12` seconds. See [#11324](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/11324).
|
||||
* BUGFIX: [vmui](https://docs.victoriametrics.com/victoriametrics/single-server-victoriametrics/#vmui): respect the custom query step specified via `g0.step_input` when opening a URL. Previously, it could be reset to the automatically calculated step and potentially cause dashboards to freeze. See [#11137](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/11137).
|
||||
|
||||
## [v1.149.0](https://github.com/VictoriaMetrics/VictoriaMetrics/releases/tag/v1.149.0)
|
||||
|
||||
@@ -51,7 +49,6 @@ Released at 2026-08-05
|
||||
* FEATURE: [vmctl](https://docs.victoriametrics.com/victoriametrics/vmctl/): support [Prometheus native histograms](https://prometheus.io/docs/specs/native_histograms/) migration in [remote read mode](https://docs.victoriametrics.com/victoriametrics/vmctl/remoteread/). Native histograms are converted into `_count`, `_sum` and `_bucket` series with `vmrange` labels in the same way as VictoriaMetrics [converts native histograms received via Prometheus remote write protocol](https://docs.victoriametrics.com/victoriametrics/integrations/prometheus/#native-histograms), except that for native histograms with custom buckets the original bucket bounds are preserved instead of being estimated with the exponential formula. Previously native histograms were silently ignored in `SAMPLES` mode, while in stream mode the migration failed with `EOF` error. See [#11292](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/11292). Thanks to @liuxu623 for contribution.
|
||||
* FEATURE: `vminsert` in [VictoriaMetrics cluster](https://docs.victoriametrics.com/victoriametrics/cluster-victoriametrics/): enable [slowness-based re-routing](https://docs.victoriametrics.com/victoriametrics/cluster-victoriametrics/#slowness-based-re-routing) by default. Previously, `-disableRerouting` defaulted to `true`, which limited ingestion throughput to the slowest `vmstorage` node. Now `-disableRerouting` defaults to `false`, so `vminsert` automatically routes data away from the slowest `vmstorage` node, improving overall ingestion performance. Slowness re-routing is automatically disabled when `-replicationFactor` is greater than 1. See [#11287](https://github.com/VictoriaMetrics/VictoriaMetrics/pull/11287).
|
||||
* FEATURE: [vmui](https://docs.victoriametrics.com/victoriametrics/single-server-victoriametrics/#vmui): persist the selected auto-refresh interval in the URL. See [VictoriaLogs#1310](https://github.com/VictoriaMetrics/VictoriaLogs/issues/1310).
|
||||
* FEATURE: [vmagent](https://docs.victoriametrics.com/victoriametrics/vmagent/) and [vmalert](https://docs.victoriametrics.com/victoriametrics/vmalert/): add client side least-loaded load-balancing with `DNS` discovery. See [#2388](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/2388) and these [vmagent DNS URLs](https://docs.victoriametrics.com/victoriametrics/vmagent/#dns-urls), [vmalert DNS URLs](https://docs.victoriametrics.com/victoriametrics/vmalert/#dns-urls).
|
||||
|
||||
* BUGFIX: [MetricsQL](https://docs.victoriametrics.com/victoriametrics/metricsql/): properly drop data points filtered out by an inner [comparison operation](https://prometheus.io/docs/prometheus/latest/querying/operators/#comparison-binary-operators) when its result is used on the right side of another comparison. Previously, queries like `foo != (bar > 100)` could return unexpected results because filtered-out data points are represented internally as `NaN`, and `value != NaN` evaluates to `true`. Comparisons against explicitly present `NaN` values keep the previous behavior. See [#10018](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/10018). Thanks to @zasdaym for contribution.
|
||||
* BUGFIX: [vmagent](https://docs.victoriametrics.com/victoriametrics/vmagent/) and [vmsingle](https://docs.victoriametrics.com/victoriametrics/single-server-victoriametrics/): ignore HTTP proxy environment variables when scraping targets over Unix domain sockets. See [#11318](https://github.com/VictoriaMetrics/VictoriaMetrics/pull/11318). Thanks to @lwmacct for contribution.
|
||||
@@ -89,6 +86,7 @@ Released at 2026-07-20
|
||||
* FEATURE: [vmagent](https://docs.victoriametrics.com/victoriametrics/vmagent/) and [vmsingle](https://docs.victoriametrics.com/victoriametrics/single-server-victoriametrics/): support scraping metrics over Unix domain sockets. The socket path can be configured via the `__unix_socket__` target label. See [#11156](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/11156). Thanks to @vinyas-bharadwaj for contribution.
|
||||
* FEATURE: [vmagent](https://docs.victoriametrics.com/victoriametrics/vmagent/) and [vmsingle](https://docs.victoriametrics.com/victoriametrics/single-server-victoriametrics/): Improve background discovery performance for [http_sd](https://docs.victoriametrics.com/victoriametrics/sd_configs/#http_sd_configs) discovery. See [#8838](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/8838).
|
||||
* FEATURE: [vmagent](https://docs.victoriametrics.com/victoriametrics/vmagent/) and [vmsingle](https://docs.victoriametrics.com/victoriametrics/single-server-victoriametrics/): allow overriding `max_scrape_size` on a per-target basis via the `__max_scrape_size__` label during target relabeling. See [#11188](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/11188).
|
||||
* FEATURE: [vmagent](https://docs.victoriametrics.com/victoriametrics/vmagent/) and [vmalert](https://docs.victoriametrics.com/victoriametrics/vmalert/): add client side least-loaded load-balancing with `DNS` discovery. See [#2388](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/2388) and these [vmagent DNS URLs](https://docs.victoriametrics.com/victoriametrics/vmagent/#dns-urls), [vmalert DNS URLs](https://docs.victoriametrics.com/victoriametrics/vmalert/#dns-urls).
|
||||
* FEATURE: [vmstorage](https://docs.victoriametrics.com/victoriametrics/cluster-victoriametrics/) and [vmsingle](https://docs.victoriametrics.com/victoriametrics/single-server-victoriametrics/): add `-maxBackfillAge` command-line flag for limiting ingestion of samples with historical timestamps, for example, when older data has been moved between storage tiers (nvme/hdd, hot/cold). See [#11199](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/11199). Thanks to @AshwinRamaniPsg for contribution.
|
||||
* FEATURE: [vmagent](https://docs.victoriametrics.com/victoriametrics/vmagent/): automatically preload relabeling rules configured via `-remoteWrite.relabelConfig` and `-remoteWrite.urlRelabelConfig` in the [metrics relabel debug UI](https://docs.victoriametrics.com/victoriametrics/relabeling/#relabel-debugging). See [#9918](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/9918).
|
||||
|
||||
@@ -110,8 +108,6 @@ Released at 2026-07-06
|
||||
|
||||
**Update Note 1:** [vmagent](https://docs.victoriametrics.com/victoriametrics/vmagent/): contains a bug that causes increased CPU and memory usage when `-remoteWrite.urlRelabelConfig` or `-remoteWrite.streamAggr.config` flags are used. The bug was introduced in [#10854](https://github.com/VictoriaMetrics/VictoriaMetrics/pull/10854). Upgrade to v1.148.0 or rollback to v1.146.0. See [#11250](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/11250).
|
||||
|
||||
**Update Note 2:** [vmalert](https://docs.victoriametrics.com/victoriametrics/vmalert/): vmalert updates VictoriaLogs LogsQL query parser to [v1.51.0](https://docs.victoriametrics.com/victorialogs/changelog/#v1510), which contains a breaking change in LogsQL filter pipes handling. If you used vmalert with `vlogs` query type and query expressions contained deprecated syntax - these rules will fail the validation on vmalert restart. Please review the [VictoriaLogs v1.51.0 changelog](https://docs.victoriametrics.com/victorialogs/changelog/#v1510) and update your alerting rules accordingly before upgrading.
|
||||
|
||||
* SECURITY: upgrade base docker image (Alpine) from 3.23.4 to 3.24.1. See [Alpine 3.24.1 release notes](https://www.alpinelinux.org/posts/Alpine-3.24.1-released.html).
|
||||
|
||||
* FEATURE: [vmauth](https://docs.victoriametrics.com/victoriametrics/vmauth/): add `default_vm_access_claim` field into `jwt` section of auth config. It could be used at [JWT claim placeholders](https://docs.victoriametrics.com/victoriametrics/vmauth/#jwt-claim-based-request-templating), if `JWT` token doesn't have `vm_access` claim. See [#11054](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/11054).
|
||||
@@ -445,8 +441,6 @@ Released at 2026-07-03
|
||||
All these fixes are also included in [the latest community release](https://github.com/VictoriaMetrics/VictoriaMetrics/releases/latest).
|
||||
The v1.136.x line will be supported for at least 12 months since [v1.136.0](https://docs.victoriametrics.com/victoriametrics/changelog/#v11360) release**
|
||||
|
||||
**Update Note 1:** [vmalert](https://docs.victoriametrics.com/victoriametrics/vmalert/): vmalert updates VictoriaLogs LogsQL query parser to [v1.51.0](https://docs.victoriametrics.com/victorialogs/changelog/#v1510), which contains a breaking change in LogsQL filter pipes handling. If you used vmalert with `vlogs` query type and query expressions contained deprecated syntax - these rules will fail the validation on vmalert restart. Please review the [VictoriaLogs v1.51.0 changelog](https://docs.victoriametrics.com/victorialogs/changelog/#v1510) and update your alerting rules accordingly before upgrading.
|
||||
|
||||
* SECURITY: upgrade base docker image (Alpine) from 3.23.4 to 3.24.1. See [Alpine 3.24.1 release notes](https://www.alpinelinux.org/posts/Alpine-3.24.1-released.html).
|
||||
|
||||
* BUGFIX: `vminsert` in [VictoriaMetrics cluster](https://docs.victoriametrics.com/victoriametrics/cluster-victoriametrics/) and [vmsingle](https://docs.victoriametrics.com/victoriametrics/single-server-victoriametrics/): properly check values range for the limits configured with flags `-maxLabelsPerTimeseries`, `-maxLabelNameLen` and `-maxLabelValueLen`. It must be in range `1..65535`. See [#11128](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/11128).
|
||||
@@ -857,8 +851,6 @@ Released at 2026-07-03
|
||||
All these fixes are also included in [the latest community release](https://github.com/VictoriaMetrics/VictoriaMetrics/releases/latest).
|
||||
The v1.122.x line will be supported for at least 12 months since [v1.122.0](https://docs.victoriametrics.com/victoriametrics/changelog/#v11220) release**
|
||||
|
||||
**Update Note 1:** [vmalert](https://docs.victoriametrics.com/victoriametrics/vmalert/): vmalert updates VictoriaLogs LogsQL query parser to [v1.51.0](https://docs.victoriametrics.com/victorialogs/changelog/#v1510), which contains a breaking change in LogsQL filter pipes handling. If you used vmalert with `vlogs` query type and query expressions contained deprecated syntax - these rules will fail the validation on vmalert restart. Please review the [VictoriaLogs v1.51.0 changelog](https://docs.victoriametrics.com/victorialogs/changelog/#v1510) and update your alerting rules accordingly before upgrading.
|
||||
|
||||
* SECURITY: upgrade base docker image (Alpine) from 3.23.4 to 3.24.1. See [Alpine 3.24.1 release notes](https://www.alpinelinux.org/posts/Alpine-3.24.1-released.html).
|
||||
|
||||
* BUGFIX: `vminsert` in [VictoriaMetrics cluster](https://docs.victoriametrics.com/victoriametrics/cluster-victoriametrics/) and [vmsingle](https://docs.victoriametrics.com/victoriametrics/single-server-victoriametrics/): properly check values range for the limits configured with flags `-maxLabelsPerTimeseries`, `-maxLabelNameLen` and `-maxLabelValueLen`. It must be in range `1..65535`. See [#11128](https://github.com/VictoriaMetrics/VictoriaMetrics/issues/11128).
|
||||
|
||||
@@ -21,7 +21,7 @@ func AvailableCPUs() int {
|
||||
}
|
||||
|
||||
func init() {
|
||||
cpuQuota := getCPUQuota()
|
||||
cpuQuota, cpuCgroupLimited := getCPUQuota()
|
||||
if cpuQuota > 0 {
|
||||
updateGOMAXPROCSToCPUQuota(cpuQuota)
|
||||
}
|
||||
@@ -32,6 +32,12 @@ func init() {
|
||||
metrics.NewGauge(`process_cpu_cores_available`, func() float64 {
|
||||
return cpuCoresAvailable
|
||||
})
|
||||
metrics.NewGauge(`process_cpu_cgroup_limited`, func() float64 {
|
||||
if cpuCgroupLimited {
|
||||
return 1
|
||||
}
|
||||
return 0
|
||||
})
|
||||
}
|
||||
|
||||
// updateGOMAXPROCSToCPUQuota updates GOMAXPROCS to cpuQuota if GOMAXPROCS isn't set in environment var.
|
||||
@@ -60,17 +66,21 @@ func updateGOMAXPROCSToCPUQuota(cpuQuota float64) {
|
||||
runtime.GOMAXPROCS(gomaxprocs)
|
||||
}
|
||||
|
||||
func getCPUQuota() float64 {
|
||||
func getCPUQuota() (float64, bool) {
|
||||
cpuQuota, err := getCPUQuotaGeneric()
|
||||
if err != nil {
|
||||
return 0
|
||||
return 0, false
|
||||
}
|
||||
if cpuQuota <= 0 {
|
||||
// The quota isn't set. This may be the case in multilevel containers.
|
||||
// See https://github.com/VictoriaMetrics/VictoriaMetrics/issues/685#issuecomment-674423728
|
||||
return getOnlineCPUCount()
|
||||
return getOnlineCPUCount(), false
|
||||
}
|
||||
return cpuQuota
|
||||
return cpuQuota, isCPUCgroupLimited(cpuQuota, runtime.NumCPU())
|
||||
}
|
||||
|
||||
func isCPUCgroupLimited(cpuQuota float64, cpuCount int) bool {
|
||||
return cpuQuota > 0 && cpuQuota < float64(cpuCount)
|
||||
}
|
||||
|
||||
func getCPUQuotaGeneric() (float64, error) {
|
||||
|
||||
@@ -4,6 +4,23 @@ import (
|
||||
"testing"
|
||||
)
|
||||
|
||||
func TestIsCPUCgroupLimited(t *testing.T) {
|
||||
f := func(cpuQuota float64, cpuCount int, expected bool) {
|
||||
t.Helper()
|
||||
got := isCPUCgroupLimited(cpuQuota, cpuCount)
|
||||
if got != expected {
|
||||
t.Fatalf("unexpected result from isCPUCgroupLimited(%f, %d); got %v; want %v", cpuQuota, cpuCount, got, expected)
|
||||
}
|
||||
}
|
||||
|
||||
f(-1, 8, false)
|
||||
f(0, 8, false)
|
||||
f(8, 8, false)
|
||||
f(16, 8, false)
|
||||
f(7.5, 8, true)
|
||||
f(0.5, 8, true)
|
||||
}
|
||||
|
||||
func TestCountCPUs(t *testing.T) {
|
||||
f := func(s string, nExpected int) {
|
||||
t.Helper()
|
||||
|
||||
@@ -8,3 +8,13 @@ func fadviseSequentialRead(_ *os.File, _ bool) error {
|
||||
// TODO: implement this properly
|
||||
return nil
|
||||
}
|
||||
|
||||
func fadviseRandomRead(_ *os.File) error {
|
||||
// TODO: implement this properly
|
||||
return nil
|
||||
}
|
||||
|
||||
func madviseRandomRead(_ []byte) error {
|
||||
// TODO: implement this properly
|
||||
return nil
|
||||
}
|
||||
|
||||
@@ -8,3 +8,13 @@ func fadviseSequentialRead(f *os.File, prefetch bool) error {
|
||||
// TODO: implement this properly
|
||||
return nil
|
||||
}
|
||||
|
||||
func fadviseRandomRead(_ *os.File) error {
|
||||
// TODO: implement this properly
|
||||
return nil
|
||||
}
|
||||
|
||||
func madviseRandomRead(_ []byte) error {
|
||||
// TODO: implement this properly
|
||||
return nil
|
||||
}
|
||||
|
||||
@@ -6,3 +6,13 @@ func fadviseSequentialRead(f *os.File, prefetch bool) error {
|
||||
// TODO: implement this properly
|
||||
return nil
|
||||
}
|
||||
|
||||
func fadviseRandomRead(_ *os.File) error {
|
||||
// TODO: implement this properly
|
||||
return nil
|
||||
}
|
||||
|
||||
func madviseRandomRead(_ []byte) error {
|
||||
// TODO: implement this properly
|
||||
return nil
|
||||
}
|
||||
|
||||
@@ -20,3 +20,18 @@ func fadviseSequentialRead(f *os.File, prefetch bool) error {
|
||||
}
|
||||
return nil
|
||||
}
|
||||
|
||||
func fadviseRandomRead(f *os.File) error {
|
||||
fd := int(f.Fd())
|
||||
if err := unix.Fadvise(fd, 0, 0, unix.FADV_RANDOM); err != nil {
|
||||
return fmt.Errorf("error returned from unix.Fadvise(FADV_RANDOM): %w", err)
|
||||
}
|
||||
return nil
|
||||
}
|
||||
|
||||
func madviseRandomRead(data []byte) error {
|
||||
if err := unix.Madvise(data, unix.MADV_RANDOM); err != nil {
|
||||
return fmt.Errorf("error returned from unix.Madvise(MADV_RANDOM): %w", err)
|
||||
}
|
||||
return nil
|
||||
}
|
||||
|
||||
@@ -116,6 +116,16 @@ func fadviseSequentialRead(_ *os.File, _ bool) error {
|
||||
return nil
|
||||
}
|
||||
|
||||
// stub
|
||||
func fadviseRandomRead(_ *os.File) error {
|
||||
return nil
|
||||
}
|
||||
|
||||
// stub
|
||||
func madviseRandomRead(_ []byte) error {
|
||||
return nil
|
||||
}
|
||||
|
||||
// https://docs.microsoft.com/en-us/windows/win32/api/minwinbase/ns-minwinbase-overlapped
|
||||
func newOverlapped() (*windows.Overlapped, error) {
|
||||
event, err := windows.CreateEvent(nil, 1, 1, nil)
|
||||
|
||||
@@ -17,6 +17,11 @@ var disableMmap = flag.Bool("fs.disableMmap", is32BitPtr, "Whether to use pread(
|
||||
"By default, mmap() is used for 64-bit arches and pread() is used for 32-bit arches, since they cannot read data files bigger than 2^32 bytes in memory. "+
|
||||
"mmap() is usually faster for reading small data chunks than pread()")
|
||||
|
||||
var disableFadviseRandomRead = flag.Bool("fs.disableFadviseRandomRead", false, "Whether to disable fadvise(FADV_RANDOM) and madvise(MADV_RANDOM) hints "+
|
||||
"for data files opened for random access. These hints disable OS readahead for such files. This reduces the amount of unneeded data read from disk "+
|
||||
"during queries, which select small number of blocks scattered across big data files. "+
|
||||
"Disabling the hints may improve performance for queries, which read the most of the data in big data files")
|
||||
|
||||
var disableMincore = flag.Bool("fs.disableMincore", false, "Whether to disable the mincore() syscall for checking mmap()ed files. "+
|
||||
"By default, mincore() is used to detect whether mmap()ed file pages are resident in memory. "+
|
||||
"Disabling mincore() may be needed on older ZFS filesystems (below 2.1.5), since it may trigger ZFS bug. "+
|
||||
@@ -50,6 +55,9 @@ type ReaderAt struct {
|
||||
mrLock sync.Mutex
|
||||
|
||||
useLocalStats bool
|
||||
|
||||
// useRandomReadHint instructs hinting the OS that the file is read at random offsets.
|
||||
useRandomReadHint bool
|
||||
}
|
||||
|
||||
// Path returns path to r.
|
||||
@@ -103,6 +111,9 @@ func (r *ReaderAt) getMmapReader() *mmapReader {
|
||||
mr = r.mr.Load()
|
||||
if mr == nil {
|
||||
mr = newMmapReaderFromPath(r.path)
|
||||
if r.useRandomReadHint && !*disableFadviseRandomRead {
|
||||
mr.mustHintRandomRead(r.path)
|
||||
}
|
||||
r.mr.Store(mr)
|
||||
}
|
||||
r.mrLock.Unlock()
|
||||
@@ -155,10 +166,14 @@ func (r *ReaderAt) MustFadviseSequentialRead(prefetch bool) {
|
||||
|
||||
// MustOpenReaderAt opens ReaderAt for reading from the file located at path.
|
||||
//
|
||||
// The OS is hinted that the file is read at random offsets, so it must skip readahead
|
||||
// on page cache misses. Use NewReaderAt for files read mostly sequentially.
|
||||
//
|
||||
// MustClose must be called on the returned ReaderAt when it is no longer needed.
|
||||
func MustOpenReaderAt(path string) *ReaderAt {
|
||||
var r ReaderAt
|
||||
r.path = path
|
||||
r.useRandomReadHint = true
|
||||
return &r
|
||||
}
|
||||
|
||||
@@ -229,6 +244,22 @@ func newMmapReaderFromFile(f *os.File) *mmapReader {
|
||||
return mr
|
||||
}
|
||||
|
||||
// mustHintRandomRead hints the OS that mr is read at random offsets,
|
||||
// so the OS must skip readahead on page cache misses.
|
||||
//
|
||||
// fadvise(FADV_RANDOM) covers reads via pread() syscall at mustReadAtViaSyscall,
|
||||
// while madvise(MADV_RANDOM) covers page faults on the mmap()ed region.
|
||||
func (mr *mmapReader) mustHintRandomRead(path string) {
|
||||
if err := fadviseRandomRead(mr.f); err != nil {
|
||||
logger.Panicf("FATAL: error in fadviseRandomRead(%q): %s", path, err)
|
||||
}
|
||||
if len(mr.mmapData) > 0 {
|
||||
if err := madviseRandomRead(mr.mmapData[:cap(mr.mmapData)]); err != nil {
|
||||
logger.Panicf("FATAL: error in madviseRandomRead(%q): %s", path, err)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
func (mr *mmapReader) mustClose() {
|
||||
fname := mr.f.Name()
|
||||
if len(mr.mmapData) > 0 {
|
||||
|
||||
@@ -23,6 +23,8 @@ const (
|
||||
vmAppLabelName = "victoriametrics_app"
|
||||
vmAppLabelValue = "true"
|
||||
vmAppVersionMetricName = "vm_app_version"
|
||||
accountIDLabelName = "vm_account_id"
|
||||
projectIDLabelName = "vm_project_id"
|
||||
)
|
||||
|
||||
// Ctx defines filtering context
|
||||
@@ -37,6 +39,8 @@ type Ctx struct {
|
||||
hasFilterLabelValue bool
|
||||
jobLabelValue string
|
||||
instanceLabelValue string
|
||||
accountIDLabelValue string
|
||||
projectIDLabelValue string
|
||||
}
|
||||
|
||||
func (ctx *Ctx) reset() {
|
||||
@@ -49,6 +53,8 @@ func (ctx *Ctx) reset() {
|
||||
ctx.hasFilterLabelValue = false
|
||||
ctx.jobLabelValue = ""
|
||||
ctx.instanceLabelValue = ""
|
||||
ctx.accountIDLabelValue = ""
|
||||
ctx.projectIDLabelValue = ""
|
||||
}
|
||||
|
||||
var ctxPool = &sync.Pool{
|
||||
@@ -70,7 +76,8 @@ func PutContext(ctx *Ctx) {
|
||||
ctxPool.Put(ctx)
|
||||
}
|
||||
|
||||
// Filter manages the list of VictoriaMetrics instances grouped by job:instance labels.
|
||||
// Filter manages the list of VictoriaMetrics instances grouped by job:instance labels
|
||||
// and vm_account_id:vm_project_id labels when they are present.
|
||||
// job and instance must present at timeseries.
|
||||
//
|
||||
// Filter keeps timeseries with any of the following conditions:
|
||||
@@ -168,6 +175,10 @@ func (ctx *Ctx) prepare(labels []prompb.Label, filterByLabelName, label string)
|
||||
ctx.jobLabelValue = l.Value
|
||||
case "instance":
|
||||
ctx.instanceLabelValue = l.Value
|
||||
case accountIDLabelName:
|
||||
ctx.accountIDLabelValue = l.Value
|
||||
case projectIDLabelName:
|
||||
ctx.projectIDLabelValue = l.Value
|
||||
case vmAppLabelName:
|
||||
if l.Value == vmAppLabelValue {
|
||||
ctx.hasVMAppLabel = true
|
||||
@@ -197,6 +208,10 @@ func (ctx *Ctx) formatTimeSeriesKey() string {
|
||||
buf = strconv.AppendQuote(buf, ctx.jobLabelValue)
|
||||
buf = append(buf, ':')
|
||||
buf = strconv.AppendQuote(buf, ctx.instanceLabelValue)
|
||||
buf = append(buf, ':')
|
||||
buf = strconv.AppendQuote(buf, ctx.accountIDLabelValue)
|
||||
buf = append(buf, ':')
|
||||
buf = strconv.AppendQuote(buf, ctx.projectIDLabelValue)
|
||||
ctx.buf = buf
|
||||
return bytesutil.ToUnsafeString(buf)
|
||||
}
|
||||
|
||||
@@ -375,6 +375,132 @@ func TestMdxInstanceFilter(t *testing.T) {
|
||||
},
|
||||
}})
|
||||
|
||||
// metrics from another tenant with the same job and instance must be dropped.
|
||||
f([]prompb.TimeSeries{
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "vm_app_version"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "shared:8428"},
|
||||
{Name: "vm_account_id", Value: "1042"},
|
||||
{Name: "vm_project_id", Value: "0"},
|
||||
}},
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "http_requests_total"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "shared:8428"},
|
||||
{Name: "vm_account_id", Value: "2077"},
|
||||
{Name: "vm_project_id", Value: "0"},
|
||||
}},
|
||||
}, []prompb.TimeSeries{
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "vm_app_version"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "shared:8428"},
|
||||
{Name: "vm_account_id", Value: "1042"},
|
||||
{Name: "vm_project_id", Value: "0"},
|
||||
{Name: "victoriametrics_app", Value: "true"},
|
||||
}},
|
||||
})
|
||||
|
||||
// metrics from the same tenant and instance must be preserved.
|
||||
f([]prompb.TimeSeries{
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "vm_app_version"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "shared:8428"},
|
||||
{Name: "vm_account_id", Value: "1042"},
|
||||
{Name: "vm_project_id", Value: "0"},
|
||||
}},
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "http_requests_total"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "shared:8428"},
|
||||
{Name: "vm_account_id", Value: "1042"},
|
||||
{Name: "vm_project_id", Value: "0"},
|
||||
}},
|
||||
}, []prompb.TimeSeries{
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "vm_app_version"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "shared:8428"},
|
||||
{Name: "vm_account_id", Value: "1042"},
|
||||
{Name: "vm_project_id", Value: "0"},
|
||||
{Name: "victoriametrics_app", Value: "true"},
|
||||
}},
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "http_requests_total"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "shared:8428"},
|
||||
{Name: "vm_account_id", Value: "1042"},
|
||||
{Name: "vm_project_id", Value: "0"},
|
||||
{Name: "victoriametrics_app", Value: "true"},
|
||||
}},
|
||||
})
|
||||
|
||||
// instances with and without tenant labels must remain distinct.
|
||||
f([]prompb.TimeSeries{
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "vm_app_version"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "x"},
|
||||
}},
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "http_requests_total"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "x"},
|
||||
{Name: "vm_account_id", Value: "1"},
|
||||
}},
|
||||
}, []prompb.TimeSeries{
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "vm_app_version"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "x"},
|
||||
{Name: "victoriametrics_app", Value: "true"},
|
||||
}},
|
||||
})
|
||||
|
||||
// partial tenant labels must remain distinct from absent and full tenant labels.
|
||||
f([]prompb.TimeSeries{
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "vm_app_version"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "partial:8428"},
|
||||
{Name: "vm_account_id", Value: "1"},
|
||||
}},
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "http_requests_total"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "partial:8428"},
|
||||
{Name: "vm_account_id", Value: "1"},
|
||||
}},
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "http_requests_total"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "partial:8428"},
|
||||
}},
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "http_requests_total"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "partial:8428"},
|
||||
{Name: "vm_account_id", Value: "1"},
|
||||
{Name: "vm_project_id", Value: "0"},
|
||||
}},
|
||||
}, []prompb.TimeSeries{
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "vm_app_version"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "partial:8428"},
|
||||
{Name: "vm_account_id", Value: "1"},
|
||||
{Name: "victoriametrics_app", Value: "true"},
|
||||
}},
|
||||
{Labels: []prompb.Label{
|
||||
{Name: "__name__", Value: "http_requests_total"},
|
||||
{Name: "job", Value: "test"},
|
||||
{Name: "instance", Value: "partial:8428"},
|
||||
{Name: "vm_account_id", Value: "1"},
|
||||
{Name: "victoriametrics_app", Value: "true"},
|
||||
}},
|
||||
})
|
||||
}
|
||||
|
||||
func TestMdxInstanceFilterConcurrent(t *testing.T) {
|
||||
|
||||
Reference in New Issue
Block a user