Alerting: Add timepicker and autorefresh picker to Insights (#76045)

Add timepicker and autorefresh picker
2025-02-25 18:55:37 -06:00 · 2023-10-06 09:24:45 -03:00
parent ede0b0ab03
commit 4d1f8f21bf
32 changed files with 93 additions and 200 deletions
--- a/public/app/features/alerting/unified/home/Insights.tsx
+++ b/public/app/features/alerting/unified/home/Insights.tsx
@@ -7,6 +7,8 @@ import {
  SceneFlexItem,
  SceneFlexLayout,
  SceneReactObject,
+  SceneRefreshPicker,
+  SceneTimePicker,
  SceneTimeRange,
  SceneVariableSet,
  VariableValueSelectors,
@@ -79,7 +81,6 @@ export function overrideToFixedColor(key: keyof typeof SERIES_COLORS) {
 export const PANEL_STYLES = { minHeight: 300 };

 const THIS_WEEK_TIME_RANGE = new SceneTimeRange({ from: 'now-1w', to: 'now' });
-const LAST_WEEK_TIME_RANGE = new SceneTimeRange({ from: 'now-2w', to: 'now-1w' });

 export function SectionSubheader({ children }: React.PropsWithChildren) {
  return <div>{children}</div>;
@@ -87,6 +88,8 @@ export function SectionSubheader({ children }: React.PropsWithChildren) {

 export function getInsightsScenes() {
  return new EmbeddedScene({
+    $timeRange: THIS_WEEK_TIME_RANGE,
+    controls: [new SceneTimePicker({}), new SceneRefreshPicker({})],
    body: new SceneFlexLayout({
      direction: 'column',
      children: [
@@ -134,14 +137,14 @@ function getGrafanaManagedScenes() {
          children: [
            new SceneFlexLayout({
              children: [
-                getMostFiredInstancesScene(THIS_WEEK_TIME_RANGE, ashDs, 'Top 10 firing instances this week'),
-                getFiringGrafanaAlertsScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Firing rules'),
-                getPausedGrafanaAlertsScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Paused rules'),
+                getMostFiredInstancesScene(ashDs, 'Top 10 firing instances this week'),
+                getFiringGrafanaAlertsScene(cloudUsageDs, 'Firing rules'),
+                getPausedGrafanaAlertsScene(cloudUsageDs, 'Paused rules'),
              ],
            }),
            new SceneFlexLayout({
              children: [
-                getGrafanaInstancesByStateScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Alert instances by state'),
+                getGrafanaInstancesByStateScene(cloudUsageDs, 'Alert instances by state'),
                new SceneFlexLayout({
                  height: '400px',
                  direction: 'column',
@@ -149,24 +152,14 @@ function getGrafanaManagedScenes() {
                    new SceneFlexLayout({
                      height: '400px',
                      children: [
-                        getInstanceStatByStatusScene(
-                          THIS_WEEK_TIME_RANGE,
-                          cloudUsageDs,
-                          'Alerting instances',
-                          'alerting'
-                        ),
-                        getInstanceStatByStatusScene(
-                          THIS_WEEK_TIME_RANGE,
-                          cloudUsageDs,
-                          'Pending instances',
-                          'pending'
-                        ),
+                        getInstanceStatByStatusScene(cloudUsageDs, 'Alerting instances', 'alerting'),
+                        getInstanceStatByStatusScene(cloudUsageDs, 'Pending instances', 'pending'),
                      ],
                    }),
                    new SceneFlexLayout({
                      children: [
-                        getInstanceStatByStatusScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'No data instances', 'nodata'),
-                        getInstanceStatByStatusScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Error instances', 'error'),
+                        getInstanceStatByStatusScene(cloudUsageDs, 'No data instances', 'nodata'),
+                        getInstanceStatByStatusScene(cloudUsageDs, 'Error instances', 'error'),
                      ],
                    }),
                  ],
@@ -175,26 +168,14 @@ function getGrafanaManagedScenes() {
            }),
            new SceneFlexLayout({
              children: [
-                getGrafanaRulesByEvaluationScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Alert rule evaluation'),
-                getGrafanaRulesByEvaluationPercentageScene(
-                  THIS_WEEK_TIME_RANGE,
-                  cloudUsageDs,
-                  '% of alert rule evaluation'
-                ),
+                getGrafanaRulesByEvaluationScene(cloudUsageDs, 'Alert rule evaluation'),
+                getGrafanaRulesByEvaluationPercentageScene(cloudUsageDs, '% of alert rule evaluation'),
              ],
            }),
            new SceneFlexLayout({
              children: [
-                getGrafanaEvalSuccessVsFailuresScene(
-                  THIS_WEEK_TIME_RANGE,
-                  cloudUsageDs,
-                  'Evaluation success vs failures'
-                ),
-                getGrafanaMissedIterationsScene(
-                  THIS_WEEK_TIME_RANGE,
-                  cloudUsageDs,
-                  'Iterations missed per evaluation group'
-                ),
+                getGrafanaEvalSuccessVsFailuresScene(cloudUsageDs, 'Evaluation success vs failures'),
+                getGrafanaMissedIterationsScene(cloudUsageDs, 'Iterations missed per evaluation group'),
              ],
            }),
          ],
@@ -220,8 +201,8 @@ function getGrafanaAlertmanagerScenes() {
        }),
        new SceneFlexLayout({
          children: [
-            getGrafanaAlertmanagerNotificationsScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Notifications'),
-            getGrafanaAlertmanagerSilencesScene(LAST_WEEK_TIME_RANGE, cloudUsageDs, 'Silences'),
+            getGrafanaAlertmanagerNotificationsScene(cloudUsageDs, 'Notifications'),
+            getGrafanaAlertmanagerSilencesScene(cloudUsageDs, 'Silences'),
          ],
        }),
      ],
@@ -245,14 +226,14 @@ function getCloudScenes() {
        }),
        new SceneFlexLayout({
          children: [
-            getAlertsByStateScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Alerts by state'),
-            getNotificationsScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Notifications'),
+            getAlertsByStateScene(cloudUsageDs, 'Alerts by state'),
+            getNotificationsScene(cloudUsageDs, 'Notifications'),
          ],
        }),
        new SceneFlexLayout({
          children: [
-            getSilencesScene(LAST_WEEK_TIME_RANGE, cloudUsageDs, 'Silences'),
-            getInvalidConfigScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Invalid configuration'),
+            getSilencesScene(cloudUsageDs, 'Silences'),
+            getInvalidConfigScene(cloudUsageDs, 'Invalid configuration'),
          ],
        }),
      ],
@@ -276,25 +257,21 @@ function getMimirManagedRulesScenes() {
        }),
        new SceneFlexLayout({
          children: [
-            getMostFiredRulesScene(THIS_WEEK_TIME_RANGE, grafanaCloudPromDs, 'Top 10 firing rules this week'),
-            getFiringCloudAlertsScene(THIS_WEEK_TIME_RANGE, grafanaCloudPromDs, 'Firing instances'),
-            getPendingCloudAlertsScene(THIS_WEEK_TIME_RANGE, grafanaCloudPromDs, 'Pending instances'),
+            getMostFiredRulesScene(grafanaCloudPromDs, 'Top 10 firing rules this week'),
+            getFiringCloudAlertsScene(grafanaCloudPromDs, 'Firing instances'),
+            getPendingCloudAlertsScene(grafanaCloudPromDs, 'Pending instances'),
          ],
        }),
        new SceneFlexLayout({
          children: [
-            getInstancesByStateScene(THIS_WEEK_TIME_RANGE, grafanaCloudPromDs, 'Count of alert instances by state'),
-            getInstancesPercentageByStateScene(
-              THIS_WEEK_TIME_RANGE,
-              grafanaCloudPromDs,
-              '% of alert instances by State'
-            ),
+            getInstancesByStateScene(grafanaCloudPromDs, 'Count of alert instances by state'),
+            getInstancesPercentageByStateScene(grafanaCloudPromDs, '% of alert instances by State'),
          ],
        }),
        new SceneFlexLayout({
          children: [
-            getEvalSuccessVsFailuresScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Evaluation success vs failures'),
-            getMissedIterationsScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Iterations missed'),
+            getEvalSuccessVsFailuresScene(cloudUsageDs, 'Evaluation success vs failures'),
+            getMissedIterationsScene(cloudUsageDs, 'Iterations missed'),
          ],
        }),
      ],
@@ -325,19 +302,15 @@ function getMimirManagedRulesPerGroupScenes() {
        }),
        new SceneFlexLayout({
          children: [
-            getRuleGroupEvaluationsScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Rule group evaluation'),
-            getRuleGroupIntervalScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Rule group interval'),
+            getRuleGroupEvaluationsScene(cloudUsageDs, 'Rule group evaluation'),
+            getRuleGroupIntervalScene(cloudUsageDs, 'Rule group interval'),
          ],
        }),
        new SceneFlexLayout({
          children: [
-            getRuleGroupEvaluationDurationScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Rule group evaluation duration'),
-            getRulesPerGroupScene(THIS_WEEK_TIME_RANGE, cloudUsageDs, 'Rules per group'),
-            getRuleGroupEvaluationDurationIntervalRatioScene(
-              THIS_WEEK_TIME_RANGE,
-              cloudUsageDs,
-              'Evaluation duration / interval ratio'
-            ),
+            getRuleGroupEvaluationDurationScene(cloudUsageDs, 'Rule group evaluation duration'),
+            getRulesPerGroupScene(cloudUsageDs, 'Rules per group'),
+            getRuleGroupEvaluationDurationIntervalRatioScene(cloudUsageDs, 'Evaluation duration / interval ratio'),
          ],
        }),
      ],
--- a/public/app/features/alerting/unified/insights/grafana/AlertsByStateScene.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/AlertsByStateScene.tsx
@@ -1,16 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { overrideToFixedColor, PANEL_STYLES } from '../../home/Insights';
 import { InsightsRatingModal } from '../RatingModal';

-export function getGrafanaInstancesByStateScene(
-  timeRange: SceneTimeRange,
-  datasource: DataSourceRef,
-  panelTitle: string
-) {
+export function getGrafanaInstancesByStateScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -21,7 +17,6 @@ export function getGrafanaInstancesByStateScene(
        legendFormat: '{{state}}',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/grafana/EvalDurationScene.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/EvalDurationScene.tsx
@@ -1,9 +1,9 @@
-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { overrideToFixedColor, PANEL_STYLES } from '../../home/Insights';

-export function getGrafanaEvalDurationScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getGrafanaEvalDurationScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -20,7 +20,6 @@ export function getGrafanaEvalDurationScene(timeRange: SceneTimeRange, datasourc
        legendFormat: 'failed',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/grafana/EvalSuccessVsFailuresScene.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/EvalSuccessVsFailuresScene.tsx
@@ -1,16 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { overrideToFixedColor, PANEL_STYLES } from '../../home/Insights';
 import { InsightsRatingModal } from '../RatingModal';

-export function getGrafanaEvalSuccessVsFailuresScene(
-  timeRange: SceneTimeRange,
-  datasource: DataSourceRef,
-  panelTitle: string
-) {
+export function getGrafanaEvalSuccessVsFailuresScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -27,7 +23,6 @@ export function getGrafanaEvalSuccessVsFailuresScene(
        legendFormat: 'failed',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/grafana/Firing.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/Firing.tsx
@@ -1,13 +1,13 @@
 import React from 'react';

 import { ThresholdsMode } from '@grafana/data';
-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef } from '@grafana/schema';

 import { PANEL_STYLES } from '../../home/Insights';
 import { InsightsRatingModal } from '../RatingModal';

-export function getFiringGrafanaAlertsScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getFiringGrafanaAlertsScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -17,7 +17,6 @@ export function getFiringGrafanaAlertsScene(timeRange: SceneTimeRange, datasourc
        expr: 'sum by (state) (grafanacloud_grafana_instance_alerting_rule_group_rules{state="active"})',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/grafana/FiringAlertsPercentage.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/FiringAlertsPercentage.tsx
@@ -1,9 +1,9 @@
-import { PanelBuilders, SceneDataTransformer, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneDataTransformer, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef } from '@grafana/schema';

 import { PANEL_STYLES } from '../../home/Insights';

-export function getFiringAlertsScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getFiringAlertsScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -18,7 +18,6 @@ export function getFiringAlertsScene(timeRange: SceneTimeRange, datasource: Data
        expr: 'sum(count_over_time({from="state-history"} | json [1w]))',
      },
    ],
-    $timeRange: timeRange,
  });

  const transformation = new SceneDataTransformer({
--- a/public/app/features/alerting/unified/insights/grafana/FiringAlertsRate.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/FiringAlertsRate.tsx
@@ -1,9 +1,9 @@
-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle } from '@grafana/schema';

 import { PANEL_STYLES } from '../../home/Insights';

-export function getFiringAlertsRateScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getFiringAlertsRateScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -14,7 +14,6 @@ export function getFiringAlertsRateScene(timeRange: SceneTimeRange, datasource:
        legendFormat: 'Number of fires',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/grafana/InstanceStatusScene.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/InstanceStatusScene.tsx
@@ -1,12 +1,11 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef } from '@grafana/schema';

 import { overrideToFixedColor } from '../../home/Insights';
 import { InsightsRatingModal } from '../RatingModal';
 export function getInstanceStatByStatusScene(
-  timeRange: SceneTimeRange,
  datasource: DataSourceRef,
  panelTitle: string,
  status: 'alerting' | 'pending' | 'nodata' | 'normal' | 'error'
@@ -21,7 +20,6 @@ export function getInstanceStatByStatusScene(
        legendFormat: '{{state}}',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/grafana/MissedIterationsScene.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/MissedIterationsScene.tsx
@@ -8,18 +8,13 @@ import {
  SceneDataTransformer,
  SceneFlexItem,
  SceneQueryRunner,
-  SceneTimeRange,
 } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { PANEL_STYLES } from '../../home/Insights';
 import { InsightsRatingModal } from '../RatingModal';

-export function getGrafanaMissedIterationsScene(
-  timeRange: SceneTimeRange,
-  datasource: DataSourceRef,
-  panelTitle: string
-) {
+export function getGrafanaMissedIterationsScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -30,7 +25,6 @@ export function getGrafanaMissedIterationsScene(
        legendFormat: '{{rule_group}}',
      },
    ],
-    $timeRange: timeRange,
  });

  const legendTransformation: CustomTransformOperator = () => (source: Observable<DataFrame[]>) => {
--- a/public/app/features/alerting/unified/insights/grafana/MostFiredInstancesTable.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/MostFiredInstancesTable.tsx
@@ -9,7 +9,6 @@ import {
  SceneDataTransformer,
  SceneFlexItem,
  SceneQueryRunner,
-  SceneTimeRange,
 } from '@grafana/scenes';
 import { DataSourceRef } from '@grafana/schema';
 import { Link, useStyles2 } from '@grafana/ui';
@@ -18,7 +17,7 @@ import { PANEL_STYLES } from '../../home/Insights';
 import { createUrl } from '../../utils/url';
 import { InsightsRatingModal } from '../RatingModal';

-export function getMostFiredInstancesScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getMostFiredInstancesScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -28,8 +27,6 @@ export function getMostFiredInstancesScene(timeRange: SceneTimeRange, datasource
        instant: true,
      },
    ],
-
-    $timeRange: timeRange,
  });

  const createRuleLink = (field: Field<string>, frame: DataFrame) => {
--- a/public/app/features/alerting/unified/insights/grafana/MostFiredRulesTable.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/MostFiredRulesTable.tsx
@@ -1,9 +1,9 @@
-import { PanelBuilders, SceneDataTransformer, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneDataTransformer, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef } from '@grafana/schema';

 import { PANEL_STYLES } from '../../home/Insights';

-export function getMostFiredRulesScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getMostFiredRulesScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -13,7 +13,6 @@ export function getMostFiredRulesScene(timeRange: SceneTimeRange, datasource: Da
        instant: true,
      },
    ],
-    $timeRange: timeRange,
  });

  const transformation = new SceneDataTransformer({
--- a/public/app/features/alerting/unified/insights/grafana/Paused.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/Paused.tsx
@@ -1,13 +1,13 @@
 import React from 'react';

 import { ThresholdsMode } from '@grafana/data';
-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef } from '@grafana/schema';

 import { PANEL_STYLES } from '../../home/Insights';
 import { InsightsRatingModal } from '../RatingModal';

-export function getPausedGrafanaAlertsScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getPausedGrafanaAlertsScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -17,7 +17,6 @@ export function getPausedGrafanaAlertsScene(timeRange: SceneTimeRange, datasourc
        expr: 'sum by (state) (grafanacloud_grafana_instance_alerting_rule_group_rules{state="paused"})',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/grafana/RulesByEvaluation.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/RulesByEvaluation.tsx
@@ -1,16 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { overrideToFixedColor, PANEL_STYLES } from '../../home/Insights';
 import { InsightsRatingModal } from '../RatingModal';

-export function getGrafanaRulesByEvaluationScene(
-  timeRange: SceneTimeRange,
-  datasource: DataSourceRef,
-  panelTitle: string
-) {
+export function getGrafanaRulesByEvaluationScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -21,7 +17,6 @@ export function getGrafanaRulesByEvaluationScene(
        legendFormat: '{{state}} evaluation',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/grafana/RulesByEvaluationPercentage.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/RulesByEvaluationPercentage.tsx
@@ -1,16 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { overrideToFixedColor, PANEL_STYLES } from '../../home/Insights';
 import { InsightsRatingModal } from '../RatingModal';

-export function getGrafanaRulesByEvaluationPercentageScene(
-  timeRange: SceneTimeRange,
-  datasource: DataSourceRef,
-  panelTitle: string
-) {
+export function getGrafanaRulesByEvaluationPercentageScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -21,7 +17,6 @@ export function getGrafanaRulesByEvaluationPercentageScene(
        legendFormat: '{{state}} evaluation',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/grafana/alertmanager/NotificationsScene.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/alertmanager/NotificationsScene.tsx
@@ -1,16 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle } from '@grafana/schema';

 import { overrideToFixedColor, PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getGrafanaAlertmanagerNotificationsScene(
-  timeRange: SceneTimeRange,
-  datasource: DataSourceRef,
-  panelTitle: string
-) {
+export function getGrafanaAlertmanagerNotificationsScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -27,7 +23,6 @@ export function getGrafanaAlertmanagerNotificationsScene(
        legendFormat: 'failed',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/grafana/alertmanager/SilencesByStateScene.tsx
+++ b/public/app/features/alerting/unified/insights/grafana/alertmanager/SilencesByStateScene.tsx
@@ -1,16 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle } from '@grafana/schema';

 import { PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getGrafanaAlertmanagerSilencesScene(
-  timeRange: SceneTimeRange,
-  datasource: DataSourceRef,
-  panelTitle: string
-) {
+export function getGrafanaAlertmanagerSilencesScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -21,7 +17,6 @@ export function getGrafanaAlertmanagerSilencesScene(
        legendFormat: '{{state}}',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/AlertsByState.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/AlertsByState.tsx
@@ -1,12 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { overrideToFixedColor, PANEL_STYLES } from '../../home/Insights';
 import { InsightsRatingModal } from '../RatingModal';

-export function getAlertsByStateScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getAlertsByStateScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -17,7 +17,6 @@ export function getAlertsByStateScene(timeRange: SceneTimeRange, datasource: Dat
        legendFormat: '{{state}}',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/InvalidConfig.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/InvalidConfig.tsx
@@ -1,12 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { BigValueGraphMode, DataSourceRef } from '@grafana/schema';

 import { PANEL_STYLES } from '../../home/Insights';
 import { InsightsRatingModal } from '../RatingModal';

-export function getInvalidConfigScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getInvalidConfigScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -17,7 +17,6 @@ export function getInvalidConfigScene(timeRange: SceneTimeRange, datasource: Dat
        legendFormat: '{{cluster}}',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/Notifications.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/Notifications.tsx
@@ -1,12 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { overrideToFixedColor, PANEL_STYLES } from '../../home/Insights';
 import { InsightsRatingModal } from '../RatingModal';

-export function getNotificationsScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getNotificationsScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -23,7 +23,6 @@ export function getNotificationsScene(timeRange: SceneTimeRange, datasource: Dat
        legendFormat: 'failed',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/Silences.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/Silences.tsx
@@ -1,12 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { PANEL_STYLES } from '../../home/Insights';
 import { InsightsRatingModal } from '../RatingModal';

-export function getSilencesScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getSilencesScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -17,7 +17,6 @@ export function getSilencesScene(timeRange: SceneTimeRange, datasource: DataSour
        legendFormat: '{{state}}',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/perGroup/RuleGroupEvaluationDurationIntervalRatioScene.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/perGroup/RuleGroupEvaluationDurationIntervalRatioScene.tsx
@@ -1,16 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, ThresholdsMode, TooltipDisplayMode } from '@grafana/schema';

 import { PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getRuleGroupEvaluationDurationIntervalRatioScene(
-  timeRange: SceneTimeRange,
-  datasource: DataSourceRef,
-  panelTitle: string
-) {
+export function getRuleGroupEvaluationDurationIntervalRatioScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -21,7 +17,6 @@ export function getRuleGroupEvaluationDurationIntervalRatioScene(
        legendFormat: 'duration / interval',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/perGroup/RuleGroupEvaluationDurationScene.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/perGroup/RuleGroupEvaluationDurationScene.tsx
@@ -1,16 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getRuleGroupEvaluationDurationScene(
-  timeRange: SceneTimeRange,
-  datasource: DataSourceRef,
-  panelTitle: string
-) {
+export function getRuleGroupEvaluationDurationScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -21,7 +17,6 @@ export function getRuleGroupEvaluationDurationScene(
        legendFormat: '{{rule_group}}',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/perGroup/RuleGroupEvaluationsScene.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/perGroup/RuleGroupEvaluationsScene.tsx
@@ -1,12 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { overrideToFixedColor, PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getRuleGroupEvaluationsScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getRuleGroupEvaluationsScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -23,7 +23,6 @@ export function getRuleGroupEvaluationsScene(timeRange: SceneTimeRange, datasour
        legendFormat: 'failed',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/perGroup/RuleGroupIntervalScene.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/perGroup/RuleGroupIntervalScene.tsx
@@ -1,12 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { BigValueGraphMode, DataSourceRef } from '@grafana/schema';

 import { PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getRuleGroupIntervalScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getRuleGroupIntervalScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -17,7 +17,6 @@ export function getRuleGroupIntervalScene(timeRange: SceneTimeRange, datasource:
        legendFormat: 'interval',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/perGroup/RulesPerGroupScene.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/perGroup/RulesPerGroupScene.tsx
@@ -1,12 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { BigValueGraphMode, DataSourceRef } from '@grafana/schema';

 import { PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getRulesPerGroupScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getRulesPerGroupScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -17,7 +17,6 @@ export function getRulesPerGroupScene(timeRange: SceneTimeRange, datasource: Dat
        legendFormat: 'number of rules',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/rules/EvalSuccessVsFailuresScene.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/rules/EvalSuccessVsFailuresScene.tsx
@@ -1,16 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { overrideToFixedColor, PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getEvalSuccessVsFailuresScene(
-  timeRange: SceneTimeRange,
-  datasource: DataSourceRef,
-  panelTitle: string
-) {
+export function getEvalSuccessVsFailuresScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -27,7 +23,6 @@ export function getEvalSuccessVsFailuresScene(
        legendFormat: 'failed',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/rules/Firing.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/rules/Firing.tsx
@@ -1,13 +1,13 @@
 import React from 'react';

 import { ThresholdsMode } from '@grafana/data';
-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef } from '@grafana/schema';

 import { PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getFiringCloudAlertsScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getFiringCloudAlertsScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -17,7 +17,6 @@ export function getFiringCloudAlertsScene(timeRange: SceneTimeRange, datasource:
        expr: 'sum by (alertstate) (ALERTS{alertstate="firing"})',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/rules/InstancesByState.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/rules/InstancesByState.tsx
@@ -1,12 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { overrideToFixedColor, PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getInstancesByStateScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getInstancesByStateScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -17,7 +17,6 @@ export function getInstancesByStateScene(timeRange: SceneTimeRange, datasource:
        legendFormat: '{{state}}',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/rules/InstancesPercentageByState.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/rules/InstancesPercentageByState.tsx
@@ -1,16 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { overrideToFixedColor, PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getInstancesPercentageByStateScene(
-  timeRange: SceneTimeRange,
-  datasource: DataSourceRef,
-  panelTitle: string
-) {
+export function getInstancesPercentageByStateScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -21,7 +17,6 @@ export function getInstancesPercentageByStateScene(
        legendFormat: '{{alertstate}}',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/rules/MissedIterationsScene.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/rules/MissedIterationsScene.tsx
@@ -1,12 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';

 import { overrideToFixedColor, PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getMissedIterationsScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getMissedIterationsScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -17,7 +17,6 @@ export function getMissedIterationsScene(timeRange: SceneTimeRange, datasource:
        legendFormat: 'missed',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({
--- a/public/app/features/alerting/unified/insights/mimir/rules/MostFiredRules.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/rules/MostFiredRules.tsx
@@ -1,12 +1,12 @@
 import React from 'react';

-import { PanelBuilders, SceneDataTransformer, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneDataTransformer, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef } from '@grafana/schema';

 import { PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getMostFiredRulesScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getMostFiredRulesScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -18,8 +18,6 @@ export function getMostFiredRulesScene(timeRange: SceneTimeRange, datasource: Da
        format: 'table',
      },
    ],
-
-    $timeRange: timeRange,
  });

  const transformation = new SceneDataTransformer({
--- a/public/app/features/alerting/unified/insights/mimir/rules/Pending.tsx
+++ b/public/app/features/alerting/unified/insights/mimir/rules/Pending.tsx
@@ -1,13 +1,13 @@
 import React from 'react';

 import { ThresholdsMode } from '@grafana/data';
-import { PanelBuilders, SceneFlexItem, SceneQueryRunner, SceneTimeRange } from '@grafana/scenes';
+import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
 import { DataSourceRef } from '@grafana/schema';

 import { PANEL_STYLES } from '../../../home/Insights';
 import { InsightsRatingModal } from '../../RatingModal';

-export function getPendingCloudAlertsScene(timeRange: SceneTimeRange, datasource: DataSourceRef, panelTitle: string) {
+export function getPendingCloudAlertsScene(datasource: DataSourceRef, panelTitle: string) {
  const query = new SceneQueryRunner({
    datasource,
    queries: [
@@ -17,7 +17,6 @@ export function getPendingCloudAlertsScene(timeRange: SceneTimeRange, datasource
        expr: 'sum by (alertstate) (ALERTS{alertstate="pending"})',
      },
    ],
-    $timeRange: timeRange,
  });

  return new SceneFlexItem({