From 18d2624d6c9550cab9ade7ebac1df2a888272435 Mon Sep 17 00:00:00 2001 From: Rishi Ghan Date: Tue, 7 Nov 2023 20:06:32 -0600 Subject: [PATCH] =?UTF-8?q?=F0=9F=8F=97=EF=B8=8F=20Refactored=20AirDC++=20?= =?UTF-8?q?session=20status=20indicator?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/client/components/App.tsx | 8 +- .../AirDCPPSettings/AirDCPPSettingsForm.tsx | 11 +- src/client/components/shared/ErrorPage.tsx | 5 + src/client/components/shared/Navbar.tsx | 128 +++++++----------- src/client/index.tsx | 7 +- src/client/store/index.ts | 7 +- 6 files changed, 70 insertions(+), 96 deletions(-) create mode 100644 src/client/components/shared/ErrorPage.tsx diff --git a/src/client/components/App.tsx b/src/client/components/App.tsx index d4a087c..be7d7f3 100644 --- a/src/client/components/App.tsx +++ b/src/client/components/App.tsx @@ -10,6 +10,7 @@ import VolumeDetail from "./VolumeDetail/VolumeDetail"; import Downloads from "./Downloads/Downloads"; import { Routes, Route } from "react-router-dom"; +import { Outlet } from "react-router-dom"; import Navbar from "./shared/Navbar"; import "../assets/scss/App.scss"; @@ -46,7 +47,12 @@ export const App = (): ReactElement => { // }); // } // }, []); - return <>{/* */}; + return ( + <> + + + + ); }; export default App; diff --git a/src/client/components/Settings/AirDCPPSettings/AirDCPPSettingsForm.tsx b/src/client/components/Settings/AirDCPPSettings/AirDCPPSettingsForm.tsx index 31cd471..b6aa8fd 100644 --- a/src/client/components/Settings/AirDCPPSettings/AirDCPPSettingsForm.tsx +++ b/src/client/components/Settings/AirDCPPSettings/AirDCPPSettingsForm.tsx @@ -12,7 +12,7 @@ export const AirDCPPSettingsForm = (): ReactElement => { const { airDCPPSocketConnected, airDCPPDisconnectionInfo, - airDCPPSocketConnectionInformation, + airDCPPSessionInformation, airDCPPClientConfiguration, airDCPPSocketInstance, } = useStore( @@ -20,8 +20,7 @@ export const AirDCPPSettingsForm = (): ReactElement => { airDCPPSocketConnected: state.airDCPPSocketConnected, airDCPPDisconnectionInfo: state.airDCPPDisconnectionInfo, airDCPPClientConfiguration: state.airDCPPClientConfiguration, - airDCPPSocketConnectionInformation: - state.airDCPPSocketConnectionInformation, + airDCPPSessionInformation: state.airDCPPSessionInformation, airDCPPSocketInstance: state.airDCPPSocketInstance, })), ); @@ -48,10 +47,8 @@ export const AirDCPPSettingsForm = (): ReactElement => { formHeading={"Configure AirDC++"} /> - {!isEmpty(airDCPPSocketConnectionInformation) ? ( - + {!isEmpty(airDCPPSessionInformation) ? ( + ) : null} {!isEmpty(airDCPPClientConfiguration) ? ( diff --git a/src/client/components/shared/ErrorPage.tsx b/src/client/components/shared/ErrorPage.tsx new file mode 100644 index 0000000..df44293 --- /dev/null +++ b/src/client/components/shared/ErrorPage.tsx @@ -0,0 +1,5 @@ +import React from "react"; + +export const ErrorPage = () => { + return <>Error has been encountered.; +}; diff --git a/src/client/components/shared/Navbar.tsx b/src/client/components/shared/Navbar.tsx index aba0620..4369503 100644 --- a/src/client/components/shared/Navbar.tsx +++ b/src/client/components/shared/Navbar.tsx @@ -1,9 +1,8 @@ -import React, { useContext } from "react"; +import React from "react"; import { SearchBar } from "../GlobalSearchBar/SearchBar"; import { DownloadProgressTick } from "../ComicDetail/DownloadProgressTick"; import { Link } from "react-router-dom"; -import { useSelector } from "react-redux"; -import { isUndefined } from "lodash"; +import { isEmpty, isUndefined } from "lodash"; import { format, fromUnixTime } from "date-fns"; import { useStore } from "../../store/index"; import { useShallow } from "zustand/react/shallow"; @@ -12,7 +11,8 @@ const Navbar: React.FunctionComponent = (props) => { const { airDCPPSocketConnected, airDCPPDisconnectionInfo, - airDCPPSocketConnectionInformation, + airDCPPSessionInformation, + airDCPPDownloadTick, airDCPPClientConfiguration, airDCPPSocketInstance, } = useStore( @@ -20,43 +20,43 @@ const Navbar: React.FunctionComponent = (props) => { airDCPPSocketConnected: state.airDCPPSocketConnected, airDCPPDisconnectionInfo: state.airDCPPDisconnectionInfo, airDCPPClientConfiguration: state.airDCPPClientConfiguration, - airDCPPSocketConnectionInformation: - state.airDCPPSocketConnectionInformation, + airDCPPSessionInformation: state.airDCPPSessionInformation, airDCPPSocketInstance: state.airDCPPSocketInstance, + airDCPPDownloadTick: state.airDCPPDownloadTick, })), ); - const downloadProgressTick = useSelector( - (state: RootState) => state.airdcpp.downloadProgressData, - ); - - const airDCPPSocketConnectionStatus = useSelector( - (state: RootState) => state.airdcpp.isAirDCPPSocketConnected, - ); - const airDCPPSessionInfo = useSelector( - (state: RootState) => state.airdcpp.airDCPPSessionInfo, - ); - const socketDisconnectionReason = useSelector( - (state: RootState) => state.airdcpp.socketDisconnectionReason, - ); + // const downloadProgressTick = useSelector( + // (state: RootState) => state.airdcpp.downloadProgressData, + // ); + // + // const airDCPPSocketConnectionStatus = useSelector( + // (state: RootState) => state.airdcpp.isAirDCPPSocketConnected, + // ); + // const airDCPPSessionInfo = useSelector( + // (state: RootState) => state.airdcpp.airDCPPSessionInfo, + // ); + // const socketDisconnectionReason = useSelector( + // (state: RootState) => state.airdcpp.socketDisconnectionReason, + // ); // Import-related selector hooks - const successfulImportJobCount = useSelector( - (state: RootState) => state.fileOps.successfulJobCount, - ); - const failedImportJobCount = useSelector( - (state: RootState) => state.fileOps.failedJobCount, - ); - - const lastQueueJob = useSelector( - (state: RootState) => state.fileOps.lastQueueJob, - ); - const libraryQueueImportStatus = useSelector( - (state: RootState) => state.fileOps.LSQueueImportStatus, - ); - - const allImportJobResults = useSelector( - (state: RootState) => state.fileOps.importJobStatistics, - ); + // const successfulImportJobCount = useSelector( + // (state: RootState) => state.fileOps.successfulJobCount, + // ); + // const failedImportJobCount = useSelector( + // (state: RootState) => state.fileOps.failedJobCount, + // ); + // + // const lastQueueJob = useSelector( + // (state: RootState) => state.fileOps.lastQueueJob, + // ); + // const libraryQueueImportStatus = useSelector( + // (state: RootState) => state.fileOps.LSQueueImportStatus, + // ); + // + // const allImportJobResults = useSelector( + // (state: RootState) => state.fileOps.importJobStatistics, + // ); return (