@@ -107,13 +110,19 @@ export function PipelineSummaryStatus({ pipelineId, pipeline, lag, refresh }) {
>
-
- Max lag:
-
- {" "}
- {DurationString(lag)}
-
-
+
+
+ Max lag:
+
+ {" "}
+ {lag < 0 ? "Unavailable now" : DurationString(lag)}
+
+
+
diff --git a/ui/src/utils/index.ts b/ui/src/utils/index.tsx
similarity index 85%
rename from ui/src/utils/index.ts
rename to ui/src/utils/index.tsx
index d7a950a65e..6f8944d53f 100644
--- a/ui/src/utils/index.ts
+++ b/ui/src/utils/index.tsx
@@ -1,3 +1,4 @@
+import React from "react";
import { Pod, PodDetail, ResourceUsage } from "../types/declarations/pods";
import circleCheck from "../../src/images/checkmark-circle.png";
import circleDash from "../../src/images/circle-dash.png";
@@ -6,6 +7,8 @@ import warning from "../../src/images/warning-circle.png";
import critical from "../../src/images/critical.png";
import moment from "moment";
import { IsbServiceSpec } from "../types/declarations/pipeline";
+import { styled } from "@mui/material/styles";
+import Tooltip, { tooltipClasses, TooltipProps } from "@mui/material/Tooltip";
// global constants
export const ALL = "All";
@@ -51,7 +54,8 @@ export async function getAPIResponseError(
try {
const data = await response.json();
if (data.errMsg) {
- message = response.status === 403 ? `Error: ${data.errMsg}` : data.errMsg;
+ message =
+ response.status === 403 ? `Error: ${data.errMsg}` : data.errMsg;
}
} catch (e) {
// Ignore
@@ -342,3 +346,37 @@ export const timeAgo = (timestamp: string) => {
}
return time;
};
+
+export const PIPELINE_STATUS_TOOLTIP =
+ "Pipeline health is determined by backpressure. Active pipelines are running, while non-active pipelines are failed, pausing, paused, or deleting.";
+export const ISB_SERVICES_TOOLTIP =
+ "Inter State Buffer Services are used to transfer data between vertices in a pipeline.";
+export const ISB_SERVICES_STATUS_TOOLTIP = (
+
+ <>
+ Healthy: The ISB service is operating optimally. No issues or
+ anomalies detected.
+
+ Warning: The ISB service is experiencing minor issues or
+ degradation within the data processing pipeline. Consider monitoring and
+ further investigation.
+
+ Critical: The ISB service is in a critical state. Immediate
+ attention required.
+
+
+);
+export const MAX_LAG_TOOLTIP =
+ "Max lag is the amount of time between the oldest and newest data that is being processed on.";
+export const ERRORS_TOOLTIP =
+ "Errors that occur when attempting to retrieve data";
+// export const PIPELINES_TOOLTIP = "Pipelines list"
+// export const ISB_TOOLTIP = "Inter State Buffer services list"
+
+export const HTMLlTooltip = styled(({ className, ...props }: TooltipProps) => (
+
+))(() => ({
+ [`& .${tooltipClasses.tooltip}`]: {
+ fontSize: 14,
+ },
+}));