components/elements/processes/index.tsx

@@ -9,7 +9,7 @@ import CheckCircleOutline from "@mui/icons-material/CheckCircleOutline";
 import ErrorOutline from "@mui/icons-material/ErrorOutline";
 import Replay from "@mui/icons-material/Replay";
 import RunCircle from "@mui/icons-material/RunCircle";
-import {IconButton, LinearProgress, TableContainer, Table, TableBody, TableCell, TableHead, TableRow, TablePagination} from "@mui/material";
+import {IconButton, LinearProgress, Table, TableBody, TableCell, TableHead, TableRow} from "@mui/material";
 
 export interface ProcessExceptionInterface {
     message: string,
@@ -53,30 +53,22 @@ enum Status {
 
 export default function Processes() {
     const [processes, setProcesses] = useState<ProcessInterface[]>([]);
-    const [page, setPage] = useState<number>(0);
-    const [count, setCount] = useState<number>(0);
 
     let refreshProcesses = async () => {
-        let response = await fetch('http://fmw.sipachev.sv/system-monitoring/processes?' + new URLSearchParams({
-            page: page + 1,
-            limit: 20,
-        }),
-            {
+        let response = await fetch('http://fmw.sipachev.sv/system-monitoring/processes', {
             method: 'GET',
             headers: {
-                    'X-Plugin-Token': 'passw0rd',
-                    'X-Pagination-Count': '0',
+                'X-Plugin-Token': 'passw0rd'
             },
         });
         const processes: ProcessInterface[] = await response.json()
         setProcesses(processes)
-        setCount(Number(response.headers.get('X-Pagination-Count')))
         setTimeout(() => refreshProcesses, 1000)
     }
 
     useEffect(() => {
         refreshProcesses()
-    }, [page])
+    }, [])
 
     let isFinished = (process: ProcessInterface) => process.cancelledAt || process.completedAt
     let canPlay = (process: ProcessInterface) => !isFinished(process) && process.progress && process.pausedAt
@@ -102,20 +94,14 @@ export default function Processes() {
         return Status.Wait
     }
 
-    const handleChangePage = (event: any, page: number) => {
-        setPage(page);
-    }
-
     return (
-        <>
-            <TableContainer>
         <Table>
             <TableHead>
                 <TableRow>
                     <TableCell>Name</TableCell>
                     <TableCell>Progress</TableCell>
-                            <TableCell>Status</TableCell>
                     <TableCell>Action</TableCell>
+                    <TableCell>Status</TableCell>
                 </TableRow>
             </TableHead>
             <TableBody>
@@ -123,8 +109,7 @@ export default function Processes() {
                     <TableRow key={process.id}>
                         <TableCell>{process.name}</TableCell>
                         <TableCell>
-                                    {!process.progress && !isFinished(process) && <LinearProgress/>}
-                                    {!process.progress && isFinished(process) && <LinearProgress variant="determinate" value={100}/>}
+                            {!process.progress && <LinearProgress/>}
                             {process.progress && <LinearProgress value={progress(process.progress)}/>}
                             {process.progress && <span>
                                 {`${process.progress.progress}`} / {`${process.progress.total}`} - 50% [53Mb] / 20 sec
@@ -139,6 +124,14 @@ export default function Processes() {
                                 <StopCircle/>
                             </IconButton>}
                         </TableCell>
+                        <TableCell>
+                            {canRepeat(process) && <IconButton title={`Repeat`} aria-label="Repeat">
+                                <Replay/>
+                            </IconButton>}
+                            {canKill(process) && <IconButton title={`Kill`} aria-label="Kill">
+                                <DeleteForever/>
+                            </IconButton>}
+                        </TableCell>
                         <TableCell>
                             {Status.Error === status(process) && <IconButton title={`Error`} aria-label="Error">
                                 <ErrorOutline/>
@@ -156,26 +149,9 @@ export default function Processes() {
                                 <HourglassEmpty/>
                             </IconButton>}
                         </TableCell>
-                                <TableCell>
-                                    {canRepeat(process) && <IconButton title={`Repeat`} aria-label="Repeat">
-                                        <Replay/>
-                                    </IconButton>}
-                                    {canKill(process) && <IconButton title={`Kill`} aria-label="Kill">
-                                        <DeleteForever/>
-                                    </IconButton>}
-                                </TableCell>
                     </TableRow>
                 ))}
             </TableBody>
         </Table>
-            </TableContainer>
-            <TablePagination
-                component="div"
-                count={count}
-                rowsPerPage={20}
-                page={page}
-                onPageChange={handleChangePage}
-            />
-        </>
     )
 }