📱 Make the design way more responsive for mobile

This commit is contained in:
ajnart
2022-06-06 15:20:46 +02:00
parent bbb912479b
commit 00928ae709
9 changed files with 177 additions and 35 deletions

View File

@@ -6,6 +6,7 @@ import { NormalizedTorrent } from '@ctrl/shared-torrent';
import { IModule } from '../modules';
import { useConfig } from '../../../tools/state';
import { AddItemShelfButton } from '../../AppShelf/AddAppShelfItem';
import { useSetSafeInterval } from '../../../tools/hooks/useSetSafeInterval';
export const DownloadsModule: IModule = {
title: 'Torrent',
@@ -31,10 +32,10 @@ export default function DownloadComponent() {
const [delugeTorrents, setDelugeTorrents] = useState<NormalizedTorrent[]>([]);
const [qBittorrentTorrents, setqBittorrentTorrents] = useState<NormalizedTorrent[]>([]);
const setSafeInterval = useSetSafeInterval();
useEffect(() => {
if (qBittorrentService) {
setInterval(() => {
setSafeInterval(() => {
axios
.post('/api/modules/downloads?dlclient=qbit', { ...qBittorrentService })
.then((res) => {
@@ -43,7 +44,7 @@ export default function DownloadComponent() {
}, 3000);
}
if (delugeService) {
setInterval(() => {
setSafeInterval(() => {
axios.post('/api/modules/downloads?dlclient=deluge', { ...delugeService }).then((res) => {
setDelugeTorrents(res.data.torrents);
});

View File

@@ -9,6 +9,7 @@ import { useListState } from '@mantine/hooks';
import { AddItemShelfButton } from '../../AppShelf/AddAppShelfItem';
import { useConfig } from '../../../tools/state';
import { IModule } from '../modules';
import { useSetSafeInterval } from '../../../tools/hooks/useSetSafeInterval';
/**
* Format bytes as human-readable text.
@@ -74,9 +75,9 @@ export default function TotalDownloadsComponent() {
const totalDownloadSpeed = torrents.reduce((acc, torrent) => acc + torrent.downloadSpeed, 0);
const totalUploadSpeed = torrents.reduce((acc, torrent) => acc + torrent.uploadSpeed, 0);
const setSafeInterval = useSetSafeInterval();
useEffect(() => {
const interval = setInterval(() => {
setSafeInterval(() => {
// Get the current download speed of qBittorrent.
if (qBittorrentService) {
axios