From 2b536bba63a2c31d8e288d0707c495804e5236b7 Mon Sep 17 00:00:00 2001
From: Johanna Szepanski <johanna.szepanski@softhouse.se>
Date: Mon, 20 Jan 2025 08:20:09 +0100
Subject: [PATCH] fixed merge conflicts and migrated batch job to typescript

---
 ...ilsBatchJob.jsx => JobDetailsBatchJob.tsx} | 46 ++++++++++---------
 src/components/Job/JobDetailsSection.tsx      |  2 +-
 src/components/Job/JobDetailsSingleJob.tsx    |  5 +-
 src/components/Job/JobDetailsTable.tsx        | 24 +---------
 src/components/Job/JobHost.tsx                | 28 +++++++++++
 src/components/Job/JobUtils.jsx               | 45 ------------------
 src/components/Job/JobUtils.ts                | 13 +++++-
 7 files changed, 70 insertions(+), 93 deletions(-)
 rename src/components/Job/{JobDetailsBatchJob.jsx => JobDetailsBatchJob.tsx} (67%)
 create mode 100644 src/components/Job/JobHost.tsx
 delete mode 100644 src/components/Job/JobUtils.jsx

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 fdfb6e15..cbb02c58 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 108220f9..19ef325d 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 53ff1fa4..e60018e1 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 ef15b140..2832645a 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 00000000..465f26a7
--- /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 4d76a2de..00000000
--- 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 157e23bf..b842300f 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;
 
-- 
GitLab