Extract "retry chapter download" button into component

src/modules/chapter/components/buttons/ChapterDownloadRetryButton.tsx

@@ -0,0 +1,49 @@
+/*
+ * 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 Refresh from '@mui/icons-material/Refresh';
+import IconButton from '@mui/material/IconButton';
+import { useTranslation } from 'react-i18next';
+import { DownloadState } from '@/lib/graphql/generated/graphql.ts';
+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 ChapterDownloadRetryButton = ({ chapterId }: { chapterId: ChapterIdInfo['id'] }) => {
+    const { t } = useTranslation();
+    const download = Chapters.useDownloadStatusFromCache(chapterId);
+
+    const handleRetry = async () => {
+        try {
+            await requestManager.addChapterToDownloadQueue(chapterId).response;
+        } catch (e) {
+            makeToast(t('download.queue.error.label.failed_to_retry'), 'error', getErrorMessage(e));
+        }
+    };
+
+    if (download?.state !== DownloadState.Error) {
+        return null;
+    }
+
+    return (
+        <CustomTooltip title={t('global.button.retry')}>
+            <IconButton
+                onClick={(e) => {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    handleRetry();
+                }}
+                size="large"
+            >
+                <Refresh />
+            </IconButton>
+        </CustomTooltip>
+    );
+};