admin/monitor: pause button

Massimo Melina committed Mar 14, 2022 at 23:56 UTC 8254be50ad93b8fa46a5433bcd80cd1f6b482bab
1 file changed +18 -6
admin/src/MonitorPage.ts
+18 -6
@@ -3,8 +3,8 @@
3 import _ from "lodash"
4 import { isValidElement, createElement as h, useMemo, Fragment, useState } from "react"
5 import { apiCall, useApiComp, useApiList } from "./api"
6 -import { Delete, Lock, Block } from '@mui/icons-material'
7 -import { Box, Chip, Typography } from '@mui/material'
6 +import { PauseCircle, PlayCircle, Delete, Lock, Block } from '@mui/icons-material'
7 +import { Box, Chip } from '@mui/material'
8 import { DataGrid } from "@mui/x-data-grid"
9 import { Alert } from '@mui/material'
10 import { formatBytes, IconBtn, iconTooltip, manipulateConfig } from "./misc"
@@ -64,15 +64,27 @@ function MoreInfo() {
64 function Connections() {
65 const { list, error } = useApiList('get_connections')
66 const [filtered, setFiltered] = useState(true)
67 - const rows = useMemo(()=> list?.filter((x:any) => !filtered || x.path).map((x:any,id:number) => ({ id, ...x })), [list, filtered])
67 + const [paused, setPaused] = useState(false)
68 + const rows = useMemo(()=>
69 + list?.filter((x:any) => !filtered || x.path).map((x:any,id:number) => ({ id, ...x })),
70 + [!paused && list, filtered]) //eslint-disable-line
71 return h(Fragment, {},
69 - h(Box, { display: 'flex', justifyContent: 'space-between', alignItems: 'center' },
70 - h(Box, { fontSize: { xs:'1em', md:'2em' }, px: 2 }, "Active connections"),
72 + h(Box, { display: 'flex', alignItems: 'center' },
73 h(SelectField as Field<boolean>, {
74 fullWidth: false,
75 value: filtered,
76 onChange: setFiltered,
75 - options: { "only downloads": true, "all connections": false }
77 + options: { "Downloads connections": true, "All connections": false }
78 + }),
79 +
80 + h(Box, { flex: 1 }),
81 + h(IconBtn, {
82 + title: "Pause",
83 + icon: paused ? PlayCircle : PauseCircle,
84 + sx: { mr: 1 },
85 + onClick() {
86 + setPaused(!paused)
87 + }
88 }),
89 ),
90 error ? h(Alert, { severity: 'error' }, error) :