conditionally render time frame picker

This commit is contained in:
Alex Holliday
2025-01-31 10:06:57 -08:00
parent 00a9630e29
commit 4d8f0b7287
2 changed files with 7 additions and 4 deletions
@@ -3,7 +3,7 @@ import { useTheme } from "@emotion/react";
import { useNavigate } from "react-router-dom";
import SettingsIcon from "../../../assets/icons/settings-bold.svg?react";
import PropTypes from "prop-types";
const ConfigButton = ({ shouldRender, monitorId }) => {
const ConfigButton = ({ shouldRender = true, monitorId, path }) => {
const theme = useTheme();
const navigate = useNavigate();
@@ -14,7 +14,7 @@ const ConfigButton = ({ shouldRender, monitorId }) => {
<Button
variant="contained"
color="secondary"
onClick={() => navigate(`/uptime/configure/${monitorId}`)}
onClick={() => navigate(`/${path}/configure/${monitorId}`)}
sx={{
px: theme.spacing(5),
"& svg": {
@@ -34,7 +34,8 @@ const ConfigButton = ({ shouldRender, monitorId }) => {
ConfigButton.propTypes = {
shouldRender: PropTypes.bool,
monitorId: PropTypes.string,
monitorId: PropTypes.string.isRequired,
path: PropTypes.string.isRequired,
};
export default ConfigButton;
@@ -8,7 +8,7 @@ import ConfigButton from "./ConfigButton";
import SkeletonLayout from "./skeleton";
import PropTypes from "prop-types";
const MonitorStatusHeader = ({ shouldRender = true, isAdmin, monitor }) => {
const MonitorStatusHeader = ({ path, shouldRender = true, isAdmin, monitor }) => {
const theme = useTheme();
const { statusColor, statusMsg, determineState } = useUtils();
if (!shouldRender) {
@@ -38,6 +38,7 @@ const MonitorStatusHeader = ({ shouldRender = true, isAdmin, monitor }) => {
</Stack>
</Stack>
<ConfigButton
path={path}
shouldRender={isAdmin}
monitorId={monitor?._id}
/>
@@ -46,6 +47,7 @@ const MonitorStatusHeader = ({ shouldRender = true, isAdmin, monitor }) => {
};
MonitorStatusHeader.propTypes = {
path: PropTypes.string.isRequired,
shouldRender: PropTypes.bool,
isAdmin: PropTypes.bool,
monitor: PropTypes.object,