fix: handle silent error for dashboard edit mutation (#5022)

* fix: handle silent error for dashboard edit mutation

* fix: handle silent error for dashboard edit mutation

frontend/src/api/dashboard/update.ts

@@ -1,26 +1,20 @@
 import axios from 'api';
-import { ErrorResponseHandler } from 'api/ErrorResponseHandler';
-import { AxiosError } from 'axios';
 import { ErrorResponse, SuccessResponse } from 'types/api';
 import { PayloadProps, Props } from 'types/api/dashboard/update';
 
 const updateDashboard = async (
  props: Props,
 ): Promise<SuccessResponse<PayloadProps> | ErrorResponse> => {
- try {
- const response = await axios.put(`/dashboards/${props.uuid}`, {
- ...props.data,
- });
+ const response = await axios.put(`/dashboards/${props.uuid}`, {
+ ...props.data,
+ });
 
- return {
- statusCode: 200,
- error: null,
- message: response.data.status,
- payload: response.data.data,
- };
- } catch (error) {
- return ErrorResponseHandler(error as AxiosError);
- }
+ return {
+ statusCode: 200,
+ error: null,
+ message: response.data.status,
+ payload: response.data.data,
+ };
 };
 
 export default updateDashboard;

frontend/src/container/NewWidget/index.tsx

@@ -3,7 +3,6 @@ import './NewWidget.styles.scss';
 
 import { WarningOutlined } from '@ant-design/icons';
 import { Button, Modal, Space, Tooltip, Typography } from 'antd';
-import { SOMETHING_WENT_WRONG } from 'constants/api';
 import { FeatureKeys } from 'constants/features';
 import { QueryParams } from 'constants/query';
 import { PANEL_TYPES } from 'constants/queryBuilder';
@@ -12,9 +11,9 @@ import { DashboardShortcuts } from 'constants/shortcuts/DashboardShortcuts';
 import { useUpdateDashboard } from 'hooks/dashboard/useUpdateDashboard';
 import { useKeyboardHotkeys } from 'hooks/hotkeys/useKeyboardHotkeys';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
+import useAxiosError from 'hooks/useAxiosError';
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import { MESSAGE, useIsFeatureDisabled } from 'hooks/useFeatureFlag';
-import { useNotifications } from 'hooks/useNotifications';
 import useUrlQuery from 'hooks/useUrlQuery';
 import history from 'lib/history';
 import { defaultTo, isUndefined } from 'lodash-es';
@@ -244,7 +243,7 @@ function NewWidget({ selectedGraph }: NewWidgetProps): JSX.Element {
  return { selectedWidget, preWidgets, afterWidgets };
  }, [selectedDashboard, query]);
 
- const { notifications } = useNotifications();
+ const handleError = useAxiosError();
 
  const onClickSaveHandler = useCallback(() => {
  if (!selectedDashboard) {
@@ -305,11 +304,7 @@ function NewWidget({ selectedGraph }: NewWidgetProps): JSX.Element {
  pathname: generatePath(ROUTES.DASHBOARD, { dashboardId }),
  });
  },
- onError: () => {
- notifications.error({
- message: SOMETHING_WENT_WRONG,
- });
- },
+ onError: handleError,
  });
  }, [
  selectedDashboard,
@@ -322,11 +317,11 @@ function NewWidget({ selectedGraph }: NewWidgetProps): JSX.Element {
  currentQuery,
  afterWidgets,
  updateDashboardMutation,
+ handleError,
  setSelectedDashboard,
  setToScrollWidgetId,
  featureResponse,
  dashboardId,
- notifications,
  ]);
 
  const onClickDiscardHandler = useCallback(() => {