api/client.ts

@@ -1,4 +0,0 @@
-
-export class Client {
-
-}

components/elements/commands/index.tsx

@@ -1,19 +1,16 @@
 import styles from './styles.module.css'
 import {Table, TableBody, TableCell, TableHead, TableRow, IconButton, Autocomplete, TextField} from "@mui/material";
 import Command, {CommandInterface} from "./elements/command";
-import {useContext, useEffect, useState} from "react";
+import {useEffect, useState} from "react";
 import PlayCircleOutline from '@mui/icons-material/PlayCircleOutline';
-import ConfirmDialog from "../confirm-dialog";
+import { v4 } from "uuid"
-import TabContext from "../../../context/tab";
-import {TabEnum} from "../../../pages";
 
 export default function Commands() {
-    const {setTab} = useContext(TabContext)
     const [commands, setCommands] = useState<CommandInterface[]>([]);
     const [selectedCommand, setSelectedCommand] = useState<CommandInterface|null>(null);
     const [command2data, setCommand2data] = useState<Record<string, any>>({});
     const [value, setValue] = useState<string | null>('');
-    const [open, setOpen] = useState<boolean>(false);
+    let requestId = v4()
 
     let refreshCommands = async () => {
         let response = await fetch('http://fmw.sipachev.sv/system-monitoring/commands', {
@@ -49,7 +46,7 @@ export default function Commands() {
         setCommand2data(temp)
     }
     let lock = false
-    let runCommand = async (dialogId: string) => {
+    let runCommand = async () => {
         if (lock) {
             return
         }
@@ -59,7 +56,7 @@ export default function Commands() {
         lock = true
         let url = `http://fmw.sipachev.sv/system-monitoring/commands/${selectedCommand.name}/run`
         let data = command2data[selectedCommand.name] || {}
-        data['requestId'] = dialogId;
+        data['requestId'] = requestId;
         let response = await fetch(url, {
             method: 'POST',
             headers: {
@@ -69,7 +66,6 @@ export default function Commands() {
             body: JSON.stringify(data)
         });
         lock = false
-        setTab(TabEnum.Processes)
     }
 
     return (
@@ -99,14 +95,13 @@ export default function Commands() {
                     {selectedCommand && <TableRow key={selectedCommand.name}>
                         <TableCell><Command command={selectedCommand} callback={callback} /></TableCell>
                         <TableCell>
-                            <IconButton onClick={() => setOpen(true)} aria-label="run">
+                            <IconButton onClick={runCommand} aria-label="run">
                                 <PlayCircleOutline />
                             </IconButton>
                         </TableCell>
                     </TableRow>}
                 </TableBody>
             </Table>
-            <ConfirmDialog open={open} text={'$$$'} agreeCallback={runCommand} closeCallback={() => setOpen(false)}/>
         </>
     )
 }

components/elements/confirm-dialog/index.tsx

@@ -1,41 +0,0 @@
-import styles from './styles.module.css'
-import Button from '@mui/material/Button';
-import Dialog from '@mui/material/Dialog';
-import DialogActions from '@mui/material/DialogActions';
-import DialogContent from '@mui/material/DialogContent';
-import DialogContentText from '@mui/material/DialogContentText';
-import DialogTitle from '@mui/material/DialogTitle';
-import { v4 } from "uuid"
-
-interface ConfirmDialogInterface {
-    open: boolean
-    closeCallback: any
-    agreeCallback: any
-    text: string
-}
-
-export default function ConfirmDialog({open, agreeCallback, closeCallback, text}: ConfirmDialogInterface) {
-    return (
-        <Dialog
-            open={open}
-            onClose={closeCallback}
-            aria-labelledby="alert-dialog-title"
-            aria-describedby="alert-dialog-description"
-        >
-            <DialogTitle>
-                {"Are you sure?"}
-            </DialogTitle>
-            <DialogContent>
-                <DialogContentText>
-                    {text}
-                </DialogContentText>
-            </DialogContent>
-            <DialogActions>
-                <Button onClick={() => agreeCallback(v4())} autoFocus>
-                    Agree
-                </Button>
-                <Button onClick={closeCallback}>Disagree</Button>
-            </DialogActions>
-        </Dialog>
-    );
-}

components/elements/processes/index.tsx

@@ -10,7 +10,7 @@ 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 ConfirmDialog from "../confirm-dialog";
+import { v4 } from "uuid"
 
 export interface ProcessExceptionInterface {
     message: string,
@@ -56,8 +56,7 @@ export default function Processes() {
     const [processes, setProcesses] = useState<ProcessInterface[]>([]);
     const [page, setPage] = useState<number>(0);
     const [count, setCount] = useState<number>(0);
-    const [open, setOpen] = useState<boolean>(false);
+    let requestId = v4()
-    const [selectedProcess, setSelectedProcess] = useState<ProcessInterface | null>(null);
 
     let refreshLock = false
     let refreshProcesses = async () => {
@@ -81,17 +80,6 @@ export default function Processes() {
         setCount(Number(response.headers.get('X-Pagination-Count')))
         refreshLock = false
     }
-    let output = async (process: string) => {
-        let response = await fetch(`http://fmw.sipachev.sv/system-monitoring/processes/${process}/output`,
-            {
-                method: 'GET',
-                headers: {
-                    'X-Plugin-Token': 'passw0rd',
-                    'X-Pagination-Count': '0',
-                },
-            });
-        const processes: ProcessInterface[] = await response.json()
-    }
 
     useEffect(() => {
         const timer = setInterval(() => refreshProcesses(), 1000)
@@ -126,35 +114,8 @@ export default function Processes() {
         setPage(page);
     }
 
-    const openRepeatDialog = (process: ProcessInterface) => {
+    const repeat = (event: any) => {
-        setSelectedProcess(process)
-        setOpen(true)
-    }
 
-    let lock = false
-    const repeat = async (dialogId: string) => {
-        if (lock) {
-            return
-        }
-        if (!selectedProcess) {
-            return
-        }
-        lock = true
-        let url = `http://fmw.sipachev.sv/system-monitoring/processes/${selectedProcess.id}/repeat`
-        let data = {
-            requestId: dialogId
-        }
-        let response = await fetch(url, {
-            method: 'POST',
-            headers: {
-                'Content-Type': 'application/json;charset=utf-8',
-                'X-Plugin-Token': 'passw0rd'
-            },
-            body: JSON.stringify(data)
-        });
-        lock = false
-        setSelectedProcess(null)
-        setOpen(false)
     }
 
     return (
@@ -195,7 +156,7 @@ export default function Processes() {
                                     {Status.Error === status(process) && <IconButton title={`Error`} aria-label="Error">
                                         <ErrorOutline/>
                                     </IconButton>}
-                                    {Status.Success === status(process) && <IconButton onClick={() => output(process.id)} title={`Success`} aria-label="Success">
+                                    {Status.Success === status(process) && <IconButton title={`Success`} aria-label="Success">
                                         <CheckCircleOutline/>
                                     </IconButton>}
                                     {Status.Running === status(process) && <IconButton title={`Running`} aria-label="Running">
@@ -209,7 +170,7 @@ export default function Processes() {
                                     </IconButton>}
                                 </TableCell>
                                 <TableCell>
-                                    {canRepeat(process) && <IconButton onClick={() => openRepeatDialog(process)} title={`Repeat`} aria-label="Repeat">
+                                    {canRepeat(process) && <IconButton onClick={repeat} title={`Repeat`} aria-label="Repeat">
                                         <Replay/>
                                     </IconButton>}
                                     {canKill(process) && <IconButton title={`Kill`} aria-label="Kill">
@@ -231,10 +192,6 @@ export default function Processes() {
                 page={page}
                 onPageChange={handleChangePage}
             />
-            <ConfirmDialog open={open} text={'!!!'} agreeCallback={repeat} closeCallback={() => {
-                setSelectedProcess(null)
-                setOpen(false)
-            }}/>
         </>
     )
 }

context/tab.ts

@@ -1,10 +0,0 @@
-import React from 'react'
-
-export interface ContextInterface {
-    tab: number,
-    setTab: (number: number) => void,
-}
-
-const Context = React.createContext({} as ContextInterface)
-export const Provider = Context.Provider
-export default Context

pages/index.tsx

@@ -4,15 +4,9 @@ import Processes from "../components/elements/processes";
 import {Tabs, Tab} from '@mui/material';
 import {useState} from "react";
 import Commands from "../components/elements/commands";
-import {Provider as TabProvider} from '../context/tab'
-
-export enum TabEnum {
-    Commands,
-    Processes,
-}
 
 export default function Home() {
-    const [tab, setTab] = useState<TabEnum>(TabEnum.Processes);
+    const [tab, setTab] = useState<number>(0);
     const handleChange = (event: any, tab: number) => setTab(tab)
     return (
         <>
@@ -31,14 +25,11 @@ export default function Home() {
                     allowScrollButtonsMobile
                     aria-label="scrollable force tabs example"
                 >
-                    <Tab value={TabEnum.Commands} label="Commands" />
+                    <Tab label="Commands" />
-                    <Tab value={TabEnum.Processes} label="Processes" />
+                    <Tab label="Processes" />
                 </Tabs>
-                <TabProvider value={{tab, setTab}}>
+                {tab === 0 && <Commands />}
-                    {tab === TabEnum.Commands && <Commands />}
+                {tab === 1 && <Processes />}
-                    {tab === TabEnum.Processes && <Processes />}
-                </TabProvider>
-
             </main>
         </>
     )