ChoChoX/suwayomi-material-you-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use gql for "subscriptions"

Browse Source
This commit is contained in:
schroda
2023-10-04 22:34:32 +02:00
parent b79fbcf71d
commit d3e15e9d3b
11 changed files with 136 additions and 205 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
src/screens/DownloadQueue.tsx
View File

@@ -18,31 +18,26 @@ import { DragDropContext, Draggable } from 'react-beautiful-dnd';
import Typography from '@mui/material/Typography';
import { Link } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import { IChapter, IQueue } from '@/typings';
import requestManager from '@/lib/requests/RequestManager.ts';
import StrictModeDroppable from '@/lib/StrictModeDroppable';
import makeToast from '@/components/util/Toast';
import { NavbarToolbar } from '@/components/navbar/DefaultNavBar';
import DownloadStateIndicator from '@/components/molecules/DownloadStateIndicator';
import useSubscription from '@/components/library/useSubscription';
import EmptyView from '@/components/util/EmptyView';
import NavbarContext from '@/components/context/NavbarContext';
const initialQueue = {
status: 'Stopped',
queue: [],
} as IQueue;
import { ChapterType, DownloadType } from '@/lib/graphql/generated/graphql.ts';
const DownloadQueue: React.FC = () => {
const { t } = useTranslation();
const { data: queueState } = useSubscription<IQueue>('downloads');
const { queue, status } = queueState ?? initialQueue;
const { data: downloaderData } = requestManager.useDownloadSubscription();
const queue = (downloaderData?.downloadChanged.queue as DownloadType[]) ?? [];
const status = downloaderData?.downloadChanged.state ?? 'STARTED';
const { setTitle, setAction } = useContext(NavbarContext);
const toggleQueueStatus = () => {
if (status === 'Stopped') {
if (status === 'STOPPED') {
requestManager.startDownloads();
} else {
requestManager.stopDownloads();
@@ -60,8 +55,8 @@ const DownloadQueue: React.FC = () => {
return <EmptyView message={t('download.queue.label.no_downloads')} />;
}
const handleDelete = async (chapter: IChapter) => {
const isRunning = status === 'Started';
const handleDelete = async (chapter: ChapterType) => {
const isRunning = status === 'STARTED';
try {
if (isRunning) {
@@ -91,7 +86,7 @@ const DownloadQueue: React.FC = () => {
<>
<NavbarToolbar>
<IconButton onClick={toggleQueueStatus} size="large">
{status === 'Stopped' ? <PlayArrowIcon /> : <PauseIcon />}
{status === 'STOPPED' ? <PlayArrowIcon /> : <PauseIcon />}
</IconButton>
</NavbarToolbar>
<DragDropContext onDragEnd={onDragEnd}>
@@ -100,8 +95,8 @@ const DownloadQueue: React.FC = () => {
<Box ref={droppableProvided.innerRef} sx={{ pt: 1 }}>
{queue.map((item, index) => (
<Draggable
key={`${item.mangaId}-${item.chapterIndex}`}
draggableId={`${item.mangaId}-${item.chapterIndex}`}
key={`${item.chapter.manga.id}-${item.chapter.sourceOrder}`}
draggableId={`${item.chapter.manga.id}-${item.chapter.sourceOrder}`}
index={index}
>
{(draggableProvided, snapshot) => (
@@ -129,7 +124,7 @@ const DownloadQueue: React.FC = () => {
<DragHandle />
</IconButton>
<Stack sx={{ flex: 1, ml: 1 }} direction="column">
<Typography variant="h6">{item.manga.title}</Typography>
<Typography variant="h6">{item.chapter.manga.title}</Typography>
<Typography variant="caption" display="block" gutterBottom>
{item.chapter.name}
</Typography>