wake component

master
Tudor Stanciu 2021-04-17 23:31:35 +03:00
parent 5e7aa9bbc7
commit 647daee657
4 changed files with 90 additions and 52 deletions

View File

@ -10,6 +10,7 @@ import {
import { KeyboardArrowDown, KeyboardArrowUp } from "@material-ui/icons"; import { KeyboardArrowDown, KeyboardArrowUp } from "@material-ui/icons";
import { makeStyles } from "@material-ui/core/styles"; import { makeStyles } from "@material-ui/core/styles";
import MachineLog from "./MachineLog"; import MachineLog from "./MachineLog";
import WakeComponent from "./WakeComponent";
const useRowStyles = makeStyles({ const useRowStyles = makeStyles({
root: { root: {
@ -19,7 +20,7 @@ const useRowStyles = makeStyles({
} }
}); });
const Machine = ({ machine, actions, logs }) => { const Machine = ({ machine, actions, logs, addLog }) => {
const [open, setOpen] = React.useState(false); const [open, setOpen] = React.useState(false);
const classes = useRowStyles(); const classes = useRowStyles();
@ -42,25 +43,24 @@ const Machine = ({ machine, actions, logs }) => {
<TableCell>{machine.iPv4Address}</TableCell> <TableCell>{machine.iPv4Address}</TableCell>
<TableCell>{machine.macAddress}</TableCell> <TableCell>{machine.macAddress}</TableCell>
<TableCell align="right"> <TableCell align="right">
<> <WakeComponent machine={machine} addLog={addLog} />
{actions.map(action => ( {actions.map(action => (
<Tooltip <Tooltip
title={action.tooltip} title={action.tooltip}
key={`machine-item-${machine.machineId}-${action.code}-tooltip`} key={`machine-item-${machine.machineId}-${action.code}-tooltip`}
> >
<span> <span>
<IconButton <IconButton
id={`machine-item-${machine.machineId}-${action.code}`} id={`machine-item-${machine.machineId}-${action.code}`}
size={"small"} size={"small"}
disabled={false} disabled={false}
onClick={action.effect(machine)} onClick={action.effect(machine)}
> >
<action.icon /> <action.icon />
</IconButton> </IconButton>
</span> </span>
</Tooltip> </Tooltip>
))} ))}
</>
</TableCell> </TableCell>
</TableRow> </TableRow>
<TableRow> <TableRow>
@ -84,7 +84,8 @@ Machine.propTypes = {
description: PropTypes.string description: PropTypes.string
}).isRequired, }).isRequired,
actions: PropTypes.array.isRequired, actions: PropTypes.array.isRequired,
logs: PropTypes.array.isRequired logs: PropTypes.array.isRequired,
addLog: PropTypes.func.isRequired
}; };
export default Machine; export default Machine;

View File

@ -1,9 +1,9 @@
import React, { useState } from "react"; import React, { useState, useCallback } from "react";
import PropTypes from "prop-types"; import PropTypes from "prop-types";
import Machine from "./Machine"; import Machine from "./Machine";
import * as api from "../api"; import * as api from "../api";
import { useToast } from "../../../hooks"; import { useToast } from "../../../hooks";
import { PowerSettingsNew, LastPage } from "@material-ui/icons"; import { LastPage } from "@material-ui/icons";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
const MachineContainer = ({ machine }) => { const MachineContainer = ({ machine }) => {
@ -15,35 +15,22 @@ const MachineContainer = ({ machine }) => {
setLogs(prev => [...prev, text]); setLogs(prev => [...prev, text]);
}; };
const wakeMachine = machine => async () => { const pingMachine = useCallback(
const result = await api.wakeMachine(machine.macAddress); machine => async () => {
addLog(`Success: ${result.success}. Status: ${result.status}`); const result = await api.pingMachine(
if (result.success) { machine.iPv4Address || machine.machineName
success(result.status); );
} else { addLog(`Success: ${result.success}. Status: ${result.status}`);
error(result.status); if (result.success) {
} success(result.status);
}; } else {
error(result.status);
const pingMachine = machine => async () => { }
const result = await api.pingMachine( },
machine.iPv4Address || machine.machineName [error, success]
); );
addLog(`Success: ${result.success}. Status: ${result.status}`);
if (result.success) {
success(result.status);
} else {
error(result.status);
}
};
const actions = [ const actions = [
{
code: "wake",
effect: wakeMachine,
icon: PowerSettingsNew,
tooltip: t("Machine.Actions.Wake")
},
{ {
code: "ping", code: "ping",
effect: pingMachine, effect: pingMachine,
@ -52,7 +39,9 @@ const MachineContainer = ({ machine }) => {
} }
]; ];
return <Machine machine={machine} actions={actions} logs={logs} />; return (
<Machine machine={machine} actions={actions} logs={logs} addLog={addLog} />
);
}; };
MachineContainer.propTypes = { MachineContainer.propTypes = {

View File

@ -0,0 +1,48 @@
import React from "react";
import PropTypes from "prop-types";
import { IconButton, Tooltip } from "@material-ui/core";
import { PowerSettingsNew } from "@material-ui/icons";
import { useTranslation } from "react-i18next";
import { useToast } from "../../../hooks";
import * as api from "../api";
const WakeComponent = ({ machine, addLog }) => {
const { t } = useTranslation();
const { success, error } = useToast();
const wakeMachine = machine => async () => {
const result = await api.wakeMachine(machine.macAddress);
addLog(`Success: ${result.success}. Status: ${result.status}`);
if (result.success) {
success(result.status);
} else {
error(result.status);
}
};
const handleClick = () => {
alert("AAA");
};
return (
<Tooltip title={t("Machine.Actions.Wake")}>
<span>
<IconButton
id={`machine-${machine.machineId}-wake`}
size={"small"}
disabled={false}
onClick={handleClick}
>
<PowerSettingsNew />
</IconButton>
</span>
</Tooltip>
);
};
WakeComponent.propTypes = {
machine: PropTypes.object.isRequired,
addLog: PropTypes.func.isRequired
};
export default WakeComponent;

View File

@ -1,6 +1,6 @@
import React from "react"; import React from "react";
import MachinesContainer from "../../machines/components/MachinesContainer"; import MachinesContainer from "../../machines/components/MachinesContainer";
import NotesContainer from "../../notes/components/NotesContainer"; //import NotesContainer from "../../notes/components/NotesContainer";
import { makeStyles } from "@material-ui/core/styles"; import { makeStyles } from "@material-ui/core/styles";
import styles from "../styles"; import styles from "../styles";