diff --git a/src/client/components/Import.tsx b/src/client/components/Import.tsx index 73ca758..ce47bbf 100644 --- a/src/client/components/Import.tsx +++ b/src/client/components/Import.tsx @@ -6,6 +6,7 @@ import { } from "../actions/fileops.actions"; import "react-loader-spinner/dist/loader/css/react-spinner-loader.css"; import Loader from "react-loader-spinner"; +import { isUndefined } from "lodash"; interface IProps { matches?: unknown; @@ -35,6 +36,10 @@ export const Import = (props: IProps): ReactElement => { const failedImportJobCount = useSelector( (state: RootState) => state.fileOps.failedImportJobCount, ); + + const lastQueueJob = useSelector( + (state: RootState) => state.fileOps.lastQueueJob, + ); const libraryQueueImportStatus = useSelector( (state: RootState) => state.fileOps.IMSCallInProgress, ); @@ -55,12 +60,12 @@ export const Import = (props: IProps): ReactElement => { }, [isImportQueuePaused]); const pauseIconText = ( <> - Pause Import + Pause ); const playIconText = ( <> - Resume Import + Resume ); return ( @@ -100,35 +105,52 @@ export const Import = (props: IProps): ReactElement => { Start Import

-
-
-
- - {libraryQueueResults} - -
-
-
-
- - {failedImportJobCount} - -
-
+ + + + + + + + -
-
-
- -
-
-
- + + + + + + + + +
+ Completed Jobs + Failed Jobs + Queue Controls +
+
+ + {libraryQueueResults} + +
+
+ {!isUndefined(failedImportJobCount) && ( +
+ + {failedImportJobCount} + +
+ )} +
+
+ +
+
+ Imported {lastQueueJob}
); diff --git a/src/client/reducers/fileops.reducer.ts b/src/client/reducers/fileops.reducer.ts index 4585734..c161f3e 100644 --- a/src/client/reducers/fileops.reducer.ts +++ b/src/client/reducers/fileops.reducer.ts @@ -58,6 +58,7 @@ const initialState = { libraryComics: [], volumes: [], librarySearchResultsFormatted: [], + lastQueueJob: "", librarySearchResultCount: 0, failedJobCount: 0, libraryQueueResults: [], @@ -163,6 +164,7 @@ function fileOpsReducer(state = initialState, action) { return { ...state, librarySearchResultCount: action.completedJobCount, + lastQueueJob: action.importResult.rawFileDetails.name, recentComics: [...state.recentComics, action.importResult], }; }