Service selection: Replacing datasource resource calls with query run…

…ners (#651) * chore: WIP - replacing index/volume with variable and sceneQueryRunner via runtime datasource
grafana · Aug 2, 2024 · db79bbf · db79bbf
1 parent 42a2392
commit db79bbf
Show file tree

Hide file tree

Showing 19 changed files with 618 additions and 246 deletions.
diff --git a/cspell.config.json b/cspell.config.json
@@ -1,5 +1,5 @@
 {
-  "ignorePaths": ["node_modules", "/project-words.txt", "dist"],
+  "ignorePaths": ["node_modules", "/project-words.txt", "dist", "playwright-report"],
   "ignoreRegExpList": [],
   "words": [],
   "dictionaryDefinitions": [

diff --git a/project-words.txt b/project-words.txt
@@ -465,3 +465,4 @@ logspanel
 inital
 lezer
 logql
+subqueries
diff --git a/provisioning/datasources/default.yaml b/provisioning/datasources/default.yaml
@@ -2,10 +2,10 @@ apiVersion: 1
 
 datasources:
   - name: gdev-testdata
-    isDefault: false
+    isDefault: true
     type: testdata
   - name: gdev-loki
     type: loki
     uid: gdev-loki
     access: proxy
-    url: http://host.docker.internal:3100
+    url: http://host.docker.internal:3100
diff --git a/provisioning/datasources/defaultCopy.yaml b/provisioning/datasources/defaultCopy.yaml
@@ -0,0 +1,11 @@
+apiVersion: 1
+
+datasources:
+  - name: gdev-testdata-copy
+    isDefault: false
+    type: testdata
+  - name: gdev-loki-copy
+    type: loki
+    uid: gdev-loki-copy
+    access: proxy
+    url: http://host.docker.internal:3100
diff --git a/src/Components/ServiceScene/Breakdowns/FieldsBreakdownScene.tsx b/src/Components/ServiceScene/Breakdowns/FieldsBreakdownScene.tsx
@@ -25,7 +25,7 @@ import { Alert, Button, DrawStyle, LoadingPlaceholder, StackingMode, useStyles2
 import { reportAppInteraction, USER_EVENTS_ACTIONS, USER_EVENTS_PAGES } from 'services/analytics';
 import { getFilterBreakdownValueScene } from 'services/fields';
 import { getQueryRunner, setLeverColorOverrides } from 'services/panel';
-import { buildLokiQuery } from 'services/query';
+import { buildDataQuery } from 'services/query';
 import {
   ALL_VARIABLE_VALUE,
   getFieldGroupByVariable,
@@ -283,7 +283,7 @@ export class FieldsBreakdownScene extends SceneObjectBase<FieldsBreakdownSceneSt
         continue;
       }
 
-      const query = buildLokiQuery(getExpr(optionValue), {
+      const query = buildDataQuery(getExpr(optionValue), {
         legendFormat: `{{${optionValue}}}`,
         refId: optionValue,
       });
@@ -340,7 +340,7 @@ export class FieldsBreakdownScene extends SceneObjectBase<FieldsBreakdownSceneSt
 
   buildValuesLayout(variableState: CustomConstantVariableState) {
     const tagKey = String(variableState.value);
-    const query = buildLokiQuery(getExpr(tagKey), { legendFormat: `{{${tagKey}}}` });
+    const query = buildDataQuery(getExpr(tagKey), { legendFormat: `{{${tagKey}}}` });
 
     const { sortBy, direction } = getSortByPreference('fields', ReducerID.stdDev, 'desc');
     const getFilter = () => this.state.search.state.filter ?? '';

diff --git a/src/Components/ServiceScene/Breakdowns/LabelBreakdownScene.tsx b/src/Components/ServiceScene/Breakdowns/LabelBreakdownScene.tsx
@@ -22,7 +22,7 @@ import { Alert, Button, DrawStyle, LoadingPlaceholder, StackingMode, useStyles2
 import { reportAppInteraction, USER_EVENTS_ACTIONS, USER_EVENTS_PAGES } from 'services/analytics';
 import { DetectedLabel, getFilterBreakdownValueScene } from 'services/fields';
 import { getQueryRunner, setLeverColorOverrides } from 'services/panel';
-import { buildLokiQuery } from 'services/query';
+import { buildDataQuery } from 'services/query';
 import { ValueSlugs } from 'services/routing';
 import { getLokiDatasource } from 'services/scenes';
 import { ALL_VARIABLE_VALUE, getLabelGroupByVariable, VAR_LABEL_GROUP_BY, VAR_LABELS } from 'services/variables';
@@ -219,7 +219,7 @@ export class LabelBreakdownScene extends SceneObjectBase<LabelBreakdownSceneStat
             .setTitle(optionValue)
             .setData(
               getQueryRunner(
-                buildLokiQuery(getTimeSeriesExpr(this, optionValue), { legendFormat: `{{${optionValue}}}` })
+                buildDataQuery(getTimeSeriesExpr(this, optionValue), { legendFormat: `{{${optionValue}}}` })
               )
             )
             .setHeaderActions(new SelectLabelAction({ labelName: optionValue }))
@@ -259,7 +259,7 @@ export class LabelBreakdownScene extends SceneObjectBase<LabelBreakdownSceneStat
 
   private buildLabelValuesLayout(variableState: CustomConstantVariableState) {
     const tagKey = String(variableState?.value);
-    const query = buildLokiQuery(getTimeSeriesExpr(this, tagKey), { legendFormat: `{{${tagKey}}}` });
+    const query = buildDataQuery(getTimeSeriesExpr(this, tagKey), { legendFormat: `{{${tagKey}}}` });
 
     let bodyOpts = PanelBuilders.timeseries();
     bodyOpts = bodyOpts

diff --git a/src/Components/ServiceScene/Breakdowns/Patterns/PatternNameLabel.tsx b/src/Components/ServiceScene/Breakdowns/Patterns/PatternNameLabel.tsx
@@ -4,7 +4,7 @@ import { Spinner, Toggletip, useStyles2 } from '@grafana/ui';
 import { getLokiDatasource } from 'services/scenes';
 import { IndexScene } from 'Components/IndexScene/IndexScene';
 import { getLabelsVariable } from 'services/variables';
-import { buildLokiQuery } from 'services/query';
+import { buildDataQuery } from 'services/query';
 import { PatternFieldLabelStats } from './PatternFieldLabelStats';
 import { GrafanaTheme2, LoadingState, LogLabelStatsModel, TimeRange } from '@grafana/data';
 import { reportAppInteraction, USER_EVENTS_ACTIONS, USER_EVENTS_PAGES } from 'services/analytics';
@@ -49,7 +49,7 @@ export const PatternNameLabel = ({ exploration, pattern }: PatternNameLabelProps
         intervalMs: 0,
         scopedVars: {},
         range: currentTimeRange,
-        targets: [buildLokiQuery(query, { maxLines: LINE_LIMIT })],
+        targets: [buildDataQuery(query, { maxLines: LINE_LIMIT })],
         timezone: '',
         app: '',
         startTime: 0,

diff --git a/src/Components/ServiceScene/LogsVolumePanel.tsx b/src/Components/ServiceScene/LogsVolumePanel.tsx
@@ -3,7 +3,7 @@ import React from 'react';
 import { PanelBuilders, SceneComponentProps, SceneObjectBase, SceneObjectState, VizPanel } from '@grafana/scenes';
 import { DrawStyle, LegendDisplayMode, PanelContext, SeriesVisibilityChangeMode, StackingMode } from '@grafana/ui';
 import { getQueryRunner, setLevelSeriesOverrides, setLeverColorOverrides } from 'services/panel';
-import { buildLokiQuery } from 'services/query';
+import { buildDataQuery } from 'services/query';
 import { getAdHocFiltersVariable, getLabelsVariable, LEVEL_VARIABLE_VALUE, VAR_LEVELS } from 'services/variables';
 import { addToFilters, replaceFilter } from './Breakdowns/AddToFiltersButton';
 import { reportAppInteraction, USER_EVENTS_ACTIONS, USER_EVENTS_PAGES } from 'services/analytics';
@@ -48,7 +48,7 @@ export class LogsVolumePanel extends SceneObjectBase<LogsVolumePanelState> {
       .setUnit('short')
       .setData(
         getQueryRunner(
-          buildLokiQuery(getTimeSeriesExpr(this, LEVEL_VARIABLE_VALUE, false), {
+          buildDataQuery(getTimeSeriesExpr(this, LEVEL_VARIABLE_VALUE, false), {
             legendFormat: `{{${LEVEL_VARIABLE_VALUE}}}`,
           })
         )

diff --git a/src/Components/ServiceScene/ServiceScene.tsx b/src/Components/ServiceScene/ServiceScene.tsx
@@ -17,7 +17,7 @@ import { Box, Stack, Tab, TabsBar, useStyles2 } from '@grafana/ui';
 import { reportAppInteraction, USER_EVENTS_ACTIONS, USER_EVENTS_PAGES } from 'services/analytics';
 import { DetectedLabel, DetectedLabelsResponse, updateParserFromDataFrame } from 'services/fields';
 import { getQueryRunner } from 'services/panel';
-import { buildLokiQuery, renderLogQLStreamSelector } from 'services/query';
+import { buildDataQuery, renderLogQLStreamSelector } from 'services/query';
 import { getDrilldownSlug, getDrilldownValueSlug, PageSlugs, PLUGIN_ID, ValueSlugs } from 'services/routing';
 import { getExplorationFor, getLokiDatasource } from 'services/scenes';
 import {
@@ -90,7 +90,7 @@ export class ServiceScene extends SceneObjectBase<ServiceSceneState> {
   public constructor(state: MakeOptional<ServiceSceneState, 'body'>) {
     super({
       body: state.body ?? buildGraphScene(),
-      $data: getQueryRunner(buildLokiQuery(LOG_STREAM_SELECTOR_EXPR)),
+      $data: getQueryRunner(buildDataQuery(LOG_STREAM_SELECTOR_EXPR)),
       loading: true,
       ...state,
     });

diff --git a/src/Components/ServiceSelectionScene/SelectServiceButton.tsx b/src/Components/ServiceSelectionScene/SelectServiceButton.tsx
@@ -13,7 +13,7 @@ import {
 import { Button } from '@grafana/ui';
 import { VariableHide } from '@grafana/schema';
 import { addToFavoriteServicesInStorage } from 'services/store';
-import { getDataSourceVariable, getLabelsVariable } from 'services/variables';
+import { getDataSourceVariable, getLabelsVariable, getServiceSelectionStringVariable } from 'services/variables';
 import { SERVICE_NAME, ServiceSelectionScene } from './ServiceSelectionScene';
 import { reportAppInteraction, USER_EVENTS_ACTIONS, USER_EVENTS_PAGES } from 'services/analytics';
 import { FilterOp } from 'services/filters';
@@ -63,11 +63,9 @@ export function selectService(service: string, sceneRef: SceneObject) {
 
   setParserIfFrameExistsForService(service, sceneRef);
 
-  const serviceSelectionScene = sceneGraph.getAncestor(sceneRef, ServiceSelectionScene);
-  // Setting the service variable state triggers a re-query of the services with invalid queries, so we clear out the body state to avoid triggering queries since
-  serviceSelectionScene.setState({
-    servicesToQuery: undefined,
-  });
+  const serviceSelectionVariable = getServiceSelectionStringVariable(sceneRef);
+  // Reset the service selection search to show all services
+  serviceSelectionVariable.changeValueTo('');
 
   variable.setState({
     filters: [
-Original file line number
+Diff line change
@@ Expand Up / @@ -465,3 +465,4 @@ logspanel @@
     inital
     lezer
     logql
+    subqueries