diff --git a/src/features/machines/components/Machine.js b/src/features/machines/components/Machine.js index 894cf50..282db39 100644 --- a/src/features/machines/components/Machine.js +++ b/src/features/machines/components/Machine.js @@ -10,6 +10,7 @@ import { import { KeyboardArrowDown, KeyboardArrowUp } from "@material-ui/icons"; import { makeStyles } from "@material-ui/core/styles"; import MachineLog from "./MachineLog"; +import WakeComponent from "./WakeComponent"; const useRowStyles = makeStyles({ 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 classes = useRowStyles(); @@ -42,25 +43,24 @@ const Machine = ({ machine, actions, logs }) => { {machine.iPv4Address} {machine.macAddress} - <> - {actions.map(action => ( - - - - - - - - ))} - + + {actions.map(action => ( + + + + + + + + ))} @@ -84,7 +84,8 @@ Machine.propTypes = { description: PropTypes.string }).isRequired, actions: PropTypes.array.isRequired, - logs: PropTypes.array.isRequired + logs: PropTypes.array.isRequired, + addLog: PropTypes.func.isRequired }; export default Machine; diff --git a/src/features/machines/components/MachineContainer.js b/src/features/machines/components/MachineContainer.js index 54e1ff0..b1a4dd7 100644 --- a/src/features/machines/components/MachineContainer.js +++ b/src/features/machines/components/MachineContainer.js @@ -1,9 +1,9 @@ -import React, { useState } from "react"; +import React, { useState, useCallback } from "react"; import PropTypes from "prop-types"; import Machine from "./Machine"; import * as api from "../api"; import { useToast } from "../../../hooks"; -import { PowerSettingsNew, LastPage } from "@material-ui/icons"; +import { LastPage } from "@material-ui/icons"; import { useTranslation } from "react-i18next"; const MachineContainer = ({ machine }) => { @@ -15,35 +15,22 @@ const MachineContainer = ({ machine }) => { setLogs(prev => [...prev, text]); }; - 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 pingMachine = machine => async () => { - const result = await api.pingMachine( - machine.iPv4Address || machine.machineName - ); - addLog(`Success: ${result.success}. Status: ${result.status}`); - if (result.success) { - success(result.status); - } else { - error(result.status); - } - }; + const pingMachine = useCallback( + machine => async () => { + const result = await api.pingMachine( + machine.iPv4Address || machine.machineName + ); + addLog(`Success: ${result.success}. Status: ${result.status}`); + if (result.success) { + success(result.status); + } else { + error(result.status); + } + }, + [error, success] + ); const actions = [ - { - code: "wake", - effect: wakeMachine, - icon: PowerSettingsNew, - tooltip: t("Machine.Actions.Wake") - }, { code: "ping", effect: pingMachine, @@ -52,7 +39,9 @@ const MachineContainer = ({ machine }) => { } ]; - return ; + return ( + + ); }; MachineContainer.propTypes = { diff --git a/src/features/machines/components/WakeComponent.js b/src/features/machines/components/WakeComponent.js new file mode 100644 index 0000000..36726fe --- /dev/null +++ b/src/features/machines/components/WakeComponent.js @@ -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 ( + + + + + + + + ); +}; + +WakeComponent.propTypes = { + machine: PropTypes.object.isRequired, + addLog: PropTypes.func.isRequired +}; + +export default WakeComponent; diff --git a/src/features/network/components/NetworkContainer.js b/src/features/network/components/NetworkContainer.js index fa861b4..925925f 100644 --- a/src/features/network/components/NetworkContainer.js +++ b/src/features/network/components/NetworkContainer.js @@ -1,6 +1,6 @@ import React from "react"; 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 styles from "../styles";