diff --git a/Client/src/Pages/Monitors/Details/PaginationTable/index.jsx b/Client/src/Pages/Monitors/Details/PaginationTable/index.jsx
index d7b91d09b..40b9e93e8 100644
--- a/Client/src/Pages/Monitors/Details/PaginationTable/index.jsx
+++ b/Client/src/Pages/Monitors/Details/PaginationTable/index.jsx
@@ -18,10 +18,13 @@ import { StatusLabel } from "../../../../Components/Label";
import ArrowBackRoundedIcon from "@mui/icons-material/ArrowBackRounded";
import ArrowForwardRoundedIcon from "@mui/icons-material/ArrowForwardRounded";
import { logger } from "../../../../Utils/Logger";
-import { useTheme } from "@emotion/react";
+import dayjs from "dayjs";
+import utc from "dayjs/plugin/utc";
+import timezone from "dayjs/plugin/timezone";
+dayjs.extend(utc);
+dayjs.extend(timezone);
const PaginationTable = ({ monitorId, dateRange }) => {
- const theme = useTheme();
const { authToken } = useSelector((state) => state.auth);
const [checks, setChecks] = useState([]);
const [checksCount, setChecksCount] = useState(0);
@@ -29,6 +32,7 @@ const PaginationTable = ({ monitorId, dateRange }) => {
page: 0,
rowsPerPage: 5,
});
+ const uiTimezone = useSelector((state) => state.ui.timezone);
useEffect(() => {
setPaginationController((prevPaginationController) => ({
@@ -119,7 +123,9 @@ const PaginationTable = ({ monitorId, dateRange }) => {
/>
- {new Date(check.createdAt).toLocaleString()}
+ {dayjs(check.createdAt)
+ .tz(uiTimezone)
+ .format("ddd, MMMM D, YYYY, HH:mm A")}
{check.statusCode ? check.statusCode : "N/A"}
diff --git a/Client/src/Pages/Settings/index.jsx b/Client/src/Pages/Settings/index.jsx
index cd00f440f..a9f11f072 100644
--- a/Client/src/Pages/Settings/index.jsx
+++ b/Client/src/Pages/Settings/index.jsx
@@ -14,14 +14,18 @@ import {
} from "../../Features/UptimeMonitors/uptimeMonitorsSlice";
import PropTypes from "prop-types";
import LoadingButton from "@mui/lab/LoadingButton";
+import { setTimezone } from "../../Features/UI/uiSlice";
+import timezones from "../../Utils/timezones.json";
+
const Settings = ({ isAdmin }) => {
const theme = useTheme();
const { user, authToken } = useSelector((state) => state.auth);
const { isLoading } = useSelector((state) => state.uptimeMonitors);
+ const { timezone } = useSelector((state) => state.ui);
const dispatch = useDispatch();
-
// TODO Handle saving
+ const handleSave = async () => {};
const handleClearStats = async () => {
try {
@@ -115,25 +119,16 @@ const Settings = ({ isAdmin }) => {
Display timezone- The
timezone of the dashboard you publicly display.
-
- Server timezone- The
- timezone of your server.
-
@@ -232,6 +227,7 @@ const Settings = ({ isAdmin }) => {
variant="contained"
color="primary"
sx={{ px: theme.spacing(12), mt: theme.spacing(20) }}
+ onClick={handleSave}
>
Save