From 6f48030ab91e81fb97b85eff1d802132b4d34128 Mon Sep 17 00:00:00 2001
From: Palash gupta <palash@signoz.io>
Date: Tue, 10 May 2022 17:54:26 +0530
Subject: [PATCH] fix: error details error is handled

---
 frontend/src/pages/ErrorDetails/index.tsx | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/frontend/src/pages/ErrorDetails/index.tsx b/frontend/src/pages/ErrorDetails/index.tsx
index ddc677c7b5..cd54cba097 100644
--- a/frontend/src/pages/ErrorDetails/index.tsx
+++ b/frontend/src/pages/ErrorDetails/index.tsx
@@ -5,6 +5,7 @@ import Spinner from 'components/Spinner';
 import ROUTES from 'constants/routes';
 import ErrorDetailsContainer from 'container/ErrorDetails';
 import React from 'react';
+import { useTranslation } from 'react-i18next';
 import { useQuery } from 'react-query';
 import { useSelector } from 'react-redux';
 import { Redirect, useLocation } from 'react-router-dom';
@@ -13,6 +14,7 @@ import { PayloadProps } from 'types/api/errors/getById';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
 function ErrorDetails(): JSX.Element {
+	const { t } = useTranslation(['common']);
 	const { maxTime, minTime } = useSelector<AppState, GlobalReducer>(
 		(state) => state.globalTime,
 	);
@@ -22,6 +24,7 @@ function ErrorDetails(): JSX.Element {
 	const errorId = params.get('errorId');
 	const errorType = params.get('errorType');
 	const serviceName = params.get('serviceName');
+	const defaultError = t('something_went_wrong');
 
 	const { data, status } = useQuery(
 		[
@@ -81,7 +84,18 @@ function ErrorDetails(): JSX.Element {
 	}
 
 	if (status === 'error' || ErrorIdStatus === 'error') {
-		return <Typography>{data?.error || errorIdPayload?.error}</Typography>;
+		return (
+			<Typography>
+				{data?.error || errorIdPayload?.error || defaultError}
+			</Typography>
+		);
+	}
+
+	if (
+		(status === 'success' && data?.statusCode !== 200) ||
+		(ErrorIdStatus === 'success' && errorIdPayload.statusCode !== 200)
+	) {
+		return <Typography>{data?.error || defaultError}</Typography>;
 	}
 
 	return (