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;