diff --git a/esp/src/src-react/components/Files.tsx b/esp/src/src-react/components/Files.tsx index 08f5f953c34..a2b63bf1967 100644 --- a/esp/src/src-react/components/Files.tsx +++ b/esp/src/src-react/components/Files.tsx @@ -80,6 +80,7 @@ function formatQuery(_filter): { [id: string]: any } { const defaultUIState = { hasSelection: false, + isUTC: false, }; interface FilesProps { @@ -127,6 +128,25 @@ export const Files: React.FunctionComponent = ({ // eslint-disable-next-line react-hooks/exhaustive-deps }, [hasFocus]); + const toggleTimezone = () => { + setUIState((prevState) => ({ ...prevState, isUTC: !prevState.isUTC })); + }; + + React.useEffect(() => { + localStorage.setItem("isUTC", JSON.stringify(uiState.isUTC)); + }, [uiState.isUTC]); + + React.useEffect(() => { + const storedIsUTC = JSON.parse(localStorage.getItem("isUTC")); + if (storedIsUTC !== null) { + setUIState((prevState) => ({ ...prevState, isUTC: storedIsUTC })); + } + }, []); + + const currentTime = React.useCallback(timestamp => { + const date = new Date(timestamp); + return date.toUTCString(); + }, []); // Grid --- const gridStore = React.useMemo(() => { return store ? store : CreateDFUQueryStore(); @@ -216,8 +236,8 @@ export const Files: React.FunctionComponent = ({ MaxSkew: { label: nlsHPCC.MaxSkew, width: 60, formatter: (value, row) => value ? `${Utility.formatDecimal(value / 100)}%` : "" }, - Modified: { label: nlsHPCC.ModifiedUTCGMT }, Accessed: { label: nlsHPCC.LastAccessed }, + Modified: { label: nlsHPCC.ModifiedUTCGMT, formatter: currentTime }, AtRestCost: { label: nlsHPCC.FileCostAtRest, formatter: (cost, row) => { @@ -321,7 +341,14 @@ export const Files: React.FunctionComponent = ({ pushParams(filter); } }, - ], [currentUser, filter, hasFilter, refreshTable, selection, setShowDeleteConfirm, store, total, uiState.hasSelection, viewByScope]); + { key: "divider_6", itemType: ContextualMenuItemType.Divider, onRender: () => }, + { + key: "toggleTimezone", + text: uiState.isUTC ? nlsHPCC.SwitchToLocalTime : nlsHPCC.SwitchToUTCTime, + iconProps: { iconName: uiState.isUTC ? "Globe" : "Clock" }, + onClick: toggleTimezone, + }, + ], [currentUser, filter, hasFilter, refreshTable, selection, setShowDeleteConfirm, store, total, uiState.hasSelection, viewByScope, uiState.isUTC]); // Filter --- const filterFields: Fields = {}; @@ -382,4 +409,4 @@ export const Files: React.FunctionComponent = ({ >} footerStyles={{}} />; -}; +}; \ No newline at end of file diff --git a/esp/src/src/Utility.ts b/esp/src/src/Utility.ts index cc78350ed6d..98f8270e28e 100644 --- a/esp/src/src/Utility.ts +++ b/esp/src/src/Utility.ts @@ -1307,4 +1307,13 @@ export function wuidToTime(wuid: string): string { export function wuidToDateTime(wuid: string): Date { return new Date(`${wuidToDate(wuid)}T${wuidToTime(wuid)}Z`); -} \ No newline at end of file +} +export function convertToLocalTime(dateString) { + const modifiedDate = new Date(dateString); + return modifiedDate.toLocaleString(); + } + + export function convertToUTCTime(dateString) { + const modifiedDate = new Date(dateString); + return modifiedDate.toUTCString(); + } diff --git a/esp/src/src/nls/hpcc.ts b/esp/src/src/nls/hpcc.ts index 0c79a9bcf03..73ce9737835 100644 --- a/esp/src/src/nls/hpcc.ts +++ b/esp/src/src/nls/hpcc.ts @@ -925,6 +925,8 @@ export = { SuspendedReason: "Suspended Reason", Statistics: "Statistics", SVGSource: "SVG Source", + SwitchToLocalTime:"Switch to Local Time", + SwitchToUTCTime:"Switch to UTC Time", SyncSelection: "Sync To Selection", Syntax: "Syntax", SystemServers: "System Servers",