modify date format to ISO standard, remove toTimeStamp method

This commit is contained in:
Alex Holliday
2025-01-01 17:27:12 -08:00
parent e7cf127fde
commit b332bed14e
5 changed files with 11 additions and 39 deletions

View File

@@ -12,12 +12,11 @@ import { Box, Stack, Typography } from "@mui/material";
import { useTheme } from "@emotion/react";
import { useMemo, useState } from "react";
import { useSelector } from "react-redux";
import { formatDateWithTz, toTimeStamp } from "../../../Utils/timeUtils";
import { formatDateWithTz } from "../../../Utils/timeUtils";
import "./index.css";
const CustomToolTip = ({ active, payload, label }) => {
const uiTimezone = useSelector((state) => state.ui.timezone);
const dateFormat = label?.length === 10 ? "YYYY-MM-DD" : "YYYY-MM-DD-HH";
const theme = useTheme();
if (active && payload && payload.length) {
const responseTime = payload[0]?.payload?.originalAvgResponseTime
@@ -42,11 +41,7 @@ const CustomToolTip = ({ active, payload, label }) => {
fontWeight: 500,
}}
>
{formatDateWithTz(
toTimeStamp(label, dateFormat),
"ddd, MMMM D, YYYY, h:mm A",
uiTimezone
)}
{formatDateWithTz(label, "ddd, MMMM D, YYYY, h:mm A", uiTimezone)}
</Typography>
<Box mt={theme.spacing(1)}>
<Box
@@ -112,7 +107,6 @@ const CustomTick = ({ x, y, payload, index }) => {
const theme = useTheme();
const uiTimezone = useSelector((state) => state.ui.timezone);
const dateFormat = payload?.value.length === 10 ? "YYYY-MM-DD" : "YYYY-MM-DD-HH";
// Render nothing for the first tick
if (index === 0) return null;
return (
@@ -124,7 +118,7 @@ const CustomTick = ({ x, y, payload, index }) => {
fontSize={11}
fontWeight={400}
>
{formatDateWithTz(toTimeStamp(payload?.value, dateFormat), "h:mm a", uiTimezone)}
{formatDateWithTz(payload?.value, "h:mm a", uiTimezone)}
</Text>
);
};

View File

@@ -1,10 +1,9 @@
import PropTypes from "prop-types";
import { useSelector } from "react-redux";
import { formatDateWithTz, toTimeStamp } from "../../../../Utils/timeUtils";
import { formatDateWithTz } from "../../../../Utils/timeUtils";
const CustomLabels = ({ x, width, height, firstDataPoint, lastDataPoint, type }) => {
const uiTimezone = useSelector((state) => state.ui.timezone);
const formatString = type === "month" ? "YYYY-MM-DD" : "YYYY-MM-DD-HH";
const dateFormat = type === "day" ? "MMM D, h:mm A" : "MMM D";
return (
@@ -16,11 +15,7 @@ const CustomLabels = ({ x, width, height, firstDataPoint, lastDataPoint, type })
textAnchor="start"
fontSize={11}
>
{formatDateWithTz(
toTimeStamp(firstDataPoint._id, formatString),
dateFormat,
uiTimezone
)}
{formatDateWithTz(firstDataPoint._id, dateFormat, uiTimezone)}
</text>
<text
x={width}
@@ -29,11 +24,7 @@ const CustomLabels = ({ x, width, height, firstDataPoint, lastDataPoint, type })
textAnchor="end"
fontSize={11}
>
{formatDateWithTz(
toTimeStamp(lastDataPoint._id, formatString),
dateFormat,
uiTimezone
)}
{formatDateWithTz(lastDataPoint._id, dateFormat, uiTimezone)}
</text>
</>
);

View File

@@ -24,7 +24,6 @@ import { formatDateWithTz, formatDurationSplit } from "../../../Utils/timeUtils"
import { useIsAdmin } from "../../../Hooks/useIsAdmin";
import IconBox from "../../../Components/IconBox";
import StatBox from "../../../Components/StatBox";
import { toTimeStamp } from "../../../Utils/timeUtils";
import UpBarChart from "./Charts/UpBarChart";
import DownBarChart from "./Charts/DownBarChart";
import ResponseGaugeChart from "./Charts/ResponseGaugeChart";
@@ -320,10 +319,7 @@ const DetailsPage = () => {
color={theme.palette.text.tertiary}
>
{formatDateWithTz(
toTimeStamp(
hoveredUptimeData._id,
dateRange === "month" ? "YYYY-MM-DD" : "YYYY-MM-DD-HH"
),
hoveredUptimeData._id,
dateFormat,
uiTimezone
)}
@@ -380,10 +376,7 @@ const DetailsPage = () => {
color={theme.palette.text.tertiary}
>
{formatDateWithTz(
toTimeStamp(
hoveredIncidentsData._id,
dateRange === "month" ? "YYYY-MM-DD" : "YYYY-MM-DD-HH"
),
hoveredIncidentsData._id,
dateFormat,
uiTimezone
)}

View File

@@ -75,12 +75,6 @@ export const formatDurationSplit = (ms) => {
: { time: 0, format: "seconds" };
};
export const toTimeStamp = (date, format) => {
const dayJsDate = dayjs.utc(date, format);
const timestamp = dayJsDate.valueOf();
return timestamp;
};
export const formatDate = (date, customOptions) => {
const options = {
year: "numeric",

View File

@@ -323,9 +323,9 @@ const getUptimeDetailsById = async (req) => {
const { dateRange, normalize } = req.query;
const dates = getDateRange(dateRange);
const formatLookup = {
day: "%Y-%m-%d-%H",
week: "%Y-%m-%d-%H",
month: "%Y-%m-%d",
day: "%Y-%m-%dT%H:00:00Z",
week: "%Y-%m-%dT%H:00:00Z",
month: "%Y-%m-%dT00:00:00Z",
};
const dateString = formatLookup[dateRange];