changed components structure

src/features/machines/components/Machine.js

@@ -5,13 +5,13 @@ import {
   TableRow,
   IconButton,
   Collapse,
-  Tooltip,
   Menu
 } from "@material-ui/core";
 import { KeyboardArrowDown, KeyboardArrowUp } from "@material-ui/icons";
 import { makeStyles } from "@material-ui/core/styles";
-import MachineLog from "./MachineLog";
-import WakeComponent from "./WakeComponent";
+import MachineLog from "./common/MachineLog";
+import WakeComponent from "./common/WakeComponent";
+import ActionButton from "./common/ActionButton";
 import { useSensitiveInfo } from "../../../hooks";
 
 const useRowStyles = makeStyles({
@@ -22,38 +22,6 @@ const useRowStyles = makeStyles({
   }
 });
 
-const ActionButton = React.forwardRef((props, _ref) => {
-  const { action, machine } = props;
-  return (
-    <Tooltip
-      id={`machine-item-${machine.machineId}-${action.code}-tooltip`}
-      title={action.tooltip}
-    >
-      <span>
-        <IconButton
-          id={`machine-item-${machine.machineId}-${action.code}`}
-          size={"small"}
-          onClick={action.system ? action.effect : action.effect(machine)}
-        >
-          <action.icon />
-        </IconButton>
-      </span>
-    </Tooltip>
-  );
-});
-
-ActionButton.propTypes = {
-  machine: PropTypes.shape({
-    machineId: PropTypes.number.isRequired
-  }).isRequired,
-  action: PropTypes.shape({
-    code: PropTypes.string.isRequired,
-    tooltip: PropTypes.string.isRequired,
-    system: PropTypes.bool,
-    effect: PropTypes.func.isRequired
-  }).isRequired
-};
-
 const Machine = ({
   machine,
   actions,

src/features/machines/components/common/ActionButton.js

@@ -0,0 +1,37 @@
+import React from "react";
+import PropTypes from "prop-types";
+import { IconButton, Tooltip } from "@material-ui/core";
+
+const ActionButton = React.forwardRef((props, _ref) => {
+  const { action, machine } = props;
+  return (
+    <Tooltip
+      id={`machine-item-${machine.machineId}-${action.code}-tooltip`}
+      title={action.tooltip}
+    >
+      <span>
+        <IconButton
+          id={`machine-item-${machine.machineId}-${action.code}`}
+          size={"small"}
+          onClick={action.system ? action.effect : action.effect(machine)}
+        >
+          <action.icon />
+        </IconButton>
+      </span>
+    </Tooltip>
+  );
+});
+
+ActionButton.propTypes = {
+  machine: PropTypes.shape({
+    machineId: PropTypes.number.isRequired
+  }).isRequired,
+  action: PropTypes.shape({
+    code: PropTypes.string.isRequired,
+    tooltip: PropTypes.string.isRequired,
+    system: PropTypes.bool,
+    effect: PropTypes.func.isRequired
+  }).isRequired
+};
+
+export default ActionButton;

src/features/machines/components/common/WakeComponent.js

@@ -3,9 +3,9 @@ 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 { msToMinAndSec } from "../../../utils/time";
-import useApi from "../../../api";
+import { useToast } from "../../../../hooks";
+import { msToMinAndSec } from "../../../../utils/time";
+import useApi from "../../../../api";
 
 const initialState = { on: false };
 const defaultPingInterval = 1200000; //20 minutes