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

Introduce "useAppAction" hook

Browse Source
This commit is contained in:
schroda
2025-05-03 13:24:55 +02:00
parent 3ab70c4802
commit aacdbaaeef
26 changed files with 230 additions and 430 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
src/modules/downloads/screens/DownloadQueue.tsx
View File

@@ -10,7 +10,7 @@ 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, { useLayoutEffect, useMemo, useState } from 'react';
import React, { useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next';
import DeleteSweepIcon from '@mui/icons-material/DeleteSweep';
import { Virtuoso } from 'react-virtuoso';
@@ -26,12 +26,12 @@ import { defaultPromiseErrorHandler } from '@/lib/DefaultPromiseErrorHandler.ts'
import { ChapterDownloadStatus } from '@/modules/chapter/services/Chapters.ts';
import { DownloaderState } from '@/lib/graphql/generated/graphql.ts';
import { getErrorMessage } from '@/lib/HelperFunctions.ts';
import { useNavBarContext } from '@/modules/navigation-bar/contexts/NavbarContext.tsx';
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 '@/modules/downloads/components/DownloadQueueChapterCard.tsx';
import { useAppTitle } from '@/modules/navigation-bar/hooks/useAppTitle.ts';
import { useAppAction } from '@/modules/navigation-bar/hooks/useAppAction.ts';
export const DownloadQueue: React.FC = () => {
const { t } = useTranslation();
@@ -52,8 +52,6 @@ export const DownloadQueue: React.FC = () => {
const status = downloaderData?.state ?? DownloaderState.Started;
const isQueueEmpty = !queue.length;
const { setAction } = useNavBarContext();
const dndItems = useMemo(() => queue.map((download) => download.chapter), [queue]);
const dndSensors = DndKitUtil.useSensorsForDevice();
const [dndActiveDownload, setDndActiveDownload] = useState<ChapterDownloadStatus | null>(null);
@@ -99,30 +97,24 @@ export const DownloadQueue: React.FC = () => {
categoryReorder(queue, oldIndex, newIndex);
};
useLayoutEffect(() => {
setAction(
<>
<CustomTooltip title={t('download.queue.label.delete_all')}>
<IconButton onClick={clearQueue} color="inherit">
<DeleteSweepIcon />
</IconButton>
</CustomTooltip>
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>
</>,
);
return () => {
setAction(null);
};
}, [t, status, isQueueEmpty]);
<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>
</>,
);
// Virtuoso's resize observer can throw this error,
// which is caught by DnD and aborts dragging.