Rename folder "modules" to "features"
This commit is contained in:
schroda
184
src/features/downloads/screens/DownloadQueue.tsx
Normal file
184
src/features/downloads/screens/DownloadQueue.tsx
Normal file
@@ -0,0 +1,184 @@
|
||||
/*
|
||||
* 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 PauseIcon from '@mui/icons-material/Pause';
|
||||
import PlayArrowIcon from '@mui/icons-material/PlayArrow';
|
||||
import Box from '@mui/material/Box';
|
||||
import IconButton from '@mui/material/IconButton';
|
||||
import React, { useMemo, useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import DeleteSweepIcon from '@mui/icons-material/DeleteSweep';
|
||||
import { closestCenter, DndContext, DragEndEvent } from '@dnd-kit/core';
|
||||
import { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';
|
||||
import { useWindowEvent } from '@mantine/hooks';
|
||||
import { CustomTooltip } from '@/features/core/components/CustomTooltip.tsx';
|
||||
import { requestManager } from '@/lib/requests/RequestManager.ts';
|
||||
import { makeToast } from '@/features/core/utils/Toast.ts';
|
||||
import { EmptyViewAbsoluteCentered } from '@/features/core/components/feedback/EmptyViewAbsoluteCentered.tsx';
|
||||
import { LoadingPlaceholder } from '@/features/core/components/feedback/LoadingPlaceholder.tsx';
|
||||
import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
|
||||
import { DownloaderState } from '@/lib/graphql/generated/graphql.ts';
|
||||
import { getErrorMessage } from '@/lib/HelperFunctions.ts';
|
||||
import { DndSortableItem } from '@/lib/dnd-kit/DndSortableItem.tsx';
|
||||
import { DndKitUtil } from '@/lib/dnd-kit/DndKitUtil.ts';
|
||||
import { DndOverlayItem } from '@/lib/dnd-kit/DndOverlayItem.tsx';
|
||||
import { DownloadQueueChapterCard } from '@/features/downloads/components/DownloadQueueChapterCard.tsx';
|
||||
import { useAppTitle } from '@/features/navigation-bar/hooks/useAppTitle.ts';
|
||||
import { useAppAction } from '@/features/navigation-bar/hooks/useAppAction.ts';
|
||||
import { ChapterDownloadStatus } from '@/features/chapter/Chapter.types.ts';
|
||||
import { VirtuosoPersisted } from '@/lib/virtuoso/Component/VirtuosoPersisted.tsx';
|
||||
|
||||
export const DownloadQueue: React.FC = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
useAppTitle(t('download.title.queue'));
|
||||
|
||||
const [reorderDownload, { reset: revertReorder }] = requestManager.useReorderChapterInDownloadQueue();
|
||||
|
||||
const {
|
||||
data: downloadStatusData,
|
||||
loading: isLoading,
|
||||
error,
|
||||
refetch,
|
||||
} = requestManager.useGetDownloadStatus({ notifyOnNetworkStatusChange: true });
|
||||
const downloaderData = downloadStatusData?.downloadStatus;
|
||||
|
||||
const queue = downloaderData?.queue ?? [];
|
||||
const status = downloaderData?.state ?? DownloaderState.Started;
|
||||
const isQueueEmpty = !queue.length;
|
||||
|
||||
const dndItems = useMemo(() => queue.map((download) => download.chapter), [queue]);
|
||||
const dndSensors = DndKitUtil.useSensorsForDevice();
|
||||
const [dndActiveDownload, setDndActiveDownload] = useState<ChapterDownloadStatus | null>(null);
|
||||
|
||||
const clearQueue = async () => {
|
||||
try {
|
||||
await requestManager.clearDownloads().response;
|
||||
} catch (e) {
|
||||
makeToast(t('download.queue.error.label.failed_delete_all'), 'error', getErrorMessage(e));
|
||||
}
|
||||
};
|
||||
|
||||
const toggleQueueStatus = () => {
|
||||
if (status === DownloaderState.Stopped) {
|
||||
requestManager.startDownloads();
|
||||
} else {
|
||||
requestManager.stopDownloads();
|
||||
}
|
||||
};
|
||||
|
||||
const categoryReorder = (list: ChapterDownloadStatus[], from: number, to: number) => {
|
||||
if (from === to) {
|
||||
return;
|
||||
}
|
||||
|
||||
reorderDownload({ variables: { input: { chapterId: list[from].chapter.id, to } } }).catch(() => {
|
||||
revertReorder();
|
||||
});
|
||||
};
|
||||
|
||||
const onDragEnd = (event: DragEndEvent) => {
|
||||
const { active, over } = event;
|
||||
|
||||
setDndActiveDownload(null);
|
||||
|
||||
if (!over || active.id === over.id) {
|
||||
return;
|
||||
}
|
||||
|
||||
const oldIndex = queue.findIndex((download) => download.chapter.id === active.id);
|
||||
const newIndex = queue.findIndex((download) => download.chapter.id === over.id);
|
||||
|
||||
categoryReorder(queue, oldIndex, newIndex);
|
||||
};
|
||||
|
||||
useAppAction(
|
||||
<>
|
||||
<CustomTooltip title={t('download.queue.label.delete_all')}>
|
||||
<IconButton onClick={clearQueue} color="inherit">
|
||||
<DeleteSweepIcon />
|
||||
</IconButton>
|
||||
</CustomTooltip>
|
||||
|
||||
<CustomTooltip
|
||||
title={t(status === DownloaderState.Started ? 'global.button.start' : 'global.button.stop')}
|
||||
disabled={isQueueEmpty}
|
||||
>
|
||||
<IconButton onClick={toggleQueueStatus} disabled={isQueueEmpty} color="inherit">
|
||||
{status === DownloaderState.Stopped ? <PlayArrowIcon /> : <PauseIcon />}
|
||||
</IconButton>
|
||||
</CustomTooltip>
|
||||
</>,
|
||||
[status, isQueueEmpty],
|
||||
);
|
||||
|
||||
// Virtuoso's resize observer can throw this error,
|
||||
// which is caught by DnD and aborts dragging.
|
||||
useWindowEvent('error', (e) => {
|
||||
if (
|
||||
e.message === 'ResizeObserver loop completed with undelivered notifications.' ||
|
||||
e.message === 'ResizeObserver loop limit exceeded'
|
||||
) {
|
||||
e.stopImmediatePropagation();
|
||||
}
|
||||
});
|
||||
|
||||
if (isLoading) {
|
||||
return <LoadingPlaceholder />;
|
||||
}
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<EmptyViewAbsoluteCentered
|
||||
message={t('global.error.label.failed_to_load_data')}
|
||||
messageExtra={getErrorMessage(error)}
|
||||
retry={() => refetch().catch(defaultPromiseErrorHandler('DownloadQueue::refetch'))}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
if (isQueueEmpty) {
|
||||
return <EmptyViewAbsoluteCentered message={t('download.queue.label.no_downloads')} />;
|
||||
}
|
||||
|
||||
return (
|
||||
<Box sx={{ pb: 1 }}>
|
||||
<DndContext
|
||||
sensors={dndSensors}
|
||||
collisionDetection={closestCenter}
|
||||
onDragStart={(event) =>
|
||||
setDndActiveDownload(queue.find((download) => download.chapter.id === event.active.id) ?? null)
|
||||
}
|
||||
onDragEnd={onDragEnd}
|
||||
onDragCancel={() => setDndActiveDownload(null)}
|
||||
onDragAbort={() => setDndActiveDownload(null)}
|
||||
>
|
||||
<SortableContext items={dndItems} strategy={verticalListSortingStrategy}>
|
||||
<VirtuosoPersisted
|
||||
persistKey="download-queue"
|
||||
useWindowScroll
|
||||
overscan={window.innerHeight * 0.5}
|
||||
totalCount={queue.length}
|
||||
computeItemKey={(index) => queue[index].chapter.id}
|
||||
itemContent={(index) => (
|
||||
<DndSortableItem
|
||||
id={queue[index].chapter.id}
|
||||
isDragging={queue[index].chapter.id === dndActiveDownload?.chapter.id}
|
||||
>
|
||||
<DownloadQueueChapterCard item={queue[index]} status={status} />
|
||||
</DndSortableItem>
|
||||
)}
|
||||
/>
|
||||
</SortableContext>
|
||||
<DndOverlayItem isActive={!!dndActiveDownload}>
|
||||
<DownloadQueueChapterCard item={dndActiveDownload!} status={status} />
|
||||
</DndOverlayItem>
|
||||
</DndContext>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
247
src/features/downloads/screens/DownloadSettings.tsx
Normal file
247
src/features/downloads/screens/DownloadSettings.tsx
Normal file
@@ -0,0 +1,247 @@
|
||||
/*
|
||||
* 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 { useTranslation } from 'react-i18next';
|
||||
import List from '@mui/material/List';
|
||||
import ListItem from '@mui/material/ListItem';
|
||||
import ListItemText from '@mui/material/ListItemText';
|
||||
import Switch from '@mui/material/Switch';
|
||||
import ListSubheader from '@mui/material/ListSubheader';
|
||||
import { TextSetting } from '@/features/core/components/settings/text/TextSetting.tsx';
|
||||
import { requestManager } from '@/lib/requests/RequestManager.ts';
|
||||
import { DownloadAheadSetting } from '@/features/downloads/components/DownloadAheadSetting.tsx';
|
||||
import {
|
||||
createUpdateMetadataServerSettings,
|
||||
useMetadataServerSettings,
|
||||
} from '@/features/settings/services/ServerSettingsMetadata.ts';
|
||||
import { makeToast } from '@/features/core/utils/Toast.ts';
|
||||
import { DeleteChaptersWhileReadingSetting } from '@/features/downloads/components/DeleteChaptersWhileReadingSetting.tsx';
|
||||
import { CategoriesInclusionSetting } from '@/features/category/components/CategoriesInclusionSetting.tsx';
|
||||
import { NumberSetting } from '@/features/core/components/settings/NumberSetting.tsx';
|
||||
import { LoadingPlaceholder } from '@/features/core/components/feedback/LoadingPlaceholder.tsx';
|
||||
import { EmptyViewAbsoluteCentered } from '@/features/core/components/feedback/EmptyViewAbsoluteCentered.tsx';
|
||||
import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts';
|
||||
import { GetCategoriesSettingsQuery, GetCategoriesSettingsQueryVariables } from '@/lib/graphql/generated/graphql.ts';
|
||||
import { GET_CATEGORIES_SETTINGS } from '@/lib/graphql/queries/CategoryQuery.ts';
|
||||
import { MetadataDownloadSettings } from '@/features/downloads/Downloads.types.ts';
|
||||
import { ServerSettings } from '@/features/settings/Settings.types.ts';
|
||||
import { getErrorMessage } from '@/lib/HelperFunctions.ts';
|
||||
import { useAppTitle } from '@/features/navigation-bar/hooks/useAppTitle.ts';
|
||||
import { DownloadConversionSetting } from '@/features/downloads/components/DownloadConversionSetting.tsx';
|
||||
|
||||
type DownloadSettingsType = Pick<
|
||||
ServerSettings,
|
||||
| 'downloadAsCbz'
|
||||
| 'downloadsPath'
|
||||
| 'autoDownloadNewChapters'
|
||||
| 'autoDownloadNewChaptersLimit'
|
||||
| 'excludeEntryWithUnreadChapters'
|
||||
| 'autoDownloadIgnoreReUploads'
|
||||
| 'downloadConversions'
|
||||
>;
|
||||
|
||||
const extractDownloadSettings = (settings: ServerSettings): DownloadSettingsType => ({
|
||||
downloadAsCbz: settings.downloadAsCbz,
|
||||
downloadsPath: settings.downloadsPath,
|
||||
autoDownloadNewChapters: settings.autoDownloadNewChapters,
|
||||
autoDownloadNewChaptersLimit: settings.autoDownloadNewChaptersLimit,
|
||||
excludeEntryWithUnreadChapters: settings.excludeEntryWithUnreadChapters,
|
||||
autoDownloadIgnoreReUploads: settings.autoDownloadIgnoreReUploads,
|
||||
downloadConversions: settings.downloadConversions,
|
||||
});
|
||||
|
||||
export const DownloadSettings = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
useAppTitle(t('download.title.download'));
|
||||
|
||||
const categories = requestManager.useGetCategories<GetCategoriesSettingsQuery, GetCategoriesSettingsQueryVariables>(
|
||||
GET_CATEGORIES_SETTINGS,
|
||||
);
|
||||
const serverSettings = requestManager.useGetServerSettings({ notifyOnNetworkStatusChange: true });
|
||||
const [mutateSettings] = requestManager.useUpdateServerSettings();
|
||||
const {
|
||||
settings: metadataSettings,
|
||||
loading: areMetadataServerSettingsLoading,
|
||||
request: { error: metadataServerSettingsError, refetch: refetchMetadataServerSettings },
|
||||
} = useMetadataServerSettings();
|
||||
|
||||
const loading = serverSettings.loading || areMetadataServerSettingsLoading || categories.loading;
|
||||
if (loading) {
|
||||
return <LoadingPlaceholder />;
|
||||
}
|
||||
|
||||
const error = serverSettings.error ?? metadataServerSettingsError ?? categories.error;
|
||||
if (error) {
|
||||
return (
|
||||
<EmptyViewAbsoluteCentered
|
||||
message={t('global.error.label.failed_to_load_data')}
|
||||
messageExtra={getErrorMessage(error)}
|
||||
retry={() => {
|
||||
if (serverSettings.error) {
|
||||
serverSettings
|
||||
.refetch()
|
||||
.catch(defaultPromiseErrorHandler('DownloadSettings::refetchServerSettings'));
|
||||
}
|
||||
|
||||
if (metadataServerSettingsError) {
|
||||
refetchMetadataServerSettings().catch(
|
||||
defaultPromiseErrorHandler('refetchMetadataServerSettings::'),
|
||||
);
|
||||
}
|
||||
|
||||
if (categories.error) {
|
||||
categories.refetch().catch(defaultPromiseErrorHandler('LibrarySettings::refetchCategories'));
|
||||
}
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
const downloadSettings = extractDownloadSettings(serverSettings.data!.settings);
|
||||
|
||||
const updateSetting = <Setting extends keyof DownloadSettingsType>(
|
||||
setting: Setting,
|
||||
value: DownloadSettingsType[Setting],
|
||||
): Promise<any> => {
|
||||
const mutation = mutateSettings({ variables: { input: { settings: { [setting]: value } } } });
|
||||
mutation.catch((e) => makeToast(t('global.error.label.failed_to_save_changes'), 'error', getErrorMessage(e)));
|
||||
|
||||
return mutation;
|
||||
};
|
||||
|
||||
const updateMetadataSetting = createUpdateMetadataServerSettings<keyof MetadataDownloadSettings>((e) =>
|
||||
makeToast(t('global.error.label.failed_to_save_changes'), 'error', getErrorMessage(e)),
|
||||
);
|
||||
|
||||
return (
|
||||
<List sx={{ pt: 0 }}>
|
||||
<TextSetting
|
||||
settingName={t('download.settings.download_path.label.title')}
|
||||
dialogDescription={t('download.settings.download_path.label.description')}
|
||||
value={downloadSettings?.downloadsPath}
|
||||
settingDescription={
|
||||
downloadSettings?.downloadsPath.length ? downloadSettings.downloadsPath : t('global.label.default')
|
||||
}
|
||||
handleChange={(path) => updateSetting('downloadsPath', path)}
|
||||
/>
|
||||
<ListItem>
|
||||
<ListItemText primary={t('download.settings.file_type.label.cbz')} />
|
||||
<Switch
|
||||
edge="end"
|
||||
checked={!!downloadSettings?.downloadAsCbz}
|
||||
onChange={(e) => updateSetting('downloadAsCbz', e.target.checked)}
|
||||
/>
|
||||
</ListItem>
|
||||
<DownloadConversionSetting
|
||||
conversions={downloadSettings?.downloadConversions}
|
||||
updateSetting={(conversions) => updateSetting('downloadConversions', conversions)}
|
||||
/>
|
||||
<List
|
||||
subheader={
|
||||
<ListSubheader component="div" id="download-settings-auto-delete-downloads">
|
||||
{t('download.settings.delete_chapters.title')}
|
||||
</ListSubheader>
|
||||
}
|
||||
>
|
||||
<ListItem>
|
||||
<ListItemText primary={t('download.settings.delete_chapters.label.manually_marked_as_read')} />
|
||||
<Switch
|
||||
edge="end"
|
||||
checked={metadataSettings.deleteChaptersManuallyMarkedRead}
|
||||
onChange={(e) => updateMetadataSetting('deleteChaptersManuallyMarkedRead', e.target.checked)}
|
||||
/>
|
||||
</ListItem>
|
||||
<DeleteChaptersWhileReadingSetting
|
||||
chapterToDelete={metadataSettings.deleteChaptersWhileReading}
|
||||
handleChange={(chapterToDelete) =>
|
||||
updateMetadataSetting('deleteChaptersWhileReading', chapterToDelete)
|
||||
}
|
||||
/>
|
||||
<ListItem>
|
||||
<ListItemText primary={t('download.settings.delete_chapters.label.allow_deletion_of_bookmarked')} />
|
||||
<Switch
|
||||
edge="end"
|
||||
checked={metadataSettings.deleteChaptersWithBookmark}
|
||||
onChange={(e) => updateMetadataSetting('deleteChaptersWithBookmark', e.target.checked)}
|
||||
/>
|
||||
</ListItem>
|
||||
</List>
|
||||
<List
|
||||
subheader={
|
||||
<ListSubheader component="div" id="download-settings-auto-download">
|
||||
{t('download.settings.auto_download.title')}
|
||||
</ListSubheader>
|
||||
}
|
||||
>
|
||||
<ListItem>
|
||||
<ListItemText primary={t('download.settings.auto_download.label.new_chapters')} />
|
||||
<Switch
|
||||
edge="end"
|
||||
checked={!!downloadSettings?.autoDownloadNewChapters}
|
||||
onChange={(e) => updateSetting('autoDownloadNewChapters', e.target.checked)}
|
||||
/>
|
||||
</ListItem>
|
||||
<NumberSetting
|
||||
disabled={!downloadSettings?.autoDownloadNewChapters}
|
||||
settingTitle={t('download.settings.auto_download.download_limit.label.title')}
|
||||
dialogDescription={t('download.settings.auto_download.download_limit.label.description')}
|
||||
value={downloadSettings?.autoDownloadNewChaptersLimit ?? 0}
|
||||
settingValue={
|
||||
!downloadSettings.autoDownloadNewChaptersLimit
|
||||
? t('global.label.none')
|
||||
: t('download.settings.download_ahead.label.value', {
|
||||
chapters: downloadSettings.autoDownloadNewChaptersLimit,
|
||||
count: downloadSettings.autoDownloadNewChaptersLimit,
|
||||
})
|
||||
}
|
||||
defaultValue={0}
|
||||
minValue={0}
|
||||
maxValue={20}
|
||||
showSlider
|
||||
valueUnit={t('chapter.title_one')}
|
||||
handleUpdate={(autoDownloadNewChaptersLimit) =>
|
||||
updateSetting('autoDownloadNewChaptersLimit', autoDownloadNewChaptersLimit)
|
||||
}
|
||||
/>
|
||||
<ListItem>
|
||||
<ListItemText primary={t('download.settings.auto_download.label.ignore_with_unread_chapters')} />
|
||||
<Switch
|
||||
edge="end"
|
||||
checked={!!downloadSettings?.excludeEntryWithUnreadChapters}
|
||||
onChange={(e) => updateSetting('excludeEntryWithUnreadChapters', e.target.checked)}
|
||||
disabled={!downloadSettings?.autoDownloadNewChapters}
|
||||
/>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<ListItemText primary={t('download.settings.auto_download.label.ignore_re_uploads')} />
|
||||
<Switch
|
||||
edge="end"
|
||||
checked={!!downloadSettings?.autoDownloadIgnoreReUploads}
|
||||
onChange={(e) => updateSetting('autoDownloadIgnoreReUploads', e.target.checked)}
|
||||
disabled={!downloadSettings?.autoDownloadNewChapters}
|
||||
/>
|
||||
</ListItem>
|
||||
<CategoriesInclusionSetting
|
||||
categories={categories.data!.categories.nodes}
|
||||
includeField="includeInDownload"
|
||||
dialogText={t('download.settings.auto_download.categories.label.include_in_download')}
|
||||
/>
|
||||
</List>
|
||||
<List
|
||||
subheader={
|
||||
<ListSubheader component="div" id="download-settings-download-ahead">
|
||||
{t('download.settings.download_ahead.title')}
|
||||
</ListSubheader>
|
||||
}
|
||||
>
|
||||
<DownloadAheadSetting downloadAheadLimit={metadataSettings.downloadAheadLimit} />
|
||||
</List>
|
||||
</List>
|
||||
);
|
||||
};
|
||||
Reference in New Issue
Block a user