From 4ca1e3437812f2468b0990b8c576870c5dce0cfd Mon Sep 17 00:00:00 2001
From: Raj Kamal Singh <1133322+rkssisodiya@users.noreply.github.com>
Date: Tue, 31 Oct 2023 11:25:41 +0530
Subject: [PATCH] Fix: Log pipelines deployment status unknown (#3838)

* fix: fe: log pipelines: label and icon for deploy status 'UNKNOWN'

* fix: handle scenarios when response.payload?.pipelines is undefined (eg: post delete all)
---
 .../PipelinePage/Layouts/ChangeHistory/utils.tsx     |  5 +++++
 .../PipelinePage/PipelineListsView/index.tsx         | 12 ++++++------
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/frontend/src/container/PipelinePage/Layouts/ChangeHistory/utils.tsx b/frontend/src/container/PipelinePage/Layouts/ChangeHistory/utils.tsx
index ff3161f7d4..705796ffbb 100644
--- a/frontend/src/container/PipelinePage/Layouts/ChangeHistory/utils.tsx
+++ b/frontend/src/container/PipelinePage/Layouts/ChangeHistory/utils.tsx
@@ -3,6 +3,7 @@ import {
 	CloseCircleFilled,
 	ExclamationCircleFilled,
 	LoadingOutlined,
+	MinusCircleFilled,
 } from '@ant-design/icons';
 import { Spin } from 'antd';
 
@@ -16,6 +17,8 @@ export function getDeploymentStage(value: string): string {
 			return 'Dirty';
 		case 'FAILED':
 			return 'Failed';
+		case 'UNKNOWN':
+			return 'Unknown';
 		default:
 			return '';
 	}
@@ -33,6 +36,8 @@ export function getDeploymentStageIcon(value: string): JSX.Element {
 			return <ExclamationCircleFilled />;
 		case 'FAILED':
 			return <CloseCircleFilled />;
+		case 'UNKNOWN':
+			return <MinusCircleFilled />;
 		default:
 			return <span />;
 	}
diff --git a/frontend/src/container/PipelinePage/PipelineListsView/index.tsx b/frontend/src/container/PipelinePage/PipelineListsView/index.tsx
index d602004a68..e7211c059c 100644
--- a/frontend/src/container/PipelinePage/PipelineListsView/index.tsx
+++ b/frontend/src/container/PipelinePage/PipelineListsView/index.tsx
@@ -56,23 +56,23 @@ function PipelineListsView({
 	const [modal, contextHolder] = Modal.useModal();
 	const { notifications } = useNotifications();
 	const [prevPipelineData, setPrevPipelineData] = useState<Array<PipelineData>>(
-		cloneDeep(pipelineData?.pipelines),
+		cloneDeep(pipelineData?.pipelines || []),
 	);
 	const [currPipelineData, setCurrPipelineData] = useState<Array<PipelineData>>(
-		cloneDeep(pipelineData?.pipelines),
+		cloneDeep(pipelineData?.pipelines || []),
 	);
 
 	const [expandedPipelineId, setExpandedPipelineId] = useState<
 		string | undefined
 	>(undefined);
 	const expandedPipelineData = useCallback(
-		() => currPipelineData.find((p) => p.id === expandedPipelineId),
+		() => currPipelineData?.find((p) => p.id === expandedPipelineId),
 		[currPipelineData, expandedPipelineId],
 	);
 	const setExpandedPipelineData = useCallback(
 		(newData: PipelineData): void => {
 			if (expandedPipelineId) {
-				const pipelineIdx = currPipelineData.findIndex(
+				const pipelineIdx = currPipelineData?.findIndex(
 					(p) => p.id === expandedPipelineId,
 				);
 				if (pipelineIdx >= 0) {
@@ -359,8 +359,8 @@ function PipelineListsView({
 			refetchPipelineLists();
 			setActionMode(ActionMode.Viewing);
 			setShowSaveButton(undefined);
-			setCurrPipelineData(response.payload?.pipelines);
-			setPrevPipelineData(response.payload?.pipelines);
+			setCurrPipelineData(response.payload?.pipelines || []);
+			setPrevPipelineData(response.payload?.pipelines || []);
 		} else {
 			modifiedPipelineData.forEach((item: PipelineData) => {
 				const pipelineData = item;