IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Grafana-UI: Fixes timezone offset for default timezone when it is different from browser timezone (#46796)

Browse Source
This commit is contained in:
Joao Silva 2022-03-29 12:23:37 +01:00 committed by GitHub
parent 280b1ee828
commit 8e3b5dce76
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 20 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
packages/grafana-ui/src/components/DateTimePickers/TimeZonePicker/TimeZoneOption.tsx
View File

@ -33,16 +33,24 @@ export const WideTimeZoneOption: React.FC<PropsWithChildren<Props>> = (props, re
return null; return null;
} }
const timeZoneInfo = getTimeZoneInfo(data.value, timestamp);
return ( return (
<div className={containerStyles} {...innerProps} aria-label="Select option"> <div className={containerStyles} {...innerProps} aria-label="Select option">
<div className={cx(styles.leftColumn, styles.row)}> <div className={cx(styles.leftColumn, styles.row)}>
<div className={cx(styles.leftColumn, styles.wideRow)}> <div className={cx(styles.leftColumn, styles.wideRow)}>
<TimeZoneTitle title={children} /> <TimeZoneTitle title={children} />
<div className={styles.spacer} /> <div className={styles.spacer} />
<TimeZoneDescription info={getTimeZoneInfo(data.value, timestamp)} /> <TimeZoneDescription info={timeZoneInfo} />
</div> </div>
<div className={styles.rightColumn}> <div className={styles.rightColumn}>
<TimeZoneOffset timeZone={data.value} timestamp={timestamp} className={offsetClassName} /> <TimeZoneOffset
/* Use the timeZoneInfo to pass the correct timeZone name,
as 'Default' has value '' which defaults to browser timezone */
timeZone={timeZoneInfo?.ianaName || data.value}
timestamp={timestamp}
className={offsetClassName}
/>
{isSelected && ( {isSelected && (
<span> <span>
<Icon name="check" /> <Icon name="check" />
@ -65,6 +73,8 @@ export const CompactTimeZoneOption: React.FC<PropsWithChildren<Props>> = (props,
return null; return null;
} }
const timeZoneInfo = getTimeZoneInfo(data.value, timestamp);
return ( return (
<div className={containerStyles} {...innerProps} aria-label="Select option"> <div className={containerStyles} {...innerProps} aria-label="Select option">
<div className={styles.body}> <div className={styles.body}>
@ -82,10 +92,16 @@ export const CompactTimeZoneOption: React.FC<PropsWithChildren<Props>> = (props,
</div> </div>
<div className={styles.row}> <div className={styles.row}>
<div className={styles.leftColumn}> <div className={styles.leftColumn}>
<TimeZoneDescription info={getTimeZoneInfo(data.value, timestamp)} /> <TimeZoneDescription info={timeZoneInfo} />
</div> </div>
<div className={styles.rightColumn}> <div className={styles.rightColumn}>
<TimeZoneOffset timestamp={timestamp} timeZone={data.value} className={offsetClassName} /> <TimeZoneOffset
timestamp={timestamp}
/* Use the timeZoneInfo to pass the correct timeZone name,
as 'Default' has value '' which defaults to browser timezone */
timeZone={timeZoneInfo?.ianaName || data.value}
className={offsetClassName}
/>
</div> </div>
</div> </div>
</div> </div>