mirror of
https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz
synced 2025-07-31 21:41:59 +08:00
feat: ttl api integration
This commit is contained in:
parent
20e924b116
commit
8064ae1f37
@ -8,9 +8,9 @@ const setRetention = async (
|
|||||||
props: Props,
|
props: Props,
|
||||||
): Promise<SuccessResponse<PayloadProps> | ErrorResponse> => {
|
): Promise<SuccessResponse<PayloadProps> | ErrorResponse> => {
|
||||||
try {
|
try {
|
||||||
const response = await axios.post<PayloadProps>(
|
const response = await axios.post<PayloadProps>(`/settings/ttl`, {
|
||||||
`/settings/ttl?duration=${props.duration}&type=${props.type}`,
|
props,
|
||||||
);
|
});
|
||||||
|
|
||||||
return {
|
return {
|
||||||
statusCode: 200,
|
statusCode: 200,
|
||||||
|
@ -17,6 +17,7 @@ function Retention({
|
|||||||
retentionValue,
|
retentionValue,
|
||||||
setRetentionValue,
|
setRetentionValue,
|
||||||
text,
|
text,
|
||||||
|
hide,
|
||||||
}: RetentionProps): JSX.Element {
|
}: RetentionProps): JSX.Element {
|
||||||
const {
|
const {
|
||||||
value: initialValue,
|
value: initialValue,
|
||||||
@ -64,7 +65,9 @@ function Retention({
|
|||||||
func(null);
|
func(null);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
if (hide) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
return (
|
return (
|
||||||
<RetentionContainer>
|
<RetentionContainer>
|
||||||
<Row justify="space-between">
|
<Row justify="space-between">
|
||||||
@ -103,6 +106,7 @@ interface RetentionProps {
|
|||||||
retentionValue: number;
|
retentionValue: number;
|
||||||
text: string;
|
text: string;
|
||||||
setRetentionValue: React.Dispatch<React.SetStateAction<number | null>>;
|
setRetentionValue: React.Dispatch<React.SetStateAction<number | null>>;
|
||||||
|
hide: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default Retention;
|
export default Retention;
|
||||||
|
@ -1,13 +1,15 @@
|
|||||||
import { Button, Col, Modal, notification, Row, Typography } from 'antd';
|
import { Button, Col, Modal, notification, Row, Typography } from 'antd';
|
||||||
import getDisks from 'api/disks/getDisks';
|
import getDisks from 'api/disks/getDisks';
|
||||||
import getRetentionperoidApi from 'api/settings/getRetention';
|
import getRetentionPeriodApi from 'api/settings/getRetention';
|
||||||
import setRetentionApi from 'api/settings/setRetention';
|
import setRetentionApi from 'api/settings/setRetention';
|
||||||
import Spinner from 'components/Spinner';
|
import Spinner from 'components/Spinner';
|
||||||
import TextToolTip from 'components/TextToolTip';
|
import TextToolTip from 'components/TextToolTip';
|
||||||
import useFetch from 'hooks/useFetch';
|
import useFetch from 'hooks/useFetch';
|
||||||
import convertIntoHr from 'lib/convertIntoHr';
|
import convertIntoHr from 'lib/convertIntoHr';
|
||||||
import getSettingsPeroid from 'lib/getSettingsPeroid';
|
import getSettingsPeroid from 'lib/getSettingsPeroid';
|
||||||
import React, { useCallback, useEffect, useState } from 'react';
|
import { find } from 'lodash-es';
|
||||||
|
import React, { useCallback, useEffect, useMemo, useState } from 'react';
|
||||||
|
import { IDiskType } from 'types/api/disks/getDisks';
|
||||||
import { PayloadProps } from 'types/api/settings/getRetention';
|
import { PayloadProps } from 'types/api/settings/getRetention';
|
||||||
|
|
||||||
import Retention from './Retention';
|
import Retention from './Retention';
|
||||||
@ -24,43 +26,36 @@ function GeneralSettings(): JSX.Element {
|
|||||||
setSelectedMetricsPeroid,
|
setSelectedMetricsPeroid,
|
||||||
] = useState<SettingPeriod>('month');
|
] = useState<SettingPeriod>('month');
|
||||||
const [notifications, Element] = notification.useNotification();
|
const [notifications, Element] = notification.useNotification();
|
||||||
const [retentionPeroidMetrics, setRetentionPeroidMetrics] = useState<string>(
|
|
||||||
'',
|
|
||||||
);
|
|
||||||
const [modal, setModal] = useState<boolean>(false);
|
const [modal, setModal] = useState<boolean>(false);
|
||||||
const [postApiLoading, setPostApiLoading] = useState<boolean>(false);
|
const [postApiLoading, setPostApiLoading] = useState<boolean>(false);
|
||||||
|
|
||||||
const [selectedTracePeroid, setSelectedTracePeroid] = useState<SettingPeriod>(
|
|
||||||
'hr',
|
|
||||||
);
|
|
||||||
|
|
||||||
const [retentionPeroidTrace, setRetentionPeroidTrace] = useState<string>('');
|
|
||||||
const [isDefaultMetrics, setIsDefaultMetrics] = useState<boolean>(false);
|
const [isDefaultMetrics, setIsDefaultMetrics] = useState<boolean>(false);
|
||||||
const [isDefaultTrace, setIsDefaultTrace] = useState<boolean>(false);
|
const [isDefaultTrace, setIsDefaultTrace] = useState<boolean>(false);
|
||||||
|
|
||||||
const [availableDisks, setAvailableDisks] = useState(null);
|
const [availableDisks, setAvailableDisks] = useState<IDiskType | null>(null);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
getDisks().then((resp) => console.log({ disks: resp }))
|
getDisks().then((response) => setAvailableDisks(response));
|
||||||
}, [])
|
}, []);
|
||||||
const currentTTLValues = {
|
|
||||||
metrics_ttl_duration_hrs: 24 * 30 * 10,
|
const { payload: currentTTLValues, loading, error, errorMessage } = useFetch<
|
||||||
metrics_move_ttl_duration_hrs: -1,
|
PayloadProps,
|
||||||
traces_ttl_duration_hrs: -1,
|
undefined
|
||||||
traces_move_ttl_duration_hrs: -1,
|
>(getRetentionPeriodApi, undefined);
|
||||||
};
|
|
||||||
const [metricsTotalRetentionPeriod, setMetricsTotalRetentionPeriod] = useState<
|
const [metricsTotalRetentionPeriod, setMetricsTotalRetentionPeriod] = useState<
|
||||||
number | null
|
number | null
|
||||||
>(currentTTLValues.metrics_ttl_duration_hrs);
|
>(currentTTLValues?.metrics_ttl_duration_hrs);
|
||||||
const [metricsS3RetentionPeriod, setMetricsS3RetentionPeriod] = useState<
|
const [metricsS3RetentionPeriod, setMetricsS3RetentionPeriod] = useState<
|
||||||
number | null
|
number | null
|
||||||
>(currentTTLValues.metrics_move_ttl_duration_hrs);
|
>(currentTTLValues?.metrics_move_ttl_duration_hrs);
|
||||||
const [tracesTotalRetentionPeriod, setTracesTotalRetentionPeriod] = useState<
|
const [tracesTotalRetentionPeriod, setTracesTotalRetentionPeriod] = useState<
|
||||||
number | null
|
number | null
|
||||||
>(currentTTLValues.traces_ttl_duration_hrs);
|
>(currentTTLValues?.traces_ttl_duration_hrs);
|
||||||
const [tracesS3RetentionPeriod, setTracesS3RetentionPeriod] = useState<
|
const [tracesS3RetentionPeriod, setTracesS3RetentionPeriod] = useState<
|
||||||
number | null
|
number | null
|
||||||
>(currentTTLValues.traces_move_ttl_duration_hrs);
|
>(currentTTLValues?.traces_move_ttl_duration_hrs);
|
||||||
|
|
||||||
const onModalToggleHandler = (): void => {
|
const onModalToggleHandler = (): void => {
|
||||||
setModal((modal) => !modal);
|
setModal((modal) => !modal);
|
||||||
@ -70,11 +65,6 @@ function GeneralSettings(): JSX.Element {
|
|||||||
onModalToggleHandler();
|
onModalToggleHandler();
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
const { payload, loading, error, errorMessage } = useFetch<
|
|
||||||
PayloadProps,
|
|
||||||
undefined
|
|
||||||
>(getRetentionperoidApi, undefined);
|
|
||||||
|
|
||||||
const checkMetricTraceDefault = (trace: number, metric: number): void => {
|
const checkMetricTraceDefault = (trace: number, metric: number): void => {
|
||||||
if (metric === -1) {
|
if (metric === -1) {
|
||||||
setIsDefaultMetrics(true);
|
setIsDefaultMetrics(true);
|
||||||
@ -89,99 +79,78 @@ function GeneralSettings(): JSX.Element {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
// const retentionRenderConfig = () => { };
|
// const retentionRenderConfig = () => { };
|
||||||
const renderConfig = [
|
const renderConfig = useMemo(() => {
|
||||||
{
|
const s3Enabled = !!find(
|
||||||
name: 'Metrics',
|
availableDisks,
|
||||||
retentionFields: [
|
(disks: IDiskType) => disks?.type === 's3',
|
||||||
{
|
);
|
||||||
name: 'Total Retention Period',
|
return [
|
||||||
value: metricsTotalRetentionPeriod,
|
{
|
||||||
setValue: setMetricsTotalRetentionPeriod,
|
name: 'Metrics',
|
||||||
},
|
retentionFields: [
|
||||||
{
|
{
|
||||||
name: `Move to S3\n(should be lower than total retention period)`,
|
name: 'Total Retention Period',
|
||||||
value: metricsS3RetentionPeriod,
|
value: metricsTotalRetentionPeriod,
|
||||||
setValue: setMetricsS3RetentionPeriod,
|
setValue: setMetricsTotalRetentionPeriod,
|
||||||
},
|
},
|
||||||
],
|
{
|
||||||
},
|
name: `Move to S3\n(should be lower than total retention period)`,
|
||||||
{
|
value: metricsS3RetentionPeriod,
|
||||||
name: 'Traces',
|
setValue: setMetricsS3RetentionPeriod,
|
||||||
retentionFields: [
|
hide: !s3Enabled,
|
||||||
{
|
},
|
||||||
name: 'Total Retention Period',
|
],
|
||||||
value: tracesTotalRetentionPeriod,
|
},
|
||||||
setValue: setTracesTotalRetentionPeriod,
|
{
|
||||||
},
|
name: 'Traces',
|
||||||
{
|
retentionFields: [
|
||||||
name: `Move to S3\n(should be lower than total retention period)`,
|
{
|
||||||
value: tracesS3RetentionPeriod,
|
name: 'Total Retention Period',
|
||||||
setValue: setTracesS3RetentionPeriod,
|
value: tracesTotalRetentionPeriod,
|
||||||
},
|
setValue: setTracesTotalRetentionPeriod,
|
||||||
],
|
},
|
||||||
},
|
{
|
||||||
];
|
name: `Move to S3\n(should be lower than total retention period)`,
|
||||||
|
value: tracesS3RetentionPeriod,
|
||||||
useEffect(() => {
|
setValue: setTracesS3RetentionPeriod,
|
||||||
if (!loading && payload !== undefined) {
|
hide: !s3Enabled,
|
||||||
const {
|
},
|
||||||
metrics_ttl_duration_hrs: metricTllDuration,
|
],
|
||||||
traces_ttl_duration_hrs: traceTllDuration,
|
},
|
||||||
} = payload;
|
];
|
||||||
|
}, [
|
||||||
checkMetricTraceDefault(traceTllDuration, metricTllDuration);
|
availableDisks,
|
||||||
|
metricsS3RetentionPeriod,
|
||||||
const traceValue = getSettingsPeroid(traceTllDuration);
|
metricsTotalRetentionPeriod,
|
||||||
const metricsValue = getSettingsPeroid(metricTllDuration);
|
tracesS3RetentionPeriod,
|
||||||
|
tracesTotalRetentionPeriod,
|
||||||
setRetentionPeroidTrace(traceValue.value.toString());
|
]);
|
||||||
setSelectedTracePeroid(traceValue.peroid);
|
|
||||||
|
|
||||||
setRetentionPeroidMetrics(metricsValue.value.toString());
|
|
||||||
setSelectedMetricsPeroid(metricsValue.peroid);
|
|
||||||
}
|
|
||||||
}, [setSelectedMetricsPeroid, loading, payload]);
|
|
||||||
|
|
||||||
const onOkHandler = async (): Promise<void> => {
|
const onOkHandler = async (): Promise<void> => {
|
||||||
try {
|
try {
|
||||||
setPostApiLoading(true);
|
setPostApiLoading(true);
|
||||||
const retentionTraceValue =
|
// const retentionTraceValue =
|
||||||
retentionPeroidTrace === '0' && (payload?.traces_ttl_duration_hrs || 0) < 0
|
// retentionPeroidTrace === '0' && (payload?.traces_ttl_duration_hrs || 0) < 0
|
||||||
? payload?.traces_ttl_duration_hrs || 0
|
// ? payload?.traces_ttl_duration_hrs || 0
|
||||||
: parseInt(retentionPeroidTrace, 10);
|
// : parseInt(retentionPeroidTrace, 10);
|
||||||
|
// const retentionMetricsValue =
|
||||||
const retentionMetricsValue =
|
// retentionPeroidMetrics === '0' &&
|
||||||
retentionPeroidMetrics === '0' &&
|
// (payload?.metrics_ttl_duration_hrs || 0) < 0
|
||||||
(payload?.metrics_ttl_duration_hrs || 0) < 0
|
// ? payload?.metrics_ttl_duration_hrs || 0
|
||||||
? payload?.metrics_ttl_duration_hrs || 0
|
// : parseInt(retentionPeroidMetrics, 10);
|
||||||
: parseInt(retentionPeroidMetrics, 10);
|
const apiResponse = await setRetentionApi({
|
||||||
|
metrics_ttl_duration_hrs: metricsTotalRetentionPeriod || -1,
|
||||||
const [tracesResponse, metricsResponse] = await Promise.all([
|
metrics_move_ttl_duration_hrs: metricsS3RetentionPeriod || -1,
|
||||||
setRetentionApi({
|
traces_move_ttl_duration_hrs: tracesS3RetentionPeriod || -1,
|
||||||
duration: `${convertIntoHr(retentionTraceValue, selectedTracePeroid)}h`,
|
traces_ttl_duration_hrs: tracesTotalRetentionPeriod || -1,
|
||||||
type: 'traces',
|
});
|
||||||
}),
|
if (apiResponse.statusCode === 200) {
|
||||||
setRetentionApi({
|
|
||||||
duration: `${convertIntoHr(
|
|
||||||
retentionMetricsValue,
|
|
||||||
selectedMetricsPeroid,
|
|
||||||
)}h`,
|
|
||||||
type: 'metrics',
|
|
||||||
}),
|
|
||||||
]);
|
|
||||||
|
|
||||||
if (
|
|
||||||
tracesResponse.statusCode === 200 &&
|
|
||||||
metricsResponse.statusCode === 200
|
|
||||||
) {
|
|
||||||
notifications.success({
|
notifications.success({
|
||||||
message: 'Success!',
|
message: 'Success!',
|
||||||
placement: 'topRight',
|
placement: 'topRight',
|
||||||
description: 'Congrats. The retention periods were updated correctly.',
|
description: 'Congrats. The retention periods were updated correctly.',
|
||||||
});
|
});
|
||||||
|
// checkMetricTraceDefault(retentionTraceValue, retentionMetricsValue);
|
||||||
checkMetricTraceDefault(retentionTraceValue, retentionMetricsValue);
|
|
||||||
|
|
||||||
onModalToggleHandler();
|
onModalToggleHandler();
|
||||||
} else {
|
} else {
|
||||||
notifications.error({
|
notifications.error({
|
||||||
@ -206,7 +175,7 @@ function GeneralSettings(): JSX.Element {
|
|||||||
return <Typography>{errorMessage}</Typography>;
|
return <Typography>{errorMessage}</Typography>;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (loading || payload === undefined) {
|
if (loading || currentTTLValues === undefined) {
|
||||||
return <Spinner tip="Loading.." height="70vh" />;
|
return <Spinner tip="Loading.." height="70vh" />;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -230,7 +199,7 @@ function GeneralSettings(): JSX.Element {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const isDisabledHandler = (): boolean => {
|
const isDisabledHandler = (): boolean => {
|
||||||
return !!(retentionPeroidTrace === '' || retentionPeroidMetrics === '');
|
return false;
|
||||||
};
|
};
|
||||||
|
|
||||||
const errorText = getErrorText();
|
const errorText = getErrorText();
|
||||||
@ -275,6 +244,7 @@ function GeneralSettings(): JSX.Element {
|
|||||||
text={retentionField.name}
|
text={retentionField.name}
|
||||||
retentionValue={retentionField.value}
|
retentionValue={retentionField.value}
|
||||||
setRetentionValue={retentionField.setValue}
|
setRetentionValue={retentionField.setValue}
|
||||||
|
hide={!!retentionField.hide}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
</Col>
|
</Col>
|
||||||
|
@ -1,4 +1,6 @@
|
|||||||
export interface PayloadProps {
|
export interface PayloadProps {
|
||||||
metrics_ttl_duration_hrs: number;
|
metrics_ttl_duration_hrs: number;
|
||||||
|
metrics_move_ttl_duration_hrs: number;
|
||||||
traces_ttl_duration_hrs: number;
|
traces_ttl_duration_hrs: number;
|
||||||
|
traces_move_ttl_duration_hrs: number;
|
||||||
}
|
}
|
||||||
|
@ -1,6 +1,8 @@
|
|||||||
export interface Props {
|
export interface Props {
|
||||||
type: 'metrics' | 'traces';
|
metrics_ttl_duration_hrs: number;
|
||||||
duration: string;
|
metrics_move_ttl_duration_hrs: number;
|
||||||
|
traces_ttl_duration_hrs: number;
|
||||||
|
traces_move_ttl_duration_hrs: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface PayloadProps {
|
export interface PayloadProps {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user