diff --git a/public/locales/en/common.json b/public/locales/en/common.json index a3d74aeee..e20e19081 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 138576bc0..000000000 --- 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 0d0625e91..adea45adb 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 0212eaa7e..6ce2f5997 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 8d70192f7..3373975e1 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 0f87b975c..27b1ab034 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 c0fae806d..7f658eb19 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 96c9e6415..b981051b7 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],