From 419545622728db45fe4a83c461d6f0a698a7ff9e Mon Sep 17 00:00:00 2001 From: Tudor Stanciu Date: Fri, 24 Mar 2023 01:30:49 +0200 Subject: [PATCH] removed secondaryActionsMenuProps --- .../machines/components/MachineAccordion.js | 12 +---- .../machines/components/MachineContainer.js | 49 +++--------------- .../machines/components/MachineTableRow.js | 18 ++----- .../components/common/ActionButton.js | 10 ++-- .../components/common/ActionsGroup.js | 51 +++++++++++++------ 5 files changed, 53 insertions(+), 87 deletions(-) diff --git a/src/features/machines/components/MachineAccordion.js b/src/features/machines/components/MachineAccordion.js index 8c3dd11..29ea664 100644 --- a/src/features/machines/components/MachineAccordion.js +++ b/src/features/machines/components/MachineAccordion.js @@ -42,13 +42,7 @@ GridCell.propTypes = { value: PropTypes.string.isRequired }; -const MachineAccordion = ({ - machine, - actions, - logs, - addLog, - secondaryActionsMenuProps -}) => { +const MachineAccordion = ({ machine, actions, logs, addLog }) => { const { t } = useTranslation(); const classes = useStyles(); return ( @@ -78,7 +72,6 @@ const MachineAccordion = ({ machine={machine} actions={actions} addLog={addLog} - secondaryActionsMenuProps={secondaryActionsMenuProps} /> @@ -101,8 +94,7 @@ MachineAccordion.propTypes = { }).isRequired, actions: PropTypes.array.isRequired, logs: PropTypes.array.isRequired, - addLog: PropTypes.func.isRequired, - secondaryActionsMenuProps: PropTypes.object.isRequired + addLog: PropTypes.func.isRequired }; export default MachineAccordion; diff --git a/src/features/machines/components/MachineContainer.js b/src/features/machines/components/MachineContainer.js index c647b73..4674cf4 100644 --- a/src/features/machines/components/MachineContainer.js +++ b/src/features/machines/components/MachineContainer.js @@ -4,20 +4,12 @@ import MachineTableRow from "./MachineTableRow"; import MachineAccordion from "./MachineAccordion"; import { ViewModes } from "./ViewModeSelection"; import { useToast } from "../../../hooks"; -import { - LastPage, - MoreHoriz, - RotateLeft, - Launch, - Stop -} from "@material-ui/icons"; +import { LastPage, RotateLeft, Launch, Stop } from "@material-ui/icons"; import { useTranslation } from "react-i18next"; import useApi from "../../../api"; const MachineContainer = ({ machine, viewMode }) => { const [logs, setLogs] = useState([]); - const [secondaryActionsAnchor, setSecondaryActionsAnchor] = - React.useState(null); const { success, error } = useToast(); const { t } = useTranslation(); @@ -44,7 +36,7 @@ const MachineContainer = ({ machine, viewMode }) => { ); const pingMachine = useCallback( - machine => async () => { + async machine => { await api.pingMachine(machine.machineId, { onCompleted: manageActionResponse }); @@ -52,35 +44,20 @@ const MachineContainer = ({ machine, viewMode }) => { [manageActionResponse, api] ); - const handleOpenSecondaryActions = event => { - setSecondaryActionsAnchor(event.currentTarget); - }; - - const handleCloseSecondaryActions = () => { - setSecondaryActionsAnchor(null); - }; - - const secondaryActionsMenuProps = { - anchor: secondaryActionsAnchor, - onCloseSecondaryActions: handleCloseSecondaryActions - }; - const shutdownMachine = useCallback( - machine => async () => { + async machine => { await api.shutdownMachine(machine.machineId, 0, false, { onCompleted: manageActionResponse }); - handleCloseSecondaryActions(); }, [manageActionResponse, api] ); const restartMachine = useCallback( - machine => async () => { + async machine => { await api.restartMachine(machine.machineId, 0, false, { onCompleted: manageActionResponse }); - handleCloseSecondaryActions(); }, [manageActionResponse, api] ); @@ -91,36 +68,28 @@ const MachineContainer = ({ machine, viewMode }) => { effect: pingMachine, icon: LastPage, tooltip: t("Machine.Actions.Ping"), - top: true - }, - { - code: "more", - effect: handleOpenSecondaryActions, - icon: MoreHoriz, - tooltip: t("Machine.Actions.More"), - top: true, - system: true + main: true }, { code: "shutdown", effect: shutdownMachine, icon: Stop, tooltip: t("Machine.Actions.Shutdown"), - top: false + main: false }, { code: "restart", effect: restartMachine, icon: RotateLeft, tooltip: t("Machine.Actions.Restart"), - top: false + main: false }, { code: "advanced", effect: () => {}, icon: Launch, tooltip: t("Machine.Actions.Advanced"), - top: false + main: false } ]; @@ -132,7 +101,6 @@ const MachineContainer = ({ machine, viewMode }) => { actions={actions} logs={logs} addLog={addLog} - secondaryActionsMenuProps={secondaryActionsMenuProps} /> )} {viewMode === ViewModes.ACCORDION && ( @@ -141,7 +109,6 @@ const MachineContainer = ({ machine, viewMode }) => { actions={actions} logs={logs} addLog={addLog} - secondaryActionsMenuProps={secondaryActionsMenuProps} /> )} diff --git a/src/features/machines/components/MachineTableRow.js b/src/features/machines/components/MachineTableRow.js index ea63f39..2794bee 100644 --- a/src/features/machines/components/MachineTableRow.js +++ b/src/features/machines/components/MachineTableRow.js @@ -15,13 +15,7 @@ const useRowStyles = makeStyles({ } }); -const MachineTableRow = ({ - machine, - actions, - logs, - addLog, - secondaryActionsMenuProps -}) => { +const MachineTableRow = ({ machine, actions, logs, addLog }) => { const [open, setOpen] = React.useState(false); const classes = useRowStyles(); const { mask } = useSensitiveInfo(); @@ -45,12 +39,7 @@ const MachineTableRow = ({ {mask(machine.iPv4Address)} {mask(machine.macAddress)} - + @@ -75,8 +64,7 @@ MachineTableRow.propTypes = { }).isRequired, actions: PropTypes.array.isRequired, logs: PropTypes.array.isRequired, - addLog: PropTypes.func.isRequired, - secondaryActionsMenuProps: PropTypes.object.isRequired + addLog: PropTypes.func.isRequired }; export default MachineTableRow; diff --git a/src/features/machines/components/common/ActionButton.js b/src/features/machines/components/common/ActionButton.js index 8b5f6dc..bf3742e 100644 --- a/src/features/machines/components/common/ActionButton.js +++ b/src/features/machines/components/common/ActionButton.js @@ -3,11 +3,11 @@ import PropTypes from "prop-types"; import { IconButton, Tooltip } from "@material-ui/core"; const ActionButton = React.forwardRef((props, _ref) => { - const { action, machine } = props; + const { action, machine, callback } = props; const id = `machine-item-${machine.machineId}-${action.code}`; const handleActionClick = event => { - if (action.system) action.effect(); - else action.effect(machine); + action.effect(machine, event); + callback && callback(machine); event.stopPropagation(); }; @@ -37,9 +37,9 @@ ActionButton.propTypes = { action: PropTypes.shape({ code: PropTypes.string.isRequired, tooltip: PropTypes.string.isRequired, - system: PropTypes.bool, effect: PropTypes.func.isRequired - }).isRequired + }).isRequired, + callback: PropTypes.func }; export default ActionButton; diff --git a/src/features/machines/components/common/ActionsGroup.js b/src/features/machines/components/common/ActionsGroup.js index 6d820fd..90ad39c 100644 --- a/src/features/machines/components/common/ActionsGroup.js +++ b/src/features/machines/components/common/ActionsGroup.js @@ -1,47 +1,67 @@ -import React, { useMemo } from "react"; +import React, { useMemo, useState } from "react"; import PropTypes from "prop-types"; import WakeComponent from "./WakeComponent"; import ActionButton from "./ActionButton"; import { Menu } from "@material-ui/core"; +import { MoreHoriz } from "@material-ui/icons"; +import { useTranslation } from "react-i18next"; -const ActionsGroup = ({ - machine, - actions, - addLog, - secondaryActionsMenuProps -}) => { - const topActions = useMemo( - () => actions.filter(a => a.top === true), +const ActionsGroup = ({ machine, actions, addLog }) => { + const [menuAnchor, setMenuAnchor] = useState(null); + + const { t } = useTranslation(); + + const mainActions = useMemo( + () => actions.filter(a => a.main === true), [actions] ); const secondaryActions = useMemo( - () => actions.filter(a => a.top === false), + () => actions.filter(a => a.main === false), [actions] ); + const handleMenuOpen = (_, event) => { + setMenuAnchor(event.currentTarget); + }; + + const handleMenuClose = () => { + setMenuAnchor(null); + }; + return ( <> - {topActions.map(action => ( + {mainActions.map(action => ( ))} + + {secondaryActions.map(action => ( ))} @@ -59,8 +79,7 @@ ActionsGroup.propTypes = { description: PropTypes.string }).isRequired, actions: PropTypes.array.isRequired, - addLog: PropTypes.func.isRequired, - secondaryActionsMenuProps: PropTypes.object.isRequired + addLog: PropTypes.func.isRequired }; export default ActionsGroup;