diff --git a/package-lock.json b/package-lock.json
index 5a5a6a1eee465540c9cb0100614669709e078212..f14bb3fdef331fa34e1ae5a07a625074554150ba 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,7 +11,7 @@
"@ahooksjs/use-url-state": "^3.5.0",
"@emotion/react": "^11.11.1",
"@emotion/styled": "^11.11.0",
- "@ess-ics/ce-ui-common": "^5.0.0",
+ "@ess-ics/ce-ui-common": "^5.2.0",
"@fontsource/roboto": "^4.1.0",
"@mui/icons-material": "^5.14.1",
"@mui/material": "^5.14.1",
@@ -3023,9 +3023,9 @@
}
},
"node_modules/@ess-ics/ce-ui-common": {
- "version": "5.0.0",
- "resolved": "https://artifactory.esss.lu.se/artifactory/api/npm/ics-npm/@ess-ics/ce-ui-common/-/ce-ui-common-5.0.0.tgz",
- "integrity": "sha1-8kLUz3Zl9TA3sYsL34k0ydGS3PY=",
+ "version": "5.2.0",
+ "resolved": "https://artifactory.esss.lu.se/artifactory/api/npm/ics-npm/@ess-ics/ce-ui-common/-/ce-ui-common-5.2.0.tgz",
+ "integrity": "sha1-yb/dn2ntQOYGnr92xcXpAS0a9vA=",
"dependencies": {
"@fontsource/titillium-web": "^4.5.9",
"@mui/x-data-grid-pro": "^6.5.0",
@@ -38829,9 +38829,9 @@
"dev": true
},
"@ess-ics/ce-ui-common": {
- "version": "5.0.0",
- "resolved": "https://artifactory.esss.lu.se/artifactory/api/npm/ics-npm/@ess-ics/ce-ui-common/-/ce-ui-common-5.0.0.tgz",
- "integrity": "sha1-8kLUz3Zl9TA3sYsL34k0ydGS3PY=",
+ "version": "5.2.0",
+ "resolved": "https://artifactory.esss.lu.se/artifactory/api/npm/ics-npm/@ess-ics/ce-ui-common/-/ce-ui-common-5.2.0.tgz",
+ "integrity": "sha1-yb/dn2ntQOYGnr92xcXpAS0a9vA=",
"requires": {
"@fontsource/titillium-web": "^4.5.9",
"@mui/x-data-grid-pro": "^6.5.0",
diff --git a/package.json b/package.json
index dd153311bd1d8987de4ab0f4fe458c1c5aff5b85..3daaa2135786bee6d7c543cfdff1242ec867eaea 100644
--- a/package.json
+++ b/package.json
@@ -7,7 +7,7 @@
"@ahooksjs/use-url-state": "^3.5.0",
"@emotion/react": "^11.11.1",
"@emotion/styled": "^11.11.0",
- "@ess-ics/ce-ui-common": "^5.0.0",
+ "@ess-ics/ce-ui-common": "^5.2.0",
"@fontsource/roboto": "^4.1.0",
"@mui/icons-material": "^5.14.1",
"@mui/material": "^5.14.1",
diff --git a/src/components/IOC/IOCLiveStatus/IOCLiveStatus.js b/src/components/IOC/IOCLiveStatus/IOCLiveStatus.js
index c5f44535f7323d343cbbb99b6fab848300d34552..39c98c630bda38d198963811a972025650e2afbe 100644
--- a/src/components/IOC/IOCLiveStatus/IOCLiveStatus.js
+++ b/src/components/IOC/IOCLiveStatus/IOCLiveStatus.js
@@ -1,6 +1,10 @@
import React, { useCallback } from "react";
import { Typography } from "@mui/material";
-import { SimpleAccordion, InternalLink } from "@ess-ics/ce-ui-common";
+import {
+ SimpleAccordion,
+ InternalLink,
+ EmptyValue
+} from "@ess-ics/ce-ui-common";
import { IOCDetails } from "../IOCDetails";
import { LokiContainer } from "../../common/Loki/LokiContainer";
import { RecordSearch } from "../../records/RecordSearch";
@@ -28,9 +32,6 @@ export function IOCLiveStatus({ ioc }) {
ioc.activeDeployment
).hasDeployment();
- // if IOC is not deployed some fields has to show '---' value
- const grayOutNoText = <Typography color="gray">---</Typography>;
-
let subset = {
Description: ioc.description,
Revision: iocHasDeployment ? (
@@ -39,7 +40,7 @@ export function IOCLiveStatus({ ioc }) {
revision={ioc.activeDeployment?.sourceVersion}
/>
) : (
- grayOutNoText
+ <EmptyValue />
),
"Deployed on":
iocHasDeployment && ioc.activeDeployment?.host.csEntryIdValid ? (
@@ -56,7 +57,7 @@ export function IOCLiveStatus({ ioc }) {
)}
</Typography>
) : (
- grayOutNoText
+ <EmptyValue />
)
};
diff --git a/src/components/IOC/IOCTable/IOCDescription.js b/src/components/IOC/IOCTable/IOCDescription.js
index b53308c0a92923fefd2eab0c918198ad3cd98d1a..55813cc2951d2f32b38d3bcf4ecbe3035c46e66d 100644
--- a/src/components/IOC/IOCTable/IOCDescription.js
+++ b/src/components/IOC/IOCTable/IOCDescription.js
@@ -1,11 +1,17 @@
import React, { useContext, useMemo } from "react";
import { apiContext } from "../../../api/DeployApi";
import { Skeleton } from "@mui/material";
-import { useAPIMethod, EllipsisText } from "@ess-ics/ce-ui-common";
+import { useAPIMethod, EllipsisText, EmptyValue } from "@ess-ics/ce-ui-common";
function createIocDescription(description) {
return (
- <>{description ? <EllipsisText>{description}</EllipsisText> : "---"}</>
+ <>
+ {description ? (
+ <EllipsisText>{description}</EllipsisText>
+ ) : (
+ <EmptyValue />
+ )}
+ </>
);
}
diff --git a/src/components/IOC/IOCTable/IOCTable.js b/src/components/IOC/IOCTable/IOCTable.js
index 326d745e9d892ab4bccba13fa94fb80df682a9dc..ad960c0de6083df83ad13689df22628fe430c681 100644
--- a/src/components/IOC/IOCTable/IOCTable.js
+++ b/src/components/IOC/IOCTable/IOCTable.js
@@ -1,5 +1,10 @@
import React from "react";
-import { Table, InternalLink, EllipsisText } from "@ess-ics/ce-ui-common";
+import {
+ Table,
+ InternalLink,
+ EllipsisText,
+ EmptyValue
+} from "@ess-ics/ce-ui-common";
import { IOCDescription } from "./IOCDescription";
import { IOCStatus } from "./IOCStatus";
@@ -31,7 +36,11 @@ const exploreIocsColumns = [
headerName: "Network",
width: "10ch",
renderCell: (params) => {
- return <EllipsisText>{params.value ?? "---"}</EllipsisText>;
+ return params.value ? (
+ <EllipsisText>{params.value}</EllipsisText>
+ ) : (
+ <EmptyValue />
+ );
},
valueGetter: (params) => {
return params.value;
@@ -68,12 +77,13 @@ function createHostLink(host) {
label={`Host details, ${host?.hostName}`}
width="100%"
>
- <EllipsisText>{host?.hostName ?? "---"}</EllipsisText>
+ host?.hostName ? <EllipsisText>{host?.hostName}</EllipsisText> :{" "}
+ <EmptyValue />
</InternalLink>
);
}
- return "---";
+ return <EmptyValue />;
}
function createIocLink(id, name) {
diff --git a/src/components/Job/JobDetails.js b/src/components/Job/JobDetails.js
index c764d916e223176a389846b89b9bce43613b20c8..4e5865407360e190192cbc7f7e4f8fdc3d5843cf 100644
--- a/src/components/Job/JobDetails.js
+++ b/src/components/Job/JobDetails.js
@@ -6,7 +6,8 @@ import {
AlertBannerList,
ExternalLink,
InternalLink,
- formatDateAndTime
+ formatDateAndTime,
+ EmptyValue
} from "@ess-ics/ce-ui-common";
import { JobBadge } from "./JobBadge";
import { DeploymentJobOutput } from "../deployments/DeploymentJobOutput";
@@ -81,19 +82,23 @@ export function JobDetails({ operation, job }) {
{operation.awxJobUrl}
</ExternalLink>
),
- "created time": operation?.createdAt
- ? formatDateAndTime(operation.createdAt)
- : "-",
- "AWX job start time": operation?.startTime
- ? formatDateAndTime(operation.startTime)
- : "-",
+ "created time": operation?.createdAt ? (
+ formatDateAndTime(operation.createdAt)
+ ) : (
+ <EmptyValue />
+ ),
+ "AWX job start time": operation?.startTime ? (
+ formatDateAndTime(operation.startTime)
+ ) : (
+ <EmptyValue />
+ ),
duration: operation?.finishedAt ? (
<JobDuration
job={operation}
renderContents={(duration) => duration}
/>
) : (
- "-"
+ <EmptyValue />
)
};
diff --git a/src/components/records/RecordHostLink.js b/src/components/records/RecordHostLink.js
index 355b86a626fa7b001ba4cdc41109d4f69437e6dd..cacc63593d2f61bc200d1fc4537013692c358897 100644
--- a/src/components/records/RecordHostLink.js
+++ b/src/components/records/RecordHostLink.js
@@ -4,7 +4,8 @@ import { apiContext } from "../../api/DeployApi";
import {
useAPIMethod,
InternalLink,
- EllipsisText
+ EllipsisText,
+ EmptyValue
} from "@ess-ics/ce-ui-common";
function createRequest(fqdn) {
@@ -20,7 +21,7 @@ function shortenFqdn(fqdn) {
function createHostLink(fqdn, hostInfo) {
// if the fqdn field is empty for some reason
if (fqdn === null || fqdn.trim() === "") {
- return <Typography>{"---"}</Typography>;
+ return <EmptyValue />;
}
// create host link only if the host exists in CSEntry
diff --git a/src/components/records/RecordTable.js b/src/components/records/RecordTable.js
index eab95e640bb0e59b2586c8d5410ec76c1dcfe727..a927315a85dffd8bf8c4a7d9e46d55fe8f4cecf4 100644
--- a/src/components/records/RecordTable.js
+++ b/src/components/records/RecordTable.js
@@ -1,5 +1,10 @@
import React from "react";
-import { Table, InternalLink, EllipsisText } from "@ess-ics/ce-ui-common";
+import {
+ Table,
+ InternalLink,
+ EllipsisText,
+ EmptyValue
+} from "@ess-ics/ce-ui-common";
import { RecordStatusIcon } from "./RecordIcons";
import { Grid } from "@mui/material";
import { RecordHostLink } from "./RecordHostLink";
@@ -75,7 +80,13 @@ function createRecordName(record) {
function createRecordDescription(description) {
return (
- <>{description ? <EllipsisText>{description}</EllipsisText> : "---"}</>
+ <>
+ {description ? (
+ <EllipsisText>{description}</EllipsisText>
+ ) : (
+ <EmptyValue />
+ )}
+ </>
);
}
diff --git a/src/views/host/details/HostDetailsTable.js b/src/views/host/details/HostDetailsTable.js
index 39e97c3d9940a535104d54d0300270cb60a1d642..9fa9109da6da6719d164ec20ea13d3715921a347 100644
--- a/src/views/host/details/HostDetailsTable.js
+++ b/src/views/host/details/HostDetailsTable.js
@@ -1,5 +1,5 @@
import React from "react";
-import { KeyValueTable, InternalLink } from "@ess-ics/ce-ui-common";
+import { KeyValueTable, InternalLink, EmptyValue } from "@ess-ics/ce-ui-common";
import { Stack, Typography } from "@mui/material";
export const HostDetailsTable = ({ host }) => {
@@ -34,7 +34,7 @@ export const HostDetailsTable = ({ host }) => {
</Stack>
);
} else {
- return "---";
+ return <EmptyValue />;
}
}
diff --git a/src/views/records/RecordDetailsView.js b/src/views/records/RecordDetailsView.js
index c09863483b982880e3e5577cdc28d59116e3725b..4d51839124b7556021be6d8798d906c4bab3543b 100644
--- a/src/views/records/RecordDetailsView.js
+++ b/src/views/records/RecordDetailsView.js
@@ -11,7 +11,8 @@ import {
RootPaper,
KeyValueTable,
GlobalAppBarContext,
- InternalLink
+ InternalLink,
+ EmptyValue
} from "@ess-ics/ce-ui-common";
import { RecordBadge } from "../../components/records/RecordBadge";
import { applicationTitle } from "../../components/common/Helper";
@@ -91,7 +92,7 @@ export function RecordDetailsView() {
</InternalLink>
</Typography>
) : (
- record?.alias
+ <EmptyValue />
),
Description: record?.description,
Version: record?.iocVersion,