Add typing /components/deployments

src/components/deployments/DeploymentJobOutput.tsx

-import { useState, useRef, useEffect, useMemo } from "react";
+import { useState, useRef, useEffect } from "react";
 import { Alert, LinearProgress, Stack } from "@mui/material";
 import { LogStreamConsole } from "../common/LogStream/LogStreamConsole";
 import { LogStreamConsoleDialog } from "../common/LogStream/LogStreamConsoleDialog";
 import { PopoutButton } from "../common/Buttons/PopoutButton";
-import { getErrorMessage, isAbortError } from "../common/Helper";
-import { useLazyFetchDeploymentJobLogQuery } from "../../store/deployApi";
+import { getErrorState } from "../common/Alerts/AlertsData";
+import {
+  JobDetails,
+  useLazyFetchDeploymentJobLogQuery
+} from "../../store/deployApi";
 
 const LOG_POLL_INTERVAL = 5000;
 
-export function DeploymentJobOutput({ job, isExpanded }) {
+interface DeploymentJobOutputProps {
+  job: JobDetails;
+  isExpanded: boolean;
+}
+export function DeploymentJobOutput({
+  job,
+  isExpanded
+}: DeploymentJobOutputProps) {
   const [consoleDialogOpen, setConsoleDialogOpen] = useState(false);
   const finalResultsNeeded = useRef(true);
-  const params = useMemo(
-    () => ({
-      awxJobId: job.awxJobId
-    }),
-    [job]
-  );
   const [getLogById, { data: log, isSuccess: logDataReady, error: logError }] =
     useLazyFetchDeploymentJobLogQuery({
       pollingInterval: isExpanded ? LOG_POLL_INTERVAL : 0
     });
 
   useEffect(() => {
-    if (isExpanded) {
-      if (!job.finishedAt || finalResultsNeeded.current) {
-        getLogById(params);
-        finalResultsNeeded.current = !job.finishedAt;
-      }
+    if (
+      !isExpanded ||
+      (job.finishedAt && !finalResultsNeeded.current) ||
+      !job.awxJobId
+    ) {
+      return;
     }
-  }, [job.finishedAt, job.jobId, isExpanded, getLogById, params]);
 
-  const hasAbortError = isAbortError(logError);
+    getLogById({ awxJobId: job.awxJobId });
+    finalResultsNeeded.current = !job.finishedAt;
+  }, [job.finishedAt, job, isExpanded, getLogById, job.awxJobId]);
+
   const showLoading = !log || !job.startTime;
 
   useEffect(() => {
     finalResultsNeeded.current = true;
-  }, [job.jobId]);
+  }, [job]);
 
-  if (logError && !hasAbortError) {
+  if (logError) {
     return (
       <Stack>
-        <Alert severity="error">{getErrorMessage(logError)}</Alert>
+        <Alert severity="error">{getErrorState(logError).message}</Alert>
       </Stack>
     );
   }
@@ -76,7 +83,7 @@ export function DeploymentJobOutput({ job, isExpanded }) {
         onDialogClose={() => setConsoleDialogOpen(false)}
       />
       <LogStreamConsole
-        log={log.stdoutHtml}
+        log={log?.stdoutHtml}
         dataReady={logDataReady}
         height="500px"
       />

src/components/deployments/index.ts

-import { DeploymentStatusIcon } from "./DeploymentIcons";
 import { DeploymentJobOutput } from "./DeploymentJobOutput";
 
-export { DeploymentStatusIcon, DeploymentJobOutput };
+export { DeploymentJobOutput };