diff --git a/src/components/Job/JobDetailsBatchJob.jsx b/src/components/Job/JobDetailsBatchJob.tsx
similarity index 67%
rename from src/components/Job/JobDetailsBatchJob.jsx
rename to src/components/Job/JobDetailsBatchJob.tsx
index fdfb6e151593ab05ff5b1fa9144a56328e5016b0..cbb02c58c5f22011ce570e99398e0de43c788c53 100644
--- a/src/components/Job/JobDetailsBatchJob.jsx
+++ b/src/components/Job/JobDetailsBatchJob.tsx
@@ -7,14 +7,15 @@ import {
usePagination
} from "@ess-ics/ce-ui-common";
import { Typography, Stack } from "@mui/material";
-import {
- getNoOfIOCs,
- getNoOfHosts,
- isDeploymentJob,
- calculateHostText
-} from "./JobUtils";
+import { getNoOfIOCs, getNoOfHosts, isDeploymentJob } from "./JobUtils";
+import { JobHost } from "./JobHost";
import { JobRevisionChip } from "./JobRevisionChip";
import { ROWS_PER_PAGE } from "../../constants";
+import { JobDetails, JobDetailsEntry } from "../../store/deployApi";
+
+interface JobDetailsBatchJobProps {
+ job: JobDetails;
+}
const columns = [
{
@@ -29,9 +30,9 @@ const columns = [
}
];
-const createRow = (job, action) => {
+const createRow = (job: JobDetails, action: string | undefined) => {
return {
- id: `${job.host.hostId}${job.iocId}`,
+ id: `${job.host?.hostId}${job.iocId}`,
ioc: (
<Stack
sx={{ padding: "8px 16px 8px 0" }}
@@ -48,7 +49,7 @@ const createRow = (job, action) => {
>
<EllipsisText>{job.iocName}</EllipsisText>
</InternalLink>
- {isDeploymentJob(action) && (
+ {isDeploymentJob(action) && job.gitReference && job.gitProjectId && (
<JobRevisionChip
gitReference={job.gitReference}
gitProjectId={job.gitProjectId}
@@ -57,38 +58,39 @@ const createRow = (job, action) => {
</Stack>
</Stack>
),
- host: calculateHostText(job)
+ host: <JobHost job={job} />
};
};
-export const JobDetailsBatchJob = ({ operation }) => {
- const [currentRows, setCurrentRows] = useState([]);
+export const JobDetailsBatchJob = ({ job }: JobDetailsBatchJobProps) => {
+ const [currentRows, setCurrentRows] = useState<JobDetailsEntry[]>([]);
const { pagination, setPagination } = usePagination({
rowsPerPageOptions: ROWS_PER_PAGE,
initLimit: ROWS_PER_PAGE[0],
initPage: 0,
- initTotalCount: operation.jobs.length
+ initTotalCount: job.jobs?.length || 0
});
const noOfIOCs = useMemo(() => {
- return getNoOfIOCs(operation.jobs);
- }, [operation]);
+ return getNoOfIOCs(job.jobs);
+ }, [job]);
const noOfHosts = useMemo(() => {
- return getNoOfHosts(operation.jobs);
- }, [operation]);
+ return getNoOfHosts(job.jobs);
+ }, [job]);
useEffect(() => {
const { limit, page } = pagination;
- const list = operation.jobs.reduce((acc, _, index) => {
+ const jobs = (job.jobs as JobDetailsEntry[]) || [];
+ const list = jobs.reduce((acc: JobDetailsEntry[][], _, index) => {
if (index % limit === 0) {
- acc.push(operation.jobs.slice(index, index + limit));
+ acc.push(jobs.slice(index, index + limit));
}
return acc;
}, []);
- setCurrentRows(list[page]);
- }, [pagination, setPagination, operation]);
+ setCurrentRows(list ? list[page] : []);
+ }, [pagination, setPagination, job]);
return (
<SimpleAccordion
@@ -120,7 +122,7 @@ export const JobDetailsBatchJob = ({ operation }) => {
<Table
columns={columns}
disableColumnSorting
- rows={currentRows.map((job) => createRow(job, operation.action))}
+ rows={currentRows.map((batchJob) => createRow(batchJob, job.action))}
pagination={pagination}
onPage={setPagination}
/>
diff --git a/src/components/Job/JobDetailsSection.tsx b/src/components/Job/JobDetailsSection.tsx
index 108220f9f5571f00e118fed16c508f694b45b268..19ef325d042cc896a0aea0629560e7f3f57da7ae 100644
--- a/src/components/Job/JobDetailsSection.tsx
+++ b/src/components/Job/JobDetailsSection.tsx
@@ -72,7 +72,7 @@ export const JobDetailsSection = ({ job }: JobDetailsSectionProps) => {
</Box>
{isBatchJob(job.action) ? (
<Box sx={{ marginBottom: "16px" }}>
- <JobDetailsBatchJob operation={job} />
+ <JobDetailsBatchJob job={job} />
</Box>
) : (
<Box sx={{ marginBottom: "16px" }}>
diff --git a/src/components/Job/JobDetailsSingleJob.tsx b/src/components/Job/JobDetailsSingleJob.tsx
index 53ff1fa421158f373e00e98ee0d75f4b5d27825e..e60018e1decbad4504e8a22de678efa51db527ed 100644
--- a/src/components/Job/JobDetailsSingleJob.tsx
+++ b/src/components/Job/JobDetailsSingleJob.tsx
@@ -1,6 +1,7 @@
import { InternalLink, KeyValueTable } from "@ess-ics/ce-ui-common";
-import { calculateHostText, isDeploymentJob } from "./JobUtils";
+import { isDeploymentJob } from "./JobUtils";
import { JobRevisionChip } from "./JobRevisionChip";
+import { JobHost } from "./JobHost";
import { JobDetails } from "../../store/deployApi";
interface JobDetailsSingleJobProps {
@@ -35,7 +36,7 @@ const getSingleOperationFields = (
</InternalLink>
),
...(isDeployJob && getRevision(operation)),
- host: calculateHostText(operation)
+ host: <JobHost job={operation} />
};
};
diff --git a/src/components/Job/JobDetailsTable.tsx b/src/components/Job/JobDetailsTable.tsx
index ef15b1405f0a6944dc4a6a2ec676ece0e48908b7..2832645a6e6fb72b4c74909516ccce1e8f04e6f7 100644
--- a/src/components/Job/JobDetailsTable.tsx
+++ b/src/components/Job/JobDetailsTable.tsx
@@ -8,6 +8,7 @@ import {
import { Typography, Stack } from "@mui/material";
import { getNoOfIOCs, getNoOfHosts, isBatchJob } from "./JobUtils";
import { JobRevisionChip } from "./JobRevisionChip";
+import { JobHost } from "./JobHost";
import { JobDetails, JobDetailsEntry } from "../../store/deployApi";
const columns = [
@@ -28,27 +29,6 @@ const columns = [
}
];
-const calculateHostText = (job: JobDetailsEntry) => {
- // host is resolvable => show link for users
- if (job?.host?.hostId && job?.host?.externalIdValid) {
- return (
- <InternalLink
- to={`/hosts/${job.host.hostId}`}
- label={`Host Details, ${job.host.fqdn}`}
- width="100%"
- >
- <EllipsisText>{job.host.fqdn}</EllipsisText>
- </InternalLink>
- );
- }
- // gray out hostname if it is from cache
- return (
- <Typography color="gray">
- <EllipsisText>{job?.host?.fqdn}</EllipsisText>
- </Typography>
- );
-};
-
const createRow = (job: JobDetailsEntry) => {
const { iocId, iocName, host, gitReference, gitProjectId } = job;
return {
@@ -62,7 +42,7 @@ const createRow = (job: JobDetailsEntry) => {
<EllipsisText>{iocName}</EllipsisText>
</InternalLink>
),
- host: calculateHostText(job),
+ host: <JobHost job={job} />,
revision: gitReference && gitProjectId && (
<JobRevisionChip
gitReference={gitReference}
diff --git a/src/components/Job/JobHost.tsx b/src/components/Job/JobHost.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..465f26a714951b53f76abdebe34db6b0fe5d574b
--- /dev/null
+++ b/src/components/Job/JobHost.tsx
@@ -0,0 +1,28 @@
+import { EllipsisText, InternalLink } from "@ess-ics/ce-ui-common";
+import { Typography } from "@mui/material";
+import { JobDetails } from "../../store/deployApi";
+
+interface JobHostProps {
+ job: JobDetails;
+}
+
+export const JobHost = ({ job }: JobHostProps) => {
+ // host is resolvable => show link for users
+ if (job?.host?.hostId && job?.host?.externalIdValid) {
+ return (
+ <InternalLink
+ to={`/hosts/${job.host.hostId}`}
+ label={`Host Details, ${job.host.fqdn}`}
+ width="100%"
+ >
+ <EllipsisText>{job.host.fqdn}</EllipsisText>
+ </InternalLink>
+ );
+ }
+ // gray out hostname if it is from cache
+ return (
+ <Typography color="gray">
+ <EllipsisText>{job?.host?.fqdn}</EllipsisText>
+ </Typography>
+ );
+};
diff --git a/src/components/Job/JobUtils.jsx b/src/components/Job/JobUtils.jsx
deleted file mode 100644
index 4d76a2def2185e652f009ebde48602aa18f796b4..0000000000000000000000000000000000000000
--- a/src/components/Job/JobUtils.jsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import { EllipsisText, InternalLink } from "@ess-ics/ce-ui-common";
-import { Typography } from "@mui/material";
-
-export const ACTION_TYPES = {
- DEPLOY: "DEPLOY",
- UNDEPLOY: "UNDEPLOY",
- BATCH_DEPLOY: "BATCH_DEPLOY",
- BATCH_UNDEPLOY: "BATCH_UNDEPLOY",
- START: "START",
- STOP: "STOP"
-};
-
-export const isBatchJob = (action) =>
- action === ACTION_TYPES.BATCH_DEPLOY ||
- action === ACTION_TYPES.BATCH_UNDEPLOY;
-
-export const isDeploymentJob = (action) =>
- action === ACTION_TYPES.BATCH_DEPLOY || action === ACTION_TYPES.DEPLOY;
-
-export const getNoOfIOCs = (jobs) =>
- [...new Set(jobs.map((job) => job.iocId))].length;
-
-export const getNoOfHosts = (jobs) =>
- [...new Set(jobs.map((job) => job.host.hostId))].length;
-
-export const calculateHostText = (job) => {
- // host is resolvable => show link for users
- if (job?.host?.hostId && job?.host?.externalIdValid) {
- return (
- <InternalLink
- to={`/hosts/${job.host.hostId}`}
- label={`Host Details, ${job.host.fqdn}`}
- width="100%"
- >
- <EllipsisText>{job.host.fqdn}</EllipsisText>
- </InternalLink>
- );
- }
- // gray out hostname if it is from cache
- return (
- <Typography color="gray">
- <EllipsisText>{job?.host?.fqdn}</EllipsisText>
- </Typography>
- );
-};
diff --git a/src/components/Job/JobUtils.ts b/src/components/Job/JobUtils.ts
index 157e23bfdbe219be9a535f1c18ed61475fc9ed3c..b842300fb8e5117e8a31dfe60caaadc2c5628cff 100644
--- a/src/components/Job/JobUtils.ts
+++ b/src/components/Job/JobUtils.ts
@@ -1,9 +1,20 @@
-import { ACTION_TYPES } from "./JobData";
import { Job, JobEntry } from "../../store/deployApi";
+export const ACTION_TYPES = {
+ DEPLOY: "DEPLOY",
+ UNDEPLOY: "UNDEPLOY",
+ BATCH_DEPLOY: "BATCH_DEPLOY",
+ BATCH_UNDEPLOY: "BATCH_UNDEPLOY",
+ START: "START",
+ STOP: "STOP"
+};
+
export const isBatchJob = (type: Job["action"]) =>
type === ACTION_TYPES.BATCH_DEPLOY || type === ACTION_TYPES.BATCH_UNDEPLOY;
+export const isDeploymentJob = (action: string | undefined) =>
+ action === ACTION_TYPES.BATCH_DEPLOY || action === ACTION_TYPES.DEPLOY;
+
export const getNoOfIOCs = (jobs?: JobEntry[]) =>
[...new Set(jobs?.map((job) => job.iocId))].length;