import Box from "@mui/material/Box";
import { BaseBox } from "@/components/design-elements";
import type { MonitorStatus } from "@/types/monitor";
import { getStatusPalette, getValuePalette } from "@/utils/MonitorUtils";
import { useTheme } from "@mui/material/styles";
export const ValueTypes = ["positive", "negative", "neutral"] as const;
export type ValueType = (typeof ValueTypes)[number];
export const StatusLabel = ({ status }: { status: MonitorStatus }) => {
const theme = useTheme();
const palette = getStatusPalette(status);
const transformedText =
status.charAt(0).toUpperCase() + status.slice(1).toLowerCase();
return (
{transformedText}
);
};
export const ValueLabel = ({
value,
text,
}: {
value: ValueType;
text: string;
}) => {
const theme = useTheme();
const palette = getValuePalette(value);
const transformedText =
text.charAt(0).toUpperCase() + text.slice(1).toLowerCase();
return (
{transformedText}
);
};