diff --git a/src/components/CANSelfServe/SelfServe/__snapshots__/index.test.jsx.snap b/src/components/CANSelfServe/SelfServe/__snapshots__/index.test.jsx.snap
index 862780e..7c0453b 100644
--- a/src/components/CANSelfServe/SelfServe/__snapshots__/index.test.jsx.snap
+++ b/src/components/CANSelfServe/SelfServe/__snapshots__/index.test.jsx.snap
@@ -292,6 +292,47 @@ exports[`Render Render 1`] = `
+
{
const [selectedEndDate, setSelectedEndDate] = useState(new Date());
const [selectedCanSignals, setSelectedCanSignals] = useState([]);
const [selectAllCanSignals, setSelectAllCanSignals] = useState(false);
+ const [gmtTimezone, setGmtTimezone] = useState(false);
const {
token: {
@@ -86,6 +87,12 @@ const MainForm = ({ id }) => {
}
};
+ const displayTimeAsGMT = (date) => {
+ return gmtTimezone
+ ? date.toLocaleString("en-US", {timeZone: "Etc/GMT"})
+ : date;
+ }
+
return (
@@ -102,7 +109,7 @@ const MainForm = ({ id }) => {
margin="normal"
id="date-picker-inline"
label="Date From"
- value={selectedStartDate}
+ value={displayTimeAsGMT(selectedStartDate)}
onChange={(value) => handleDateChange(value, "start")}
KeyboardButtonProps={{
'aria-label': 'change date',
@@ -116,7 +123,7 @@ const MainForm = ({ id }) => {
variant="inline"
id="time-picker"
label="Time From"
- value={selectedStartDate}
+ value={displayTimeAsGMT(selectedStartDate)}
onChange={handleTimeFromChange}
KeyboardButtonProps={{
'aria-label': 'change time',
@@ -132,7 +139,7 @@ const MainForm = ({ id }) => {
margin="normal"
id="date-picker-inline"
label="Date To"
- value={selectedEndDate}
+ value={displayTimeAsGMT(selectedEndDate)}
onChange={(value) => handleDateChange(value, "end")}
KeyboardButtonProps={{
'aria-label': 'change date',
@@ -146,13 +153,24 @@ const MainForm = ({ id }) => {
id="time-picker"
variant="inline"
label="Time To"
- value={selectedEndDate}
+ value={displayTimeAsGMT(selectedEndDate)}
onChange={handleTimeToChange}
KeyboardButtonProps={{
'aria-label': 'change time',
}}
/>
+
+ setGmtTimezone((current) => !current)}
+ />
+ }
+ />
+