Show new error component when saving pipeline fails (#8511)

* fix: show new error component when saving pipeline fails

* fix: minor refactor

---------

Co-authored-by: Aditya Singh <adityasingh@Adityas-MacBook-Pro.local>
This commit is contained in:
Aditya Singh 2025-07-14 13:13:39 +05:30 committed by GitHub
parent ddb08b3883
commit a7ce6da7d1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 16 additions and 22 deletions

View File

@ -1,24 +1,20 @@
import axios from 'api'; import axios from 'api';
import { ErrorResponseHandler } from 'api/ErrorResponseHandler'; import { ErrorResponseHandlerV2 } from 'api/ErrorResponseHandlerV2';
import { AxiosError } from 'axios'; import { AxiosError } from 'axios';
import { ErrorResponse, SuccessResponse } from 'types/api'; import { ErrorV2Resp, SuccessResponseV2 } from 'types/api';
import { Pipeline } from 'types/api/pipeline/def'; import { Pipeline } from 'types/api/pipeline/def';
import { Props } from 'types/api/pipeline/post'; import { Props } from 'types/api/pipeline/post';
const post = async ( const post = async (props: Props): Promise<SuccessResponseV2<Pipeline>> => {
props: Props,
): Promise<SuccessResponse<Pipeline> | ErrorResponse> => {
try { try {
const response = await axios.post('/logs/pipelines', props.data); const response = await axios.post('/logs/pipelines', props.data);
return { return {
statusCode: 200, httpStatusCode: response.status,
error: null, data: response.data.data,
message: response.data.status,
payload: response.data.data,
}; };
} catch (error) { } catch (error) {
return ErrorResponseHandler(error as AxiosError); ErrorResponseHandlerV2(error as AxiosError<ErrorV2Resp>);
} }
}; };

View File

@ -8,6 +8,7 @@ import savePipeline from 'api/pipeline/post';
import { useNotifications } from 'hooks/useNotifications'; import { useNotifications } from 'hooks/useNotifications';
import { isEqual, isUndefined } from 'lodash-es'; import { isEqual, isUndefined } from 'lodash-es';
import cloneDeep from 'lodash-es/cloneDeep'; import cloneDeep from 'lodash-es/cloneDeep';
import { useErrorModal } from 'providers/ErrorModalProvider';
import React, { import React, {
useCallback, useCallback,
useEffect, useEffect,
@ -18,6 +19,7 @@ import React, {
import { DndProvider } from 'react-dnd'; import { DndProvider } from 'react-dnd';
import { HTML5Backend } from 'react-dnd-html5-backend'; import { HTML5Backend } from 'react-dnd-html5-backend';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import APIError from 'types/api/error';
import { import {
ActionMode, ActionMode,
ActionType, ActionType,
@ -95,6 +97,7 @@ function PipelineListsView({
pipelineData, pipelineData,
refetchPipelineLists, refetchPipelineLists,
}: PipelineListsViewProps): JSX.Element { }: PipelineListsViewProps): JSX.Element {
const { showErrorModal } = useErrorModal();
const [pipelineForm] = Form.useForm<PipelineData>(); const [pipelineForm] = Form.useForm<PipelineData>();
const { t } = useTranslation(['pipeline', 'common']); const { t } = useTranslation(['pipeline', 'common']);
const [modal, contextHolder] = Modal.useModal(); const [modal, contextHolder] = Modal.useModal();
@ -442,17 +445,15 @@ function PipelineListsView({
delete pipelineData?.id; delete pipelineData?.id;
return pipelineData; return pipelineData;
}); });
try {
const response = await savePipeline({ const response = await savePipeline({
data: { pipelines: modifiedPipelineData }, data: { pipelines: modifiedPipelineData },
}); });
if (response.statusCode === 200) {
refetchPipelineLists(); refetchPipelineLists();
setActionMode(ActionMode.Viewing); setActionMode(ActionMode.Viewing);
setShowSaveButton(undefined); setShowSaveButton(undefined);
const pipelinesInDB = response.payload?.pipelines || []; const pipelinesInDB = response.data?.pipelines || [];
setCurrPipelineData(pipelinesInDB); setCurrPipelineData(pipelinesInDB);
setPrevPipelineData(pipelinesInDB); setPrevPipelineData(pipelinesInDB);
@ -470,7 +471,7 @@ function PipelineListsView({
enabled: pipelinesInDB.filter((p) => p.enabled).length, enabled: pipelinesInDB.filter((p) => p.enabled).length,
source: 'signoz-ui', source: 'signoz-ui',
}); });
} else { } catch (error) {
modifiedPipelineData.forEach((item: PipelineData) => { modifiedPipelineData.forEach((item: PipelineData) => {
const pipelineData = item; const pipelineData = item;
pipelineData.id = v4(); pipelineData.id = v4();
@ -478,10 +479,7 @@ function PipelineListsView({
}); });
setActionMode(ActionMode.Editing); setActionMode(ActionMode.Editing);
setShowSaveButton(ActionMode.Editing); setShowSaveButton(ActionMode.Editing);
notifications.error({ showErrorModal(error as APIError);
message: 'Error',
description: response.error || t('something_went_wrong'),
});
setCurrPipelineData(modifiedPipelineData); setCurrPipelineData(modifiedPipelineData);
setPrevPipelineData(modifiedPipelineData); setPrevPipelineData(modifiedPipelineData);
} }