Compare commits

..

No commits in common. 'a52b9a24cf8effe1ba42288dd8ede35aa21cc0d8' and '92865fcb0a99e3b15cc77cbe012eae5bc4715832' have entirely different histories.

  1. 4
      api/client.ts
  2. 17
      components/elements/commands/index.tsx
  3. 41
      components/elements/confirm-dialog/index.tsx
  4. 0
      components/elements/confirm-dialog/styles.module.css
  5. 53
      components/elements/processes/index.tsx
  6. 10
      context/tab.ts
  7. 19
      pages/index.tsx

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

@ -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 TabContext from "../../../context/tab";
import {TabEnum} from "../../../pages";
import { v4 } from "uuid"
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)}/>
</>
)
}

@ -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>
);
}

@ -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);
const [selectedProcess, setSelectedProcess] = useState<ProcessInterface | null>(null);
let requestId = v4()
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) => {
setSelectedProcess(process)
setOpen(true)
}
const repeat = (event: any) => {
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)
}}/>
</>
)
}

@ -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

@ -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 value={TabEnum.Processes} label="Processes" />
<Tab label="Commands" />
<Tab label="Processes" />
</Tabs>
<TabProvider value={{tab, setTab}}>
{tab === TabEnum.Commands && <Commands />}
{tab === TabEnum.Processes && <Processes />}
</TabProvider>
{tab === 0 && <Commands />}
{tab === 1 && <Processes />}
</main>
</>
)

Loading…
Cancel
Save