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 1/2] 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 (

From 4b591fabf746c5129cb571a1460609693313486d Mon Sep 17 00:00:00 2001
From: Palash gupta <palash@signoz.io>
Date: Fri, 13 May 2022 10:38:32 +0530
Subject: [PATCH 2/2] chore: error detail is updated

---
 frontend/src/pages/ErrorDetails/index.tsx | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/frontend/src/pages/ErrorDetails/index.tsx b/frontend/src/pages/ErrorDetails/index.tsx
index cd54cba097..5f9e6c8e9f 100644
--- a/frontend/src/pages/ErrorDetails/index.tsx
+++ b/frontend/src/pages/ErrorDetails/index.tsx
@@ -75,14 +75,17 @@ function ErrorDetails(): JSX.Element {
 		},
 	);
 
+	// if errorType and serviceName is null redirecting to the ALL_ERROR page not now
 	if (errorType === null || serviceName === null) {
 		return <Redirect to={ROUTES.ALL_ERROR} />;
 	}
 
+	// when the api is in loading state
 	if (status === 'loading' || ErrorIdStatus === 'loading') {
 		return <Spinner tip="Loading.." />;
 	}
 
+	// if any error occurred while loading
 	if (status === 'error' || ErrorIdStatus === 'error') {
 		return (
 			<Typography>
@@ -91,9 +94,10 @@ function ErrorDetails(): JSX.Element {
 		);
 	}
 
+	// if API is successfully but there is an error
 	if (
-		(status === 'success' && data?.statusCode !== 200) ||
-		(ErrorIdStatus === 'success' && errorIdPayload.statusCode !== 200)
+		(status === 'success' && data?.statusCode >= 400) ||
+		(ErrorIdStatus === 'success' && errorIdPayload.statusCode >= 400)
 	) {
 		return <Typography>{data?.error || defaultError}</Typography>;
 	}