Solo Panel: Configurable timezone (#59153)

* Allow to set timezone in query

* Use optional timestamp

* Update timeZone
This commit is contained in:
Selene 2022-11-23 12:14:35 +01:00 committed by GitHub
parent d7a652ff7f
commit a0334a92f5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 12 additions and 4 deletions

View File

@ -26,7 +26,7 @@ const mapDispatchToProps = {
const connector = connect(mapStateToProps, mapDispatchToProps); const connector = connect(mapStateToProps, mapDispatchToProps);
export type Props = GrafanaRouteComponentProps<DashboardPageRouteParams, { panelId: string }> & export type Props = GrafanaRouteComponentProps<DashboardPageRouteParams, { panelId: string; timezone?: string }> &
ConnectedProps<typeof connector>; ConnectedProps<typeof connector>;
export interface State { export interface State {
@ -87,6 +87,7 @@ export class SoloPanelPage extends Component<Props, State> {
notFound={this.state.notFound} notFound={this.state.notFound}
panel={this.state.panel} panel={this.state.panel}
panelId={this.getPanelId()} panelId={this.getPanelId()}
timezone={this.props.queryParams.timezone}
/> />
); );
} }
@ -95,9 +96,10 @@ export class SoloPanelPage extends Component<Props, State> {
export interface SoloPanelProps extends State { export interface SoloPanelProps extends State {
dashboard: DashboardModel | null; dashboard: DashboardModel | null;
panelId: number; panelId: number;
timezone?: string;
} }
export const SoloPanel = ({ dashboard, notFound, panel, panelId }: SoloPanelProps) => { export const SoloPanel = ({ dashboard, notFound, panel, panelId, timezone }: SoloPanelProps) => {
if (notFound) { if (notFound) {
return <div className="alert alert-error">Panel with id {panelId} not found</div>; return <div className="alert alert-error">Panel with id {panelId} not found</div>;
} }
@ -123,6 +125,7 @@ export const SoloPanel = ({ dashboard, notFound, panel, panelId }: SoloPanelProp
isEditing={false} isEditing={false}
isViewing={false} isViewing={false}
lazy={false} lazy={false}
timezone={timezone}
/> />
); );
}} }}

View File

@ -20,6 +20,7 @@ export interface OwnProps {
width: number; width: number;
height: number; height: number;
lazy?: boolean; lazy?: boolean;
timezone?: string;
} }
const mapStateToProps = (state: StoreState, props: OwnProps) => { const mapStateToProps = (state: StoreState, props: OwnProps) => {
@ -70,7 +71,7 @@ export class DashboardPanelUnconnected extends PureComponent<Props> {
}; };
renderPanel = (isInView: boolean) => { renderPanel = (isInView: boolean) => {
const { dashboard, panel, isViewing, isEditing, width, height, plugin } = this.props; const { dashboard, panel, isViewing, isEditing, width, height, plugin, timezone } = this.props;
if (!plugin) { if (!plugin) {
return null; return null;
@ -102,6 +103,7 @@ export class DashboardPanelUnconnected extends PureComponent<Props> {
width={width} width={width}
height={height} height={height}
onInstanceStateChange={this.onInstanceStateChange} onInstanceStateChange={this.onInstanceStateChange}
timezone={timezone}
/> />
); );
}; };

View File

@ -61,6 +61,7 @@ export interface Props {
width: number; width: number;
height: number; height: number;
onInstanceStateChange: (value: any) => void; onInstanceStateChange: (value: any) => void;
timezone?: string;
} }
export interface State { export interface State {
@ -521,6 +522,8 @@ export class PanelStateWrapper extends PureComponent<Props, State> {
// Yes this is called ever render for a function that is triggered on every mouse move // Yes this is called ever render for a function that is triggered on every mouse move
this.eventFilter.onlyLocal = dashboard.graphTooltip === 0; this.eventFilter.onlyLocal = dashboard.graphTooltip === 0;
const timeZone = this.props.timezone || this.props.dashboard.getTimezone();
return ( return (
<> <>
<div className={panelContentClassNames}> <div className={panelContentClassNames}>
@ -531,7 +534,7 @@ export class PanelStateWrapper extends PureComponent<Props, State> {
data={data} data={data}
title={panel.title} title={panel.title}
timeRange={timeRange} timeRange={timeRange}
timeZone={this.props.dashboard.getTimezone()} timeZone={timeZone}
options={panelOptions} options={panelOptions}
fieldConfig={panel.fieldConfig} fieldConfig={panel.fieldConfig}
transparent={panel.transparent} transparent={panel.transparent}