diff --git a/ui/src/components/common/StatusCounts/StatusCounts.tsx b/ui/src/components/common/StatusCounts/StatusCounts.tsx
index 4821c4bb5..52227d6f0 100644
--- a/ui/src/components/common/StatusCounts/StatusCounts.tsx
+++ b/ui/src/components/common/StatusCounts/StatusCounts.tsx
@@ -29,7 +29,11 @@ export function StatusCounts(counts: StatusCountsProps) {
0
+ ? IconsStatusMap[key]
+ : IconsStatusMap[`${key}0`]
+ }
alt={key}
className="status-icon-img"
/>
diff --git a/ui/src/components/common/SummaryPageLayout/partials/SummaryStatuses/index.tsx b/ui/src/components/common/SummaryPageLayout/partials/SummaryStatuses/index.tsx
index 39113755a..5b7f4fb1b 100644
--- a/ui/src/components/common/SummaryPageLayout/partials/SummaryStatuses/index.tsx
+++ b/ui/src/components/common/SummaryPageLayout/partials/SummaryStatuses/index.tsx
@@ -4,6 +4,7 @@ import { StatusBar } from "../../../StatusBar";
import { Help } from "../../../Help";
import circleCheck from "../../../../../images/checkmark-circle.png";
import circleDash from "../../../../../images/circle-dash.png";
+import { ACTIVE, INACTIVE } from "../../../../../utils";
import "./style.css";
@@ -27,8 +28,8 @@ export function SummaryStatuses({
healthy,
warning,
critical,
- activeText = "Active",
- inAcitveText = "Non-Active",
+ activeText = ACTIVE,
+ inAcitveText = INACTIVE,
tooltip,
linkComponent,
}: SummaryStatusesProps) {
@@ -125,7 +126,7 @@ export function SummaryStatuses({
justifyContent: "flex-end",
paddingRight: "0.2rem",
marginRight: "1rem",
- height: "100%"
+ height: "100%",
}}
>
diff --git a/ui/src/components/pages/Cluster/partials/ClusterNamespaceListing/index.tsx b/ui/src/components/pages/Cluster/partials/ClusterNamespaceListing/index.tsx
index 6c442cab8..50e5d9efe 100644
--- a/ui/src/components/pages/Cluster/partials/ClusterNamespaceListing/index.tsx
+++ b/ui/src/components/pages/Cluster/partials/ClusterNamespaceListing/index.tsx
@@ -55,7 +55,7 @@ export function ClusterNamespaceListing({
);
}
// Sort by name
- filtered.sort((a, b) => (a.name > b.name ? 1 : -1));
+ filtered?.sort((a, b) => (a.name > b.name ? 1 : -1));
//Filter based on the empty pipelines filter
if (namespaceFilter === WITH_PIPELINES) {
diff --git a/ui/src/components/pages/Cluster/partials/NamespaceCard/index.tsx b/ui/src/components/pages/Cluster/partials/NamespaceCard/index.tsx
index a35b9b5f2..e7fca9407 100644
--- a/ui/src/components/pages/Cluster/partials/NamespaceCard/index.tsx
+++ b/ui/src/components/pages/Cluster/partials/NamespaceCard/index.tsx
@@ -5,6 +5,7 @@ import Grid from "@mui/material/Grid";
import { Link } from "react-router-dom";
import { NamespaceCardProps } from "../../../../../types/declarations/cluster";
import { StatusCounts } from "../../../../common/StatusCounts/StatusCounts";
+import { ACTIVE, INACTIVE } from "../../../../../utils";
import "./style.css";
@@ -59,7 +60,7 @@ export function NamespaceCard({ data }: NamespaceCardProps) {
{data?.pipelinesActiveCount}
- Active
+ {ACTIVE}
@@ -69,7 +70,7 @@ export function NamespaceCard({ data }: NamespaceCardProps) {
{data?.pipelinesInactiveCount}
- Non-Active
+ {INACTIVE}
@@ -137,7 +138,7 @@ export function NamespaceCard({ data }: NamespaceCardProps) {
{data?.isbsActiveCount}
- Active
+ {ACTIVE}
@@ -147,7 +148,7 @@ export function NamespaceCard({ data }: NamespaceCardProps) {
{data?.isbsInactiveCount}
- Non-Active
+ {INACTIVE}
diff --git a/ui/src/components/pages/Namespace/partials/NamespacePipelineListing/index.tsx b/ui/src/components/pages/Namespace/partials/NamespacePipelineListing/index.tsx
index 523193c88..22c7fffdf 100644
--- a/ui/src/components/pages/Namespace/partials/NamespacePipelineListing/index.tsx
+++ b/ui/src/components/pages/Namespace/partials/NamespacePipelineListing/index.tsx
@@ -34,7 +34,7 @@ import {
DESC,
FAILED,
HEALTHY,
- INACTIVE,
+ INACTIVE_STATTUS,
LAST_CREATED_SORT,
LAST_UPDATED_SORT,
PAUSED,
@@ -49,7 +49,14 @@ import {
import "./style.css";
const MAX_PAGE_SIZE = 4;
-export const HEALTH = [ALL, HEALTHY, WARNING, CRITICAL, INACTIVE, UNKNOWN];
+export const HEALTH = [
+ ALL,
+ HEALTHY,
+ WARNING,
+ CRITICAL,
+ INACTIVE_STATTUS,
+ UNKNOWN,
+];
export const STATUS = [
ALL,
RUNNING,
@@ -148,7 +155,7 @@ export function NamespacePipelineListing({
}
// Sorting
if (orderBy.value === ALPHABETICAL_SORT) {
- filtered.sort((a: PipelineData, b: PipelineData) => {
+ filtered?.sort((a: PipelineData, b: PipelineData) => {
if (orderBy.sortOrder === ASC) {
return a.name > b.name ? 1 : -1;
} else {
@@ -156,7 +163,7 @@ export function NamespacePipelineListing({
}
});
} else if (orderBy.value === LAST_UPDATED_SORT) {
- filtered.sort((a: PipelineData, b: PipelineData) => {
+ filtered?.sort((a: PipelineData, b: PipelineData) => {
if (orderBy.sortOrder === ASC) {
return a?.pipeline?.status?.lastUpdated >
b?.pipeline?.status?.lastUpdated
@@ -170,7 +177,7 @@ export function NamespacePipelineListing({
}
});
} else {
- filtered.sort((a: PipelineData, b: PipelineData) => {
+ filtered?.sort((a: PipelineData, b: PipelineData) => {
if (orderBy.sortOrder === ASC) {
return Date.parse(a?.pipeline?.metadata?.creationTimestamp) >
Date.parse(b?.pipeline?.metadata?.creationTimestamp)
@@ -247,7 +254,7 @@ export function NamespacePipelineListing({
}
// Sorting
if (orderBy.value === ALPHABETICAL_SORT) {
- filtered.sort((a: ISBServicesListing, b: ISBServicesListing) => {
+ filtered?.sort((a: ISBServicesListing, b: ISBServicesListing) => {
if (orderBy.sortOrder === ASC) {
return a.name > b.name ? 1 : -1;
} else {
@@ -255,37 +262,49 @@ export function NamespacePipelineListing({
}
});
} else if (orderBy.value === LAST_UPDATED_SORT) {
- filtered.sort((a: ISBServicesListing, b: ISBServicesListing) => {
+ filtered?.sort((a: ISBServicesListing, b: ISBServicesListing) => {
if (orderBy.sortOrder === ASC) {
+ if (!a?.isbService?.status?.conditions) {
+ return 1;
+ }
+ if (!b?.isbService?.status?.conditions) {
+ return -1;
+ }
return new Date(
a?.isbService?.status?.conditions[
a?.isbService?.status?.conditions?.length - 1
- ].lastTransitionTime
+ ]?.lastTransitionTime
) >
new Date(
b?.isbService?.status?.conditions[
b?.isbService?.status?.conditions?.length - 1
- ].lastTransitionTime
+ ]?.lastTransitionTime
)
? 1
: -1;
} else {
+ if (!a?.isbService?.status?.conditions) {
+ return -1;
+ }
+ if (!b?.isbService?.status?.conditions) {
+ return 1;
+ }
return new Date(
a?.isbService?.status?.conditions[
a?.isbService?.status?.conditions?.length - 1
- ].lastTransitionTime
+ ]?.lastTransitionTime
) <
new Date(
b?.isbService?.status?.conditions[
b?.isbService?.status?.conditions?.length - 1
- ].lastTransitionTime
+ ]?.lastTransitionTime
)
? 1
: -1;
}
});
} else {
- filtered.sort((a: ISBServicesListing, b: ISBServicesListing) => {
+ filtered?.sort((a: ISBServicesListing, b: ISBServicesListing) => {
if (orderBy.sortOrder === ASC) {
return new Date(a?.isbService?.metadata?.creationTimestamp) >
new Date(b?.isbService?.metadata?.creationTimestamp)
diff --git a/ui/src/images/critical0.png b/ui/src/images/critical0.png
new file mode 100644
index 000000000..1abe47d53
Binary files /dev/null and b/ui/src/images/critical0.png differ
diff --git a/ui/src/images/heart-fill0.png b/ui/src/images/heart-fill0.png
new file mode 100644
index 000000000..d51934ccc
Binary files /dev/null and b/ui/src/images/heart-fill0.png differ
diff --git a/ui/src/images/warning0.png b/ui/src/images/warning0.png
new file mode 100644
index 000000000..5b4581ade
Binary files /dev/null and b/ui/src/images/warning0.png differ
diff --git a/ui/src/utils/index.tsx b/ui/src/utils/index.tsx
index d201bd237..0d47d55e2 100644
--- a/ui/src/utils/index.tsx
+++ b/ui/src/utils/index.tsx
@@ -5,6 +5,9 @@ import circleDash from "../../src/images/circle-dash.png";
import heartFill from "../../src/images/heart-fill.png";
import warning from "../../src/images/warning-circle.png";
import critical from "../../src/images/critical.png";
+import heartFill0 from "../../src/images/heart-fill0.png";
+import warning0 from "../../src/images/warning0.png";
+import critical0 from "../../src/images/critical0.png";
import moment from "moment";
import { IsbServiceSpec } from "../types/declarations/pipeline";
import { styled } from "@mui/material/styles";
@@ -13,10 +16,14 @@ import Tooltip, { tooltipClasses, TooltipProps } from "@mui/material/Tooltip";
// global constants
export const ALL = "All";
export const RUNNING = "Running";
-export const ACTIVE = "active";
-export const INACTIVE = "inactive";
+export const ACTIVE = "Running";
+export const INACTIVE = "Not-Running";
+export const INACTIVE_STATTUS = "inactive";
export const HEALTHY = "healthy";
export const WARNING = "warning";
+export const CRITICAL0 = "critical0";
+export const HEALTHY0 = "healthy0";
+export const WARNING0 = "warning0";
export const CRITICAL = "critical";
export const SUCCEEDED = "Succeeded";
export const FAILED = "Failed";
@@ -234,9 +241,13 @@ export const IconsStatusMap = {
[PAUSED]: circleDash,
[ACTIVE]: circleCheck,
[INACTIVE]: circleDash,
+ [INACTIVE_STATTUS]: circleDash,
[HEALTHY]: heartFill,
[WARNING]: warning,
[CRITICAL]: critical,
+ [HEALTHY0]: heartFill0,
+ [WARNING0]: warning0,
+ [CRITICAL0]: critical0,
[STOPPED]: circleDash,
[UNKNOWN]: circleDash,
};
@@ -247,7 +258,7 @@ interface StatusStringType {
export const StatusString: StatusStringType = {
[ALL]: "All",
- [RUNNING]: "Active",
+ [RUNNING]: "Running",
[SUCCEEDED]: "Succeeded",
[FAILED]: "Failed",
[PENDING]: "Pending",
@@ -255,22 +266,29 @@ export const StatusString: StatusStringType = {
[DELETING]: "Deleting",
[PAUSED]: "Paused",
[STOPPED]: "Stopped",
- [ACTIVE]: "Active",
+ [ACTIVE]: "Running",
[INACTIVE]: "Inactive",
+ [INACTIVE_STATTUS]: "Inactive",
[HEALTHY]: "Healthy",
[WARNING]: "Warning",
[CRITICAL]: "Critical",
[UNKNOWN]: "Unknown",
+ [WARNING0]: "Warning",
+ [CRITICAL0]: "Critical",
+ [HEALTHY0]: "Healthy",
};
export const ISBStatusString: StatusStringType = {
- [RUNNING]: "Active",
+ [RUNNING]: "Running",
[FAILED]: "Failed",
[PENDING]: "Pending",
[HEALTHY]: "Healthy",
[WARNING]: "Warning",
[CRITICAL]: "Critical",
[UNKNOWN]: "Unknown",
+ [WARNING0]: "Warning",
+ [CRITICAL0]: "Critical",
+ [HEALTHY0]: "Healthy",
};
// returns the duration string in the format of 1d 2hr 3min 4sec 5ms