diff --git a/src/client/components/Import/Import.tsx b/src/client/components/Import/Import.tsx index 86cd845..d370e4d 100644 --- a/src/client/components/Import/Import.tsx +++ b/src/client/components/Import/Import.tsx @@ -1,9 +1,4 @@ import React, { ReactElement, useCallback, useEffect } from "react"; -import { - fetchComicBookMetadata, - getImportJobResultStatistics, - setQueueControl, -} from "../../actions/fileops.actions"; import "react-loader-spinner/dist/loader/css/react-spinner-loader.css"; import { format } from "date-fns"; import Loader from "react-loader-spinner"; @@ -21,10 +16,7 @@ interface IProps { } /** - * Component to facilitate comics. - * - * @remarks - * This method is part of the {@link core-library#Statistics | Statistics subsystem}. + * Component to facilitate the import of comics to the ThreeTwo library * * @param x - The first input number * @param y - The second input number @@ -41,14 +33,6 @@ export const Import = (props: IProps): ReactElement => { })), ); - // const libraryQueueImportStatus = useSelector( - // (state: RootState) => state.fileOps.LSQueueImportStatus, - // ); - // - // const allImportJobResults = useSelector( - // (state: RootState) => state.fileOps.importJobStatistics, - // ); - const sessionId = localStorage.getItem("sessionId"); const { mutate: initiateImport } = useMutation({ mutationFn: async () => @@ -59,6 +43,15 @@ export const Import = (props: IProps): ReactElement => { }), }); + const { data, isError, isLoading } = useQuery({ + queryKey: ["allImportJobResults"], + queryFn: async () => + await axios({ + method: "GET", + url: "http://localhost:3000/api/jobqueue/getJobResultStatistics", + }), + }); + // 1a. Act on each comic issue successfully imported/failed, as indicated // by the LS_COVER_EXTRACTED/LS_COVER_EXTRACTION_FAILED events socketIOInstance.on("LS_COVER_EXTRACTED", (data) => { @@ -89,10 +82,6 @@ export const Import = (props: IProps): ReactElement => { ); }; - useEffect(() => { - // dispatch(getImportJobResultStatistics()); - }, []); - const renderQueueControls = (status: string): ReactElement | null => { switch (status) { case "running": @@ -173,98 +162,104 @@ export const Import = (props: IProps): ReactElement => {
- <> -| Completed Jobs | -Failed Jobs | -Queue Controls | -Queue Status | -
|---|
| Completed Jobs | +Failed Jobs | +Queue Controls | +Queue Status | +
|---|---|---|---|
|
- {importJobQueue.successfulJobCount > 0 && (
-
-
- {importJobQueue.successfulJobCount}
-
-
- )}
- |
-
- {importJobQueue.failedJobCount > 0 && (
-
-
- {importJobQueue.failedJobCount}
-
-
- )}
- |
+ ||
|
+ {importJobQueue.successfulJobCount > 0 && (
+
+
+ {importJobQueue.successfulJobCount}
+
+
+ )}
+ |
+
+ {importJobQueue.failedJobCount > 0 && (
+
+
+ {importJobQueue.failedJobCount}
+
+
+ )}
+ |
- {renderQueueControls(importJobQueue.status)} | -- {importJobQueue.status !== undefined ? ( - - {importJobQueue.status} - - ) : null} - | -
| Time Started | -Session Id | -Imported | -Failed | -||||
|---|---|---|---|---|---|---|---|
| - {format( - new Date(jobResult.earliestTimestamp), - "EEEE, hh:mma, do LLLL Y", - )} - | -- - {jobResult.sessionId} - - | -- - {jobResult.completedJobs} - - | -- - {jobResult.failedJobs} - - | + {!isLoading && !isEmpty(data?.data) && ( + <> +
| Time Started | +Session Id | +Imported | +Failed |
|---|