From 6f6994a43346fd354c6bb785b68b275e55e20b8f Mon Sep 17 00:00:00 2001
From: schroda <50052685+schroda@users.noreply.github.com>
Date: Mon, 10 Mar 2025 23:08:13 +0100
Subject: [PATCH] Extract "add chapter download" button into component
---
.../buttons/ChapterDownloadButton.tsx | 54 +++++++++++++++++++
.../history/components/ChapterHistoryCard.tsx | 25 +--------
.../updates/components/ChapterUpdateCard.tsx | 25 +--------
3 files changed, 58 insertions(+), 46 deletions(-)
create mode 100644 src/modules/chapter/components/buttons/ChapterDownloadButton.tsx
diff --git a/src/modules/chapter/components/buttons/ChapterDownloadButton.tsx b/src/modules/chapter/components/buttons/ChapterDownloadButton.tsx
new file mode 100644
index 00000000..aa1bdc0b
--- /dev/null
+++ b/src/modules/chapter/components/buttons/ChapterDownloadButton.tsx
@@ -0,0 +1,54 @@
+/*
+ * Copyright (C) Contributors to the Suwayomi project
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+
+import IconButton from '@mui/material/IconButton';
+import { useTranslation } from 'react-i18next';
+import DownloadIcon from '@mui/icons-material/Download';
+import { CustomTooltip } from '@/modules/core/components/CustomTooltip.tsx';
+import { ChapterIdInfo, Chapters } from '@/modules/chapter/services/Chapters.ts';
+import { requestManager } from '@/lib/requests/RequestManager.ts';
+import { makeToast } from '@/modules/core/utils/Toast.ts';
+import { getErrorMessage } from '@/lib/HelperFunctions.ts';
+
+export const ChapterDownloadButton = ({
+ chapterId,
+ isDownloaded,
+}: {
+ chapterId: ChapterIdInfo['id'];
+ isDownloaded: boolean;
+}) => {
+ const { t } = useTranslation();
+ const download = Chapters.useDownloadStatusFromCache(chapterId);
+
+ const downloadChapter = () => {
+ requestManager
+ .addChapterToDownloadQueue(chapterId)
+ .response.catch((e) =>
+ makeToast(t('global.error.label.failed_to_save_changes'), 'error', getErrorMessage(e)),
+ );
+ };
+
+ if (download == null && isDownloaded) {
+ return null;
+ }
+
+ return (
+
+ {
+ e.stopPropagation();
+ e.preventDefault();
+ downloadChapter();
+ }}
+ size="large"
+ >
+
+
+
+ );
+};
diff --git a/src/modules/history/components/ChapterHistoryCard.tsx b/src/modules/history/components/ChapterHistoryCard.tsx
index 29388166..51ad1a48 100644
--- a/src/modules/history/components/ChapterHistoryCard.tsx
+++ b/src/modules/history/components/ChapterHistoryCard.tsx
@@ -6,7 +6,6 @@
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
*/
-import DownloadIcon from '@mui/icons-material/Download';
import Box from '@mui/material/Box';
import CardActionArea from '@mui/material/CardActionArea';
import Card from '@mui/material/Card';
@@ -27,6 +26,7 @@ import { Chapters } from '@/modules/chapter/services/Chapters.ts';
import { epochToDate, timeFormatter } from '@/util/DateHelper.ts';
import { ChapterCardThumbnail } from '@/modules/chapter/components/cards/ChapterCardThumbnail.tsx';
import { ChapterCardMetadata } from '@/modules/chapter/components/cards/ChapterCardMetadata.tsx';
+import { ChapterDownloadButton } from '@/modules/chapter/components/buttons/ChapterDownloadButton.tsx';
export const ChapterHistoryCard = memo(({ chapter }: { chapter: ChapterHistoryListFieldsFragment }) => {
const { manga } = chapter;
@@ -42,14 +42,6 @@ export const ChapterHistoryCard = memo(({ chapter }: { chapter: ChapterHistoryLi
}
};
- const downloadChapter = () => {
- requestManager
- .addChapterToDownloadQueue(chapter.id)
- .response.catch((e) =>
- makeToast(t('global.error.label.failed_to_save_changes'), 'error', getErrorMessage(e)),
- );
- };
-
return (
)}
- {download == null && !chapter.isDownloaded && (
-
- {
- e.stopPropagation();
- e.preventDefault();
- downloadChapter();
- }}
- size="large"
- >
-
-
-
- )}
+
diff --git a/src/modules/updates/components/ChapterUpdateCard.tsx b/src/modules/updates/components/ChapterUpdateCard.tsx
index 658df1cb..2d3f08d2 100644
--- a/src/modules/updates/components/ChapterUpdateCard.tsx
+++ b/src/modules/updates/components/ChapterUpdateCard.tsx
@@ -6,7 +6,6 @@
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
*/
-import DownloadIcon from '@mui/icons-material/Download';
import Box from '@mui/material/Box';
import CardActionArea from '@mui/material/CardActionArea';
import Card from '@mui/material/Card';
@@ -26,6 +25,7 @@ import { getErrorMessage } from '@/lib/HelperFunctions.ts';
import { Chapters } from '@/modules/chapter/services/Chapters.ts';
import { ChapterCardThumbnail } from '@/modules/chapter/components/cards/ChapterCardThumbnail.tsx';
import { ChapterCardMetadata } from '@/modules/chapter/components/cards/ChapterCardMetadata.tsx';
+import { ChapterDownloadButton } from '@/modules/chapter/components/buttons/ChapterDownloadButton.tsx';
export const ChapterUpdateCard = memo(({ chapter }: { chapter: ChapterUpdateListFieldsFragment }) => {
const { manga } = chapter;
@@ -42,14 +42,6 @@ export const ChapterUpdateCard = memo(({ chapter }: { chapter: ChapterUpdateList
}
};
- const downloadChapter = () => {
- requestManager
- .addChapterToDownloadQueue(chapter.id)
- .response.catch((e) =>
- makeToast(t('global.error.label.failed_to_save_changes'), 'error', getErrorMessage(e)),
- );
- };
-
return (
)}
- {download == null && !chapter.isDownloaded && (
-
- {
- e.stopPropagation();
- e.preventDefault();
- downloadChapter();
- }}
- size="large"
- >
-
-
-
- )}
+