[v9.3.x] Solo Panel: Configurable timezone (grafana#59202)

Solo Panel: Configurable timezone (grafana#59153) * Allow to set timezone in query * Use optional timestamp * Update timeZone (cherry picked from commit a0334a9) Co-authored-by: Selene <selenepinillos@gmail.com>
paul-wurth · Feb 8, 2023 · f58d44d · f58d44d
1 parent 5e787ba
commit f58d44d
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 4 deletions.
diff --git a/public/app/features/dashboard/containers/SoloPanelPage.tsx b/public/app/features/dashboard/containers/SoloPanelPage.tsx
@@ -26,7 +26,7 @@ const 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>;
 
 export interface State {
@@ -87,6 +87,7 @@ export class SoloPanelPage extends Component<Props, State> {
         notFound={this.state.notFound}
         panel={this.state.panel}
         panelId={this.getPanelId()}
+        timezone={this.props.queryParams.timezone}
       />
     );
   }
@@ -95,9 +96,10 @@ export class SoloPanelPage extends Component<Props, State> {
 export interface SoloPanelProps extends State {
   dashboard: DashboardModel | null;
   panelId: number;
+  timezone?: string;
 }
 
-export const SoloPanel = ({ dashboard, notFound, panel, panelId }: SoloPanelProps) => {
+export const SoloPanel = ({ dashboard, notFound, panel, panelId, timezone }: SoloPanelProps) => {
   if (notFound) {
     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}
               isViewing={false}
               lazy={false}
+              timezone={timezone}
             />
           );
         }}

diff --git a/public/app/features/dashboard/dashgrid/DashboardPanel.tsx b/public/app/features/dashboard/dashgrid/DashboardPanel.tsx
@@ -20,6 +20,7 @@ export interface OwnProps {
   width: number;
   height: number;
   lazy?: boolean;
+  timezone?: string;
 }
 
 const mapStateToProps = (state: StoreState, props: OwnProps) => {
@@ -70,7 +71,7 @@ export class DashboardPanelUnconnected extends PureComponent<Props> {
   };
 
   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) {
       return null;
@@ -102,6 +103,7 @@ export class DashboardPanelUnconnected extends PureComponent<Props> {
         width={width}
         height={height}
         onInstanceStateChange={this.onInstanceStateChange}
+        timezone={timezone}
       />
     );
   };

diff --git a/public/app/features/dashboard/dashgrid/PanelStateWrapper.tsx b/public/app/features/dashboard/dashgrid/PanelStateWrapper.tsx
@@ -61,6 +61,7 @@ export interface Props {
   width: number;
   height: number;
   onInstanceStateChange: (value: any) => void;
+  timezone?: string;
 }
 
 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
     this.eventFilter.onlyLocal = dashboard.graphTooltip === 0;
 
+    const timeZone = this.props.timezone || this.props.dashboard.getTimezone();
+
     return (
       <>
         <div className={panelContentClassNames}>
@@ -531,7 +534,7 @@ export class PanelStateWrapper extends PureComponent<Props, State> {
                 data={data}
                 title={panel.title}
                 timeRange={timeRange}
-                timeZone={this.props.dashboard.getTimezone()}
+                timeZone={timeZone}
                 options={panelOptions}
                 fieldConfig={panel.fieldConfig}
                 transparent={panel.transparent}