diff --git a/src/client/actions/fileops.actions.tsx b/src/client/actions/fileops.actions.tsx index e46f537..486530d 100644 --- a/src/client/actions/fileops.actions.tsx +++ b/src/client/actions/fileops.actions.tsx @@ -35,6 +35,7 @@ import { VOLUMES_FETCHED, CV_WEEKLY_PULLLIST_FETCHED, LIBRARY_SERVICE_HEALTH, + LS_SET_QUEUE_STATUS, } from "../constants/action-types"; import { success } from "react-notification-system-redux"; @@ -96,13 +97,14 @@ export const fetchComicBookMetadata = () => async (dispatch) => { data: {}, }); }; -export const toggleImportQueueStatus = (options) => async (dispatch) => { - dispatch({ - type: LS_TOGGLE_IMPORT_QUEUE, - meta: { remote: true }, - data: { manjhul: "jigyadam", action: options.action }, - }); -}; +export const setQueueControl = + (queueAction: string, queueStatus: string) => async (dispatch) => { + dispatch({ + type: LS_SET_QUEUE_STATUS, + meta: { remote: true }, + data: { queueAction, queueStatus }, + }); + }; /** * Fetches comic book metadata for various types * @return metadata for the comic book object categories diff --git a/src/client/components/App.tsx b/src/client/components/App.tsx index 264b8d2..71e5f9b 100644 --- a/src/client/components/App.tsx +++ b/src/client/components/App.tsx @@ -108,9 +108,6 @@ export const App = (): ReactElement => { meta: { remote: true }, session: { sessionId }, }); - socketIOConnectionInstance.on("yelaveda", (data) => { - console.log(data); - }); } else { // Inititalize the session and persist the sessionId to localStorage socketIOConnectionInstance.on("sessionInitialized", (sessionId) => { diff --git a/src/client/components/Downloads/Downloads.tsx b/src/client/components/Downloads/Downloads.tsx index a18eafe..3c619ed 100644 --- a/src/client/components/Downloads/Downloads.tsx +++ b/src/client/components/Downloads/Downloads.tsx @@ -1,4 +1,10 @@ -import React, { ReactElement, useCallback, useContext, useEffect, useState } from "react"; +import React, { + ReactElement, + useCallback, + useContext, + useEffect, + useState, +} from "react"; import { getTransfers } from "../../actions/airdcpp.actions"; import { useDispatch, useSelector } from "react-redux"; import { AirDCPPSocketContext } from "../../context/AirDCPPSocket"; @@ -20,7 +26,9 @@ export const Downloads = (props: IDownloadsProps): ReactElement => { const airDCPPTransfers = useSelector( (state: RootState) => state.airdcpp.transfers, ); - const issueBundles = useSelector((state: RootState) => state.airdcpp.issue_bundles); + const issueBundles = useSelector( + (state: RootState) => state.airdcpp.issue_bundles, + ); const [bundles, setBundles] = useState([]); // Make the call to get all transfers from AirDC++ useEffect(() => { @@ -37,18 +45,26 @@ export const Downloads = (props: IDownloadsProps): ReactElement => { useEffect(() => { if (!isUndefined(issueBundles)) { const foo = issueBundles.data.map((bundle) => { - const { rawFileDetails, inferredMetadata, acquisition: { directconnect: { downloads } }, sourcedMetadata: { locg, comicvine } } = bundle; + const { + rawFileDetails, + inferredMetadata, + acquisition: { + directconnect: { downloads }, + }, + sourcedMetadata: { locg, comicvine }, + } = bundle; const { issueName, url } = determineCoverFile({ - rawFileDetails, comicvine, locg, + rawFileDetails, + comicvine, + locg, }); - return { ...bundle, issueName, url } - - }) + return { ...bundle, issueName, url }; + }); setBundles(foo); } - }, [issueBundles]) + }, [issueBundles]); - return !isNil(bundles) ? + return !isNil(bundles) ? (

Downloads

@@ -56,45 +72,59 @@ export const Downloads = (props: IDownloadsProps): ReactElement => {
{bundles.map((bundle, idx) => { console.log(bundle); - return
- + return ( +
+ - - - - - - - - - - - {bundle.acquisition.directconnect.downloads.map((bundle, idx) => { - return ( - - - - - ) - })} - -
NameSizeTypeBundle ID
{bundle.name}{bundle.size}{bundle.type.str}{bundle.bundleId}
- {/* 
{JSON.stringify(bundle.acquisition.directconnect.downloads, null, 2)}
*/} -
+ + + + + + + + + + + {bundle.acquisition.directconnect.downloads.map( + (bundle, idx) => { + return ( + + + + + + + ); + }, + )} + +
NameSizeTypeBundle ID
{bundle.name}{bundle.size}{bundle.type.str} + + {bundle.bundleId} + +
+ {/* 
{JSON.stringify(bundle.acquisition.directconnect.downloads, null, 2)}
*/} +
+ ); })}
- :
There are no downloads.
; + + ) : ( +
There are no downloads.
+ ); }; export default Downloads; diff --git a/src/client/components/Header.tsx b/src/client/components/Header.tsx index af76c39..1b5c97d 100644 --- a/src/client/components/Header.tsx +++ b/src/client/components/Header.tsx @@ -1,22 +1,20 @@ import React, { ReactElement } from "react"; type IHeaderProps = { - headerContent: string; - subHeaderContent: string; - iconClassNames: string; -} + headerContent: string; + subHeaderContent: string; + iconClassNames: string; +}; export const Header = (props: IHeaderProps): ReactElement => { + return ( + <> +

+ {props.headerContent} +

+

{props.subHeaderContent}

+ + ); +}; - return (<> -

- {props.headerContent} -

-

- {props.subHeaderContent} -

- ) - -} - -export default Header; \ No newline at end of file +export default Header; diff --git a/src/client/components/Import.tsx b/src/client/components/Import.tsx index 79a4d37..50cc147 100644 --- a/src/client/components/Import.tsx +++ b/src/client/components/Import.tsx @@ -2,11 +2,15 @@ import React, { ReactElement, useCallback, useContext, useState } from "react"; import { useSelector, useDispatch } from "react-redux"; import { fetchComicBookMetadata, - toggleImportQueueStatus, + setQueueControl, } 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"; +import { + LS_IMPORT_CALL_IN_PROGRESS, + LS_SET_QUEUE_STATUS, +} from "../constants/action-types"; interface IProps { matches?: unknown; @@ -34,40 +38,62 @@ export const Import = (props: IProps): ReactElement => { (state: RootState) => state.fileOps.librarySearchResultCount, ); const failedImportJobCount = useSelector( - (state: RootState) => state.fileOps.failedImportJobCount, + (state: RootState) => state.fileOps.failedJobCount, ); const lastQueueJob = useSelector( (state: RootState) => state.fileOps.lastQueueJob, ); const libraryQueueImportStatus = useSelector( - (state: RootState) => state.fileOps.IMSCallInProgress, + (state: RootState) => state.fileOps.LSQueueImportStatus, ); - const [isImportQueuePaused, setImportQueueStatus] = useState(undefined); + const initiateImport = useCallback(() => { if (typeof props.path !== "undefined") { dispatch(fetchComicBookMetadata(props.path)); } }, [dispatch]); - const toggleImport = useCallback(() => { - setImportQueueStatus(!isImportQueuePaused); - if (isImportQueuePaused === true) { - dispatch(toggleImportQueueStatus({ action: "resume" })); - } else if (isImportQueuePaused === false) { - dispatch(toggleImportQueueStatus({ action: "pause" })); + const toggleQueue = useCallback( + (queueAction: string, queueStatus: string) => { + dispatch(setQueueControl(queueAction, queueStatus)); + }, + [], + ); + + const renderQueueControls = (status: string): ReactElement | null => { + switch (status) { + case "running": + return ( +
+ +
+ ); + case "paused": + return ( +
+ +
+ ); + + case "drained": + return null; + + default: + return null; } - }, [isImportQueuePaused]); - const pauseIconText = ( - <> - Pause - - ); - const playIconText = ( - <> - Resume - - ); + }; + return (
@@ -88,14 +114,16 @@ export const Import = (props: IProps): ReactElement => { This process could take a while, if you have a lot of comics, or are importing over a network connection.

+ {JSON.stringify(libraryQueueImportStatus)}

- - + {renderQueueControls(libraryQueueImportStatus)} diff --git a/src/client/constants/action-types.ts b/src/client/constants/action-types.ts index 2093bc1..cde0b74 100644 --- a/src/client/constants/action-types.ts +++ b/src/client/constants/action-types.ts @@ -129,6 +129,8 @@ export const LS_IMPORT = "LS_IMPORT"; export const LS_COVER_EXTRACTED = "LS_COVER_EXTRACTED"; export const LS_COVER_EXTRACTION_FAILED = "LS_COVER_EXTRACTION_FAILED"; export const LS_COMIC_ADDED = "LS_COMIC_ADDED"; +export const LS_IMPORT_QUEUE_DRAINED = "LS_IMPORT_QUEUE_DRAINED"; +export const LS_SET_QUEUE_STATUS = "LS_SET_QUEUE_STATUS"; // Settings export const SETTINGS_CALL_IN_PROGRESS = "SETTINGS_CALL_IN_PROGRESS"; diff --git a/src/client/reducers/fileops.reducer.ts b/src/client/reducers/fileops.reducer.ts index 24b2b4d..2ff706f 100644 --- a/src/client/reducers/fileops.reducer.ts +++ b/src/client/reducers/fileops.reducer.ts @@ -33,6 +33,8 @@ import { COMICBOOK_EXTRACTION_SUCCESS, LIBRARY_SERVICE_HEALTH, HEALTH_STATUS_TICK, + LS_IMPORT_QUEUE_DRAINED, + LS_SET_QUEUE_STATUS, } from "../constants/action-types"; import { removeLeadingPeriod } from "../shared/utils/formatting.utils"; import { LIBRARY_SERVICE_HOST } from "../constants/endpoints"; @@ -43,6 +45,7 @@ const initialState = { SSCallInProgress: false, imageAnalysisResults: {}, comicBookExtractionInProgress: false, + LSQueueImportStatus: undefined, comicBookMetadata: [], comicVolumeGroups: [], isSocketConnected: false, @@ -154,6 +157,7 @@ function fileOpsReducer(state = initialState, action) { case LS_IMPORT: { return { ...state, + LSQueueImportStatus: "running", }; } case LS_COVER_EXTRACTED: { @@ -173,14 +177,32 @@ function fileOpsReducer(state = initialState, action) { console.log("FAILED", action); return { ...state, - failedImportJobCount: action.failedJobCount, + failedJobCount: action.failedJobCount, }; } - case "LS_IMPORT_QUEUE_DRAINED": { - console.log("Queue drained"); + case LS_IMPORT_QUEUE_DRAINED: { + console.log("drained"); return { ...state, + LSQueueImportStatus: "drained", + }; + } + + case "RESTORE_JOB_COUNTS_AFTER_SESSION_RESTORATION": { + console.log(action); + return { + ...state, + librarySearchResultCount: action.completedJobCount, + failedJobCount: action.failedJobCount, + }; + } + + case LS_SET_QUEUE_STATUS: { + console.log(action); + return { + ...state, + LSQueueImportStatus: action.data.queueStatus, }; }