From dd4ee443029ce79e6a8ac600ca8debdcbb1fae38 Mon Sep 17 00:00:00 2001 From: shamoon <4887959+shamoon@users.noreply.github.com> Date: Mon, 5 Jun 2023 22:21:26 -0700 Subject: [PATCH] Simplify sonarr / radarr queues, better handle some errors --- public/locales/en/common.json | 6 +- src/components/services/widget/block-list.jsx | 31 ---------- src/components/widgets/queue/queueEntry.jsx | 16 +---- src/widgets/radarr/component.jsx | 54 +++++++--------- src/widgets/radarr/widget.js | 2 +- src/widgets/sonarr/component.jsx | 62 +++++++++---------- src/widgets/sonarr/widget.js | 6 +- tailwind.config.js | 3 - 8 files changed, 64 insertions(+), 116 deletions(-) delete mode 100644 src/components/services/widget/block-list.jsx diff --git a/public/locales/en/common.json b/public/locales/en/common.json index a3d74aee..e20e1908 100755 --- a/public/locales/en/common.json +++ b/public/locales/en/common.json @@ -195,14 +195,16 @@ "wanted": "Wanted", "queued": "Queued", "series": "Series", - "queue": "Queue" + "queue": "Queue", + "unknown": "Unknown" }, "radarr": { "wanted": "Wanted", "missing": "Missing", "queued": "Queued", "movies": "Movies", - "queue": "Queue" + "queue": "Queue", + "unknown": "Unknown" }, "lidarr": { "wanted": "Wanted", diff --git a/src/components/services/widget/block-list.jsx b/src/components/services/widget/block-list.jsx deleted file mode 100644 index 138576bc..00000000 --- a/src/components/services/widget/block-list.jsx +++ /dev/null @@ -1,31 +0,0 @@ -import { useTranslation } from "next-i18next"; -import { useCallback, useState } from 'react'; -import classNames from "classnames"; - -import ResolvedIcon from '../../resolvedicon'; - - -export default function BlockList({ label, children, childHeight }) { - const { t } = useTranslation(); - const [isOpen, setOpen] = useState(false); - - const changeState = useCallback(() => setOpen(!isOpen), [isOpen, setOpen]); - - return ( -
- -
- {children} -
-
- ); -} diff --git a/src/components/widgets/queue/queueEntry.jsx b/src/components/widgets/queue/queueEntry.jsx index 0d0625e9..adea45ad 100644 --- a/src/components/widgets/queue/queueEntry.jsx +++ b/src/components/widgets/queue/queueEntry.jsx @@ -1,22 +1,12 @@ -import {BsFillPlayFill, BsPauseFill} from "react-icons/bs"; - -export default function QueueEntry({ status, title, activity, timeLeft, progress}) { +export default function QueueEntry({ title, activity, timeLeft, progress}) { return ( -
+
-
- {status === "paused" && ( - - )} - {status !== "paused" && ( - - )} -
{title}
diff --git a/src/widgets/radarr/component.jsx b/src/widgets/radarr/component.jsx index 0212eaa7..6ce2f599 100644 --- a/src/widgets/radarr/component.jsx +++ b/src/widgets/radarr/component.jsx @@ -5,9 +5,12 @@ import QueueEntry from "../../components/widgets/queue/queueEntry"; import Container from "components/services/widget/container"; import Block from "components/services/widget/block"; -import BlockList from "components/services/widget/block-list"; import useWidgetAPI from "utils/proxy/use-widget-api"; +function getProgress(sizeLeft, size) { + return sizeLeft === 0 ? 100 : (1 - sizeLeft / size) * 100 +} + export default function Component({ service }) { const { t } = useTranslation(); const { widget } = service; @@ -16,7 +19,6 @@ export default function Component({ service }) { const { data: queuedData, error: queuedError } = useWidgetAPI(widget, "queue/status"); const { data: queueDetailsData, error: queueDetailsError } = useWidgetAPI(widget, "queue/details"); - // information taken from the Radarr docs: https://radarr.video/docs/api/ const formatDownloadState = useCallback((downloadState) => { switch (downloadState) { case "importPending": @@ -33,26 +35,19 @@ export default function Component({ service }) { return ; } - const enableQueue = widget?.enableQueue; - if (!moviesData || !queuedData || !queueDetailsData) { return ( - <> - - - - - - - { enableQueue && - - - - } - + + + + + + ); } + const enableQueue = widget?.enableQueue && Array.isArray(queueDetailsData) && queueDetailsData.length > 0; + return ( <> @@ -61,21 +56,16 @@ export default function Component({ service }) { - { enableQueue && - - - {Array.isArray(queueDetailsData) ? queueDetailsData.map((queueEntry) => ( - entry.id === queueEntry.movieId)?.title} - activity={formatDownloadState(queueEntry.trackedDownloadState)} - key={queueEntry.movieId} - /> - )) : undefined} - - + {enableQueue && + queueDetailsData.map((queueEntry) => ( + entry.id === queueEntry.movieId)?.title ?? t("radarr.unknown")} + activity={formatDownloadState(queueEntry.trackedDownloadState)} + key={`${queueEntry.movieId}-${queueEntry.sizeLeft}`} + /> + )) } ); diff --git a/src/widgets/radarr/widget.js b/src/widgets/radarr/widget.js index 8d70192f..3373975e 100644 --- a/src/widgets/radarr/widget.js +++ b/src/widgets/radarr/widget.js @@ -29,7 +29,7 @@ const widget = { timeLeft: entry.timeleft, size: entry.size, sizeLeft: entry.sizeleft, - movieId: entry.movieId, + movieId: entry.movieId ?? entry.id, status: entry.status })).sort((a, b) => { const downloadingA = a.trackedDownloadState === "downloading" diff --git a/src/widgets/sonarr/component.jsx b/src/widgets/sonarr/component.jsx index 0f87b975..27b1ab03 100644 --- a/src/widgets/sonarr/component.jsx +++ b/src/widgets/sonarr/component.jsx @@ -6,7 +6,20 @@ import QueueEntry from "../../components/widgets/queue/queueEntry"; import Container from "components/services/widget/container"; import Block from "components/services/widget/block"; import useWidgetAPI from "utils/proxy/use-widget-api"; -import BlockList from 'components/services/widget/block-list'; + +function getProgress(sizeLeft, size) { + return sizeLeft === 0 ? 100 : (1 - sizeLeft / size) * 100 +} + +function getTitle(queueEntry, seriesData) { + let title = '' + const seriesTitle = seriesData.find((entry) => entry.id === queueEntry.seriesId)?.title; + if (seriesTitle) title += `${seriesTitle}: `; + const { episodeTitle } = queueEntry; + if (episodeTitle) title += episodeTitle; + if (title === '') return null; + return title; +} export default function Component({ service }) { const { t } = useTranslation(); @@ -17,7 +30,6 @@ export default function Component({ service }) { const { data: seriesData, error: seriesError } = useWidgetAPI(widget, "series"); const { data: queueDetailsData, error: queueDetailsError } = useWidgetAPI(widget, "queue/details"); - // information taken from the Sonarr docs: https://sonarr.tv/docs/api/ const formatDownloadState = useCallback((downloadState) => { switch (downloadState) { case "importPending": @@ -34,25 +46,18 @@ export default function Component({ service }) { return ; } - const enableQueue = widget?.enableQueue; - if (!wantedData || !queuedData || !seriesData || !queueDetailsData) { return ( - <> - - - - - - { enableQueue && - - - - } - + + + + + ); } + const enableQueue = widget?.enableQueue && Array.isArray(queueDetailsData) && queueDetailsData.length > 0; + return ( <> @@ -60,21 +65,16 @@ export default function Component({ service }) { - { enableQueue && - - - {Array.isArray(queueDetailsData) ? queueDetailsData.map((queueEntry) => ( - entry.id === queueEntry.seriesId)?.title } • ${ queueEntry.episodeTitle}`} - activity={formatDownloadState(queueEntry.trackedDownloadState)} - key={queueEntry.episodeId} - /> - )) : undefined} - - + {enableQueue && + queueDetailsData.map((queueEntry) => ( + + )) } ); diff --git a/src/widgets/sonarr/widget.js b/src/widgets/sonarr/widget.js index c0fae806..7f658eb1 100644 --- a/src/widgets/sonarr/widget.js +++ b/src/widgets/sonarr/widget.js @@ -34,9 +34,9 @@ const widget = { size: entry.size, sizeLeft: entry.sizeleft, seriesId: entry.seriesId, - episodeTitle: entry.episode?.title, - episodeId: entry.episodeId, - status: entry.status + episodeTitle: entry.episode?.title ?? entry.title, + episodeId: entry.episodeId ?? entry.id, + status: entry.status, })).sort((a, b) => { const downloadingA = a.trackedDownloadState === "downloading" const downloadingB = b.trackedDownloadState === "downloading" diff --git a/tailwind.config.js b/tailwind.config.js index 96c9e641..b981051b 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -29,9 +29,6 @@ module.exports = { '3xl': '1800px', // => @media (min-width: 1800px) { ... } }, - transitionProperty: { - 'height': 'height' - }, }, }, plugins: [tailwindForms, tailwindScrollbars],