@robotical/sensors-dashboard
Version:
A dashboard tool for depicting Marty data by Robotical
78 lines (77 loc) • 3.47 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _stylesModule = _interopRequireDefault(require("./styles.module.css"));
var _material = require("@mui/material");
var _Dropdown = _interopRequireDefault(require("../Dropdown"));
var _fa = require("react-icons/fa");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const GraphControls = /*#__PURE__*/_react.default.memo(_ref => {
let {
onClickPlay,
onClickPause,
onClickStop,
onAutoScrollToggle,
autoScrollEnabled,
onStartOptionChange,
onEndOptionChange,
startSelectedOption,
endSelectedOption,
startOptions,
endOptions,
isTracking
} = _ref;
console.log("rendering controls");
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
className: _stylesModule.default.container,
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
className: _stylesModule.default.startEndRules,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.default, {
rule: "start",
label: "Start when",
onChange: onStartOptionChange,
options: startOptions,
selectedOption: startSelectedOption
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.default, {
rule: "end",
label: "End when",
onChange: onEndOptionChange,
options: endOptions,
selectedOption: endSelectedOption
})]
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
title: "Automatically scroll on the x-axis as new data arrives, keeping the most recent data in view.",
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
className: _stylesModule.default.autoScrollContainer,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
children: "Auto-scroll"
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_fa.FaSort, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Checkbox, {
checked: autoScrollEnabled,
onChange: onAutoScrollToggle
})]
})
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
className: _stylesModule.default.playPauseContainer,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
className: _stylesModule.default.graphControlsSVGContainer,
onClick: onClickPlay,
children: isTracking ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_fa.FaDotCircle, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_fa.FaPlay, {})
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
className: _stylesModule.default.graphControlsSVGContainer,
onClick: onClickPause,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_fa.FaPause, {})
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
className: _stylesModule.default.graphControlsSVGContainer,
onClick: onClickStop,
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_fa.FaStop, {})
})]
})]
});
}, (prevProps, nextProps) => {
return prevProps.autoScrollEnabled === nextProps.autoScrollEnabled && prevProps.startSelectedOption === nextProps.startSelectedOption && prevProps.endSelectedOption === nextProps.endSelectedOption && prevProps.startOptions === nextProps.startOptions && prevProps.endOptions === nextProps.endOptions && prevProps.isTracking === nextProps.isTracking;
});
var _default = exports.default = GraphControls;