Skip to content

Commit d8a931b

Browse files
vlasov-yvlasov-y
committed
prometheus: Added basic authorization
Signed-off-by: Yurii Vlasov <[email protected]>
1 parent e7996cd commit d8a931b

File tree

14 files changed

+1112
-532
lines changed

14 files changed

+1112
-532
lines changed

‎prometheus/package-lock.json

Lines changed: 763 additions & 451 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎prometheus/package.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,8 @@
3333
"@kinvolk/headlamp-plugin": "^0.9.2"
3434
},
3535
"dependencies": {
36+
"@iconify/react": "^5.2.0",
37+
"@storybook/react": "^8.4.7",
3638
"recharts": "^2.7.3",
3739
"use-between": "^1.3.5"
3840
}

‎prometheus/src/components/Chart/CPUChart/CPUChart.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useTheme } from '@mui/material';
22
import { fetchMetrics } from '../../../request';
3-
import { createTickTimestampFormatter, dataProcessor } from '../../../util';
3+
import { createTickTimestampFormatter, dataProcessor, PrometheusEndpoint } from '../../../util';
44
import Chart from '../Chart/Chart';
55
import { CustomTooltip } from '../common';
66

@@ -14,7 +14,7 @@ import { CustomTooltip } from '../common';
1414
*/
1515
interface CPUChartProps {
1616
query: string;
17-
prometheusPrefix: string;
17+
prometheusEndpoint: PrometheusEndpoint;
1818
interval: string;
1919
autoRefresh: boolean;
2020
}

‎prometheus/src/components/Chart/Chart/Chart.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { EmptyContent, Loader } from '@kinvolk/headlamp-plugin/lib/CommonCompone
22
import { Box, useTheme } from '@mui/material';
33
import { useEffect, useState } from 'react';
44
import { Area, AreaChart, Legend, ResponsiveContainer, Tooltip, XAxis, YAxis } from 'recharts';
5-
import { getTimeRange } from '../../../util';
5+
import { getTimeRange, PrometheusEndpoint } from '../../../util';
66

77
/**
88
* Props for the Chart component.
@@ -31,7 +31,7 @@ export interface ChartProps {
3131
}>;
3232
fetchMetrics: (query: object) => Promise<any>;
3333
interval: string;
34-
prometheusPrefix: string;
34+
prometheusEndpoint: PrometheusEndpoint;
3535
autoRefresh: boolean;
3636
xAxisProps: {
3737
[key: string]: any;
@@ -75,7 +75,7 @@ export default function Chart(props: ChartProps) {
7575
var response;
7676
try {
7777
response = await fetchMetrics({
78-
prefix: props.prometheusPrefix,
78+
endpoint: props.prometheusEndpoint,
7979
query: plot.query,
8080
from: from,
8181
to: to,

‎prometheus/src/components/Chart/Chart/chart.stories.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -339,7 +339,7 @@ const Template: Story<ChartProps> = () => {
339339
autoRefresh={false}
340340
xAxisProps={XTickProps}
341341
yAxisProps={YTickProps}
342-
prometheusPrefix="/api/v1/namespaces/test/proxy"
342+
prometheusEndpoint={{prefix: "/api/v1/namespaces/test/proxy"}}
343343
fetchMetrics={({}) => {
344344
return Promise.resolve(mockData);
345345
}}

‎prometheus/src/components/Chart/DiskChart/DiskChart.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useTheme } from '@mui/material';
22
import { fetchMetrics } from '../../../request';
3-
import { createTickTimestampFormatter, dataProcessor } from '../../../util';
3+
import { createTickTimestampFormatter, dataProcessor, PrometheusEndpoint } from '../../../util';
44
import { formatBytes } from '../../../util';
55
import Chart from '../Chart/Chart';
66
import { CustomTooltipFormatBytes } from '../common';
@@ -18,7 +18,7 @@ interface DiskChartProps {
1818
usageQuery: string;
1919
capacityQuery: string;
2020
interval: string;
21-
prometheusPrefix: string;
21+
prometheusEndpoint: PrometheusEndpoint;
2222
autoRefresh: boolean;
2323
}
2424

‎prometheus/src/components/Chart/DiskMetricsChart/DiskMetricsChart.tsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { useCluster } from '@kinvolk/headlamp-plugin/lib/lib/k8s';
44
import { Box, Icon, IconButton } from '@mui/material';
55
import Alert from '@mui/material/Alert';
66
import { useEffect, useState } from 'react';
7-
import { getConfigStore, getPrometheusInterval, getPrometheusPrefix } from '../../../util';
7+
import { getConfigStore, getPrometheusInterval, getPrometheusEndpoint, PrometheusEndpoint } from '../../../util';
88
import { PrometheusNotFoundBanner } from '../common';
99
import { DiskChart } from '../DiskChart/DiskChart';
1010

@@ -32,7 +32,7 @@ export function DiskMetricsChart(props: DiskMetricsChartProps) {
3232
const clusterConfig = configStore.useConfig();
3333

3434
const [refresh, setRefresh] = useState<boolean>(true);
35-
const [prometheusPrefix, setPrometheusPrefix] = useState<string | null>(null);
35+
const [prometheusEndpoint, setPrometheusEndpoint] = useState<PrometheusEndpoint | null>(null);
3636
const [state, setState] = useState<prometheusState>(prometheusState.LOADING);
3737
const [isVisible, setIsVisible] = useState<boolean>(false);
3838

@@ -45,16 +45,16 @@ export function DiskMetricsChart(props: DiskMetricsChartProps) {
4545

4646
if (!isEnabled) {
4747
setState(prometheusState.UNKNOWN);
48-
setPrometheusPrefix(null);
48+
setPrometheusEndpoint(null);
4949
return;
5050
}
5151

5252
setState(prometheusState.LOADING);
5353
(async () => {
5454
try {
55-
const prefix = await getPrometheusPrefix(cluster);
56-
if (prefix) {
57-
setPrometheusPrefix(prefix);
55+
const endpoint = await getPrometheusEndpoint(cluster);
56+
if (endpoint) {
57+
setPrometheusEndpoint(endpoint);
5858
setState(prometheusState.INSTALLED);
5959
} else {
6060
setState(prometheusState.UNKNOWN);
@@ -111,7 +111,7 @@ export function DiskMetricsChart(props: DiskMetricsChartProps) {
111111
capacityQuery={props.capacityQuery}
112112
interval={interval}
113113
autoRefresh={refresh}
114-
prometheusPrefix={prometheusPrefix}
114+
prometheusEndpoint={prometheusEndpoint}
115115
/>
116116
</Box>
117117
) : state === prometheusState.LOADING ? (

‎prometheus/src/components/Chart/FilesystemChart/FilesystemChart.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useTheme } from '@mui/material';
22
import { fetchMetrics } from '../../../request';
3-
import { createTickTimestampFormatter, dataProcessor } from '../../../util';
3+
import { createTickTimestampFormatter, dataProcessor, PrometheusEndpoint } from '../../../util';
44
import { formatBytes } from '../../../util';
55
import Chart from '../Chart/Chart';
66
import { CustomTooltipFormatBytes } from '../common';
@@ -18,7 +18,7 @@ interface FilesystemChartProps {
1818
readQuery: string;
1919
writeQuery: string;
2020
interval: string;
21-
prometheusPrefix: string;
21+
prometheusEndpoint: PrometheusEndpoint;
2222
autoRefresh: boolean;
2323
}
2424

‎prometheus/src/components/Chart/GenericMetricsChart/GenericMetricsChart.tsx

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { useCluster } from '@kinvolk/headlamp-plugin/lib/k8s';
55
import { Box, IconButton, ToggleButton, ToggleButtonGroup, Tooltip } from '@mui/material';
66
import Alert from '@mui/material/Alert';
77
import { useEffect, useState } from 'react';
8-
import { getConfigStore, getPrometheusInterval, getPrometheusPrefix } from '../../../util';
8+
import { getConfigStore, getPrometheusInterval, getPrometheusEndpoint as getPrometheusEndpoint, PrometheusEndpoint } from '../../../util';
99
import { PrometheusNotFoundBanner } from '../common';
1010
import { CPUChart } from '../CPUChart/CPUChart';
1111
import { FilesystemChart } from '../FilesystemChart/FilesystemChart';
@@ -42,7 +42,7 @@ export function GenericMetricsChart(props: GenericMetricsChartProps) {
4242
const [chartVariant, setChartVariant] = useState<string>('cpu');
4343
const [refresh, setRefresh] = useState<boolean>(true);
4444
const [state, setState] = useState<prometheusState>(prometheusState.LOADING);
45-
const [prometheusPrefix, setPrometheusPrefix] = useState<string | null>(null);
45+
const [prometheusEndpoint, setPrometheusEndpoint] = useState<PrometheusEndpoint | null>(null);
4646
const [isVisible, setIsVisible] = useState<boolean>(false);
4747
const cluster = useCluster();
4848
const configStore = getConfigStore();
@@ -58,16 +58,16 @@ export function GenericMetricsChart(props: GenericMetricsChartProps) {
5858

5959
if (!isEnabled) {
6060
setState(prometheusState.UNKNOWN);
61-
setPrometheusPrefix(null);
61+
setPrometheusEndpoint(null);
6262
return;
6363
}
6464

6565
setState(prometheusState.LOADING);
6666
(async () => {
6767
try {
68-
const prefix = await getPrometheusPrefix(cluster);
69-
if (prefix) {
70-
setPrometheusPrefix(prefix);
68+
const endpoint = await getPrometheusEndpoint(cluster);
69+
if (endpoint) {
70+
setPrometheusEndpoint(endpoint);
7171
setState(prometheusState.INSTALLED);
7272
} else {
7373
setState(prometheusState.UNKNOWN);
@@ -148,15 +148,15 @@ export function GenericMetricsChart(props: GenericMetricsChartProps) {
148148
<CPUChart
149149
query={props.cpuQuery}
150150
autoRefresh={refresh}
151-
prometheusPrefix={prometheusPrefix}
151+
prometheusEndpoint={prometheusEndpoint}
152152
interval={interval}
153153
/>
154154
)}
155155
{chartVariant === 'memory' && (
156156
<MemoryChart
157157
query={props.memoryQuery}
158158
autoRefresh={refresh}
159-
prometheusPrefix={prometheusPrefix}
159+
prometheusEndpoint={prometheusEndpoint}
160160
interval={interval}
161161
/>
162162
)}
@@ -166,7 +166,7 @@ export function GenericMetricsChart(props: GenericMetricsChartProps) {
166166
txQuery={props.networkTxQuery}
167167
autoRefresh={refresh}
168168
interval={interval}
169-
prometheusPrefix={prometheusPrefix}
169+
prometheusEndpoint={prometheusEndpoint}
170170
/>
171171
)}
172172
{chartVariant === 'filesystem' && (
@@ -175,7 +175,7 @@ export function GenericMetricsChart(props: GenericMetricsChartProps) {
175175
writeQuery={props.filesystemWriteQuery}
176176
autoRefresh={refresh}
177177
interval={interval}
178-
prometheusPrefix={prometheusPrefix}
178+
prometheusEndpoint={prometheusEndpoint}
179179
/>
180180
)}
181181
</Box>

‎prometheus/src/components/Chart/MemoryChart/MemoryChart.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useTheme } from '@mui/material';
22
import { fetchMetrics } from '../../../request';
3-
import { createTickTimestampFormatter, dataProcessor } from '../../../util';
3+
import { createTickTimestampFormatter, dataProcessor, PrometheusEndpoint } from '../../../util';
44
import { formatBytes } from '../../../util';
55
import Chart from '../Chart/Chart';
66
import { CustomTooltipFormatBytes } from '../common';
@@ -15,7 +15,7 @@ import { CustomTooltipFormatBytes } from '../common';
1515
*/
1616
interface MemoryChartProps {
1717
query: string;
18-
prometheusPrefix: string;
18+
prometheusEndpoint: PrometheusEndpoint;
1919
interval: string;
2020
autoRefresh: boolean;
2121
}

‎prometheus/src/components/Chart/NetworkChart/NetworkChart.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useTheme } from '@mui/material';
22
import { fetchMetrics } from '../../../request';
3-
import { createTickTimestampFormatter, dataProcessor } from '../../../util';
3+
import { createTickTimestampFormatter, dataProcessor, PrometheusEndpoint } from '../../../util';
44
import { formatBytes } from '../../../util';
55
import Chart from '../Chart/Chart';
66
import { CustomTooltipFormatBytes } from '../common';
@@ -18,7 +18,7 @@ interface NetworkChartProps {
1818
rxQuery: string;
1919
txQuery: string;
2020
interval: string;
21-
prometheusPrefix: string;
21+
prometheusEndpoint: PrometheusEndpoint;
2222
autoRefresh: boolean;
2323
}
2424

0 commit comments

Comments
 (0)