@grafana/scenes 6.1.2--canary.1060.13501815546.0 → 6.1.2--canary.990.13540617999.0

package/dist/index.js

@@ -3228,7 +3228,7 @@ class GroupByVariable extends MultiValueVariable {
     this.isLazy = true;
     this._urlSync = new GroupByVariableUrlSyncHandler(this);
     this._getKeys = async (ds) => {
-      var _a, _b, _c;
+      var _a, _b, _c, _d;
       const override = await ((_b = (_a = this.state).getTagKeysProvider) == null ? void 0 : _b.call(_a, this, null));
       if (override && override.replace) {
         return override.values;
@@ -3245,7 +3245,8 @@ class GroupByVariable extends MultiValueVariable {
       const response = await ds.getTagKeys(__spreadValues$F({
         filters: otherFilters,
         queries,
-        timeRange
+        timeRange,
+        scopes: (_d = this._scopesBridge) == null ? void 0 : _d.getValue()
       }, getEnrichedFiltersRequest(this)));
       if (responseHasError(response)) {
         this.setState({ error: response.error.message });
@@ -5104,7 +5105,6 @@ var __spreadValues$A = (a, b) => {
   return a;
 };
 var __spreadProps$o = (a, b) => __defProps$o(a, __getOwnPropDescs$o(b));
-const LABEL_MAX_VISIBLE_LENGTH = 20;
 function AdHocFilterPill({ filter, model, readOnly, focusOnWipInputRef }) {
   var _a, _b, _c;
   const styles = ui.useStyles2(getStyles$b);
@@ -5117,13 +5117,13 @@ function AdHocFilterPill({ filter, model, readOnly, focusOnWipInputRef }) {
   const handleChangeViewMode = React.useCallback(
     (event, shouldFocusOnPillWrapperOverride) => {
       event == null ? void 0 : event.stopPropagation();
-      if (readOnly || filter.source) {
+      if (readOnly) {
         return;
       }
       setShouldFocusOnPillWrapper(shouldFocusOnPillWrapperOverride != null ? shouldFocusOnPillWrapperOverride : !viewMode);
       setViewMode(!viewMode);
     },
-    [readOnly, viewMode, filter.source]
+    [readOnly, viewMode]
   );
   React.useEffect(() => {
     var _a2;
@@ -5148,7 +5148,7 @@ function AdHocFilterPill({ filter, model, readOnly, focusOnWipInputRef }) {
       className: styles.pillText
     }, keyLabel, " ", filter.operator, " ", valueLabel);
     return /* @__PURE__ */ React__default["default"].createElement("div", {
-      className: css.cx(styles.combinedFilterPill, readOnly && styles.readOnlyCombinedFilter),
+      className: css.cx(styles.combinedFilterPill, { [styles.readOnlyCombinedFilter]: readOnly }),
       onClick: (e) => {
         e.stopPropagation();
         setPopulateInputOnEdit(true);
@@ -5164,12 +5164,12 @@ function AdHocFilterPill({ filter, model, readOnly, focusOnWipInputRef }) {
       "aria-label": `Edit filter with key ${keyLabel}`,
       tabIndex: 0,
       ref: pillWrapperRef
-    }, valueLabel.length < LABEL_MAX_VISIBLE_LENGTH ? pillText : /* @__PURE__ */ React__default["default"].createElement(ui.Tooltip, {
+    }, valueLabel.length < 20 ? pillText : /* @__PURE__ */ React__default["default"].createElement(ui.Tooltip, {
       content: /* @__PURE__ */ React__default["default"].createElement("div", {
         className: styles.tooltipText
       }, valueLabel),
       placement: "top"
-    }, pillText), !readOnly && !filter.source ? /* @__PURE__ */ React__default["default"].createElement(ui.IconButton, {
+    }, pillText), !readOnly ? /* @__PURE__ */ React__default["default"].createElement(ui.IconButton, {
       onClick: (e) => {
         e.stopPropagation();
         model._removeFilter(filter);
@@ -5185,14 +5185,9 @@ function AdHocFilterPill({ filter, model, readOnly, focusOnWipInputRef }) {
       },
       name: "times",
       size: "md",
-      className: styles.pillIcon,
+      className: styles.removeButton,
       tooltip: `Remove filter with key ${keyLabel}`
-    }) : null, filter.source && /* @__PURE__ */ React__default["default"].createElement(ui.IconButton, {
-      name: "info-circle",
-      size: "md",
-      className: styles.pillIcon,
-      tooltip: `This is a ${filter.source} injected filter`
-    }));
+    }) : null);
   }
   return /* @__PURE__ */ React__default["default"].createElement(AdHocCombobox, {
     filter,
@@ -5228,7 +5223,7 @@ const getStyles$b = (theme) => ({
       background: theme.colors.action.selected
     }
   }),
-  pillIcon: css.css({
+  removeButton: css.css({
     marginInline: theme.spacing(0.5),
     cursor: "pointer",
     "&:hover": {
@@ -5262,7 +5257,7 @@ const AdHocFiltersAlwaysWipCombobox = React.forwardRef(function AdHocFiltersAlwa
 });
 
 const AdHocFiltersComboboxRenderer = React.memo(function AdHocFiltersComboboxRenderer2({ model }) {
-  const { baseFilters, filters, readOnly } = model.useState();
+  const { filters, readOnly } = model.useState();
   const styles = ui.useStyles2(getStyles$a);
   const focusOnWipInputRef = React.useRef();
   return /* @__PURE__ */ React__default["default"].createElement("div", {
@@ -5275,14 +5270,7 @@ const AdHocFiltersComboboxRenderer = React.memo(function AdHocFiltersComboboxRen
     name: "filter",
     className: styles.filterIcon,
     size: "lg"
-  }), baseFilters == null ? void 0 : baseFilters.map(
-    (filter, index) => filter.source ? /* @__PURE__ */ React__default["default"].createElement(AdHocFilterPill, {
-      key: `${index}-${filter.key}`,
-      filter,
-      model,
-      focusOnWipInputRef: focusOnWipInputRef.current
-    }) : null
-  ), filters.map((filter, index) => /* @__PURE__ */ React__default["default"].createElement(AdHocFilterPill, {
+  }), filters.map((filter, index) => /* @__PURE__ */ React__default["default"].createElement(AdHocFilterPill, {
     key: `${index}-${filter.key}`,
     filter,
     model,
@@ -5344,11 +5332,6 @@ var __spreadValues$z = (a, b) => {
   return a;
 };
 var __spreadProps$n = (a, b) => __defProps$n(a, __getOwnPropDescs$n(b));
-var FilterSource = /* @__PURE__ */ ((FilterSource2) => {
-  FilterSource2["Scopes"] = "scopes";
-  FilterSource2["Dashboards"] = "dashboards";
-  return FilterSource2;
-})(FilterSource || {});
 const OPERATORS = [
   {
     value: "=",
@@ -5401,9 +5384,13 @@ class AdHocFiltersVariable extends SceneObjectBase {
     this._scopedVars = { __sceneObject: wrapInSafeSerializableSceneObject(this) };
     this._dataSourceSrv = runtime.getDataSourceSrv();
     this._urlSync = new AdHocFiltersVariableUrlSyncHandler(this);
+    this._activationHandler = () => {
+      this._scopesBridge = sceneGraph.getScopesBridge(this);
+    };
     if (this.state.applyMode === "auto") {
       patchGetAdhocFilters(this);
     }
+    this.addActivationHandler(this._activationHandler);
   }
   setState(update) {
     let filterExpressionChanged = false;
@@ -5487,7 +5474,7 @@ class AdHocFiltersVariable extends SceneObjectBase {
     }
   }
   async _getKeys(currentKey) {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     const override = await ((_b = (_a = this.state).getTagKeysProvider) == null ? void 0 : _b.call(_a, this, currentKey));
     if (override && override.replace) {
       return dataFromResponse(override.values).map(toSelectableValue);
@@ -5505,7 +5492,8 @@ class AdHocFiltersVariable extends SceneObjectBase {
     const response = await ds.getTagKeys(__spreadValues$z({
       filters: otherFilters,
       queries,
-      timeRange
+      timeRange,
+      scopes: (_d = this._scopesBridge) == null ? void 0 : _d.getValue()
     }, getEnrichedFiltersRequest(this)));
     if (responseHasError(response)) {
       this.setState({ error: response.error.message });
@@ -5521,7 +5509,7 @@ class AdHocFiltersVariable extends SceneObjectBase {
     return keys.map(toSelectableValue);
   }
   async _getValuesFor(filter) {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     const override = await ((_b = (_a = this.state).getTagValuesProvider) == null ? void 0 : _b.call(_a, this, filter));
     if (override && override.replace) {
       return dataFromResponse(override.values).map(toSelectableValue);
@@ -5537,7 +5525,8 @@ class AdHocFiltersVariable extends SceneObjectBase {
       key: filter.key,
       filters: otherFilters,
       timeRange,
-      queries
+      queries,
+      scopes: (_d = this._scopesBridge) == null ? void 0 : _d.getValue()
     }, getEnrichedFiltersRequest(this)));
     if (responseHasError(response)) {
       this.setState({ error: response.error.message });
@@ -5725,6 +5714,7 @@ class SceneQueryRunner extends SceneObjectBase {
   _onActivate() {
     if (this.isQueryModeAuto()) {
       const timeRange = sceneGraph.getTimeRange(this);
+      const scopesBridge = sceneGraph.getScopesBridge(this);
       const providers = this.getClosestExtraQueryProviders();
       for (const provider of providers) {
         this._subs.add(
@@ -5735,6 +5725,7 @@ class SceneQueryRunner extends SceneObjectBase {
           })
         );
       }
+      this.subscribeToScopesChanges(scopesBridge);
       this.subscribeToTimeRangeChanges(timeRange);
       if (this.shouldRunQueriesOnActivate()) {
         this.runQueries();
@@ -5880,6 +5871,21 @@ class SceneQueryRunner extends SceneObjectBase {
   isDataReadyToDisplay() {
     return Boolean(this.state._hasFetchedData);
   }
+  subscribeToScopesChanges(scopesBridge) {
+    if (!scopesBridge) {
+      return;
+    }
+    if (this._scopesSubBridge === scopesBridge) {
+      return;
+    }
+    if (this._scopesSub) {
+      this._scopesSub.unsubscribe();
+    }
+    this._scopesSubBridge = scopesBridge;
+    this._scopesSub = scopesBridge.subscribeToValue(() => {
+      this.runWithTimeRangeAndScopes(sceneGraph.getTimeRange(this), scopesBridge);
+    });
+  }
   subscribeToTimeRangeChanges(timeRange) {
     if (this._timeSubRange === timeRange) {
       return;
@@ -5889,15 +5895,17 @@ class SceneQueryRunner extends SceneObjectBase {
     }
     this._timeSubRange = timeRange;
     this._timeSub = timeRange.subscribeToState(() => {
-      this.runWithTimeRange(timeRange);
+      this.runWithTimeRangeAndScopes(timeRange, sceneGraph.getScopesBridge(this));
     });
   }
   runQueries() {
     const timeRange = sceneGraph.getTimeRange(this);
+    const scopesBridge = sceneGraph.getScopesBridge(this);
     if (this.isQueryModeAuto()) {
       this.subscribeToTimeRangeChanges(timeRange);
+      this.subscribeToScopesChanges(scopesBridge);
     }
-    this.runWithTimeRange(timeRange);
+    this.runWithTimeRangeAndScopes(timeRange, scopesBridge);
   }
   getMaxDataPoints() {
     var _a;
@@ -5917,8 +5925,8 @@ class SceneQueryRunner extends SceneObjectBase {
       data: __spreadProps$m(__spreadValues$y({}, this.state.data), { state: schema.LoadingState.Done })
     });
   }
-  async runWithTimeRange(timeRange) {
-    var _a, _b, _c;
+  async runWithTimeRangeAndScopes(timeRange, scopesBridge) {
+    var _a, _b, _c, _d;
     if (!this.state.maxDataPoints && this.state.maxDataPointsFromWidth && !this._containerWidth) {
       return;
     }
@@ -5931,17 +5939,22 @@ class SceneQueryRunner extends SceneObjectBase {
       this.setState({ data: __spreadProps$m(__spreadValues$y({}, (_b = this.state.data) != null ? _b : emptyPanelData), { state: schema.LoadingState.Loading }) });
       return;
     }
+    if (scopesBridge == null ? void 0 : scopesBridge.isLoading()) {
+      writeSceneLog("SceneQueryRunner", "Scopes are in loading state, skipping query execution");
+      this.setState({ data: __spreadProps$m(__spreadValues$y({}, (_c = this.state.data) != null ? _c : emptyPanelData), { state: schema.LoadingState.Loading }) });
+      return;
+    }
     const { queries } = this.state;
     if (!(queries == null ? void 0 : queries.length)) {
       this._setNoDataState();
       return;
     }
     try {
-      const datasource = (_c = this.state.datasource) != null ? _c : findFirstDatasource(queries);
+      const datasource = (_d = this.state.datasource) != null ? _d : findFirstDatasource(queries);
       const ds = await getDataSource(datasource, this._scopedVars);
       this.findAndSubscribeToAdHocFilters(ds.uid);
       const runRequest = runtime.getRunRequest();
-      const { primary, secondaries, processors } = this.prepareRequests(timeRange, ds);
+      const { primary, secondaries, processors } = this.prepareRequests(timeRange, ds, scopesBridge);
       writeSceneLog("SceneQueryRunner", "Starting runRequest", this.state.key);
       let stream = runRequest(ds, primary);
       if (secondaries.length > 0) {
@@ -5980,8 +5993,8 @@ class SceneQueryRunner extends SceneObjectBase {
     clone["_results"].next({ origin: this, data: (_a = this.state.data) != null ? _a : emptyPanelData });
     return clone;
   }
-  prepareRequests(timeRange, ds) {
-    var _a, _b;
+  prepareRequests(timeRange, ds, scopesBridge) {
+    var _a;
     const { minInterval, queries } = this.state;
     let request = __spreadValues$y({
       app: "scenes",
@@ -6000,15 +6013,11 @@ class SceneQueryRunner extends SceneObjectBase {
         to: timeRange.state.to
       },
       cacheTimeout: this.state.cacheTimeout,
-      queryCachingTTL: this.state.queryCachingTTL
+      queryCachingTTL: this.state.queryCachingTTL,
+      scopes: scopesBridge == null ? void 0 : scopesBridge.getValue()
     }, getEnrichedDataRequest(this));
     if (this._adhocFiltersVar) {
-      request.filters = [];
-      if ((_a = this._adhocFiltersVar.state.baseFilters) == null ? void 0 : _a.length) {
-        const injectedBaseFilters = this._adhocFiltersVar.state.baseFilters.filter((filter) => filter.source);
-        request.filters = request.filters.concat(injectedBaseFilters);
-      }
-      request.filters = request.filters.concat(this._adhocFiltersVar.state.filters.filter(isFilterComplete));
+      request.filters = this._adhocFiltersVar.state.filters.filter(isFilterComplete);
     }
     if (this._groupByVar) {
       request.groupByKeys = this._groupByVar.state.value;
@@ -6031,7 +6040,7 @@ class SceneQueryRunner extends SceneObjectBase {
     const primaryTimeRange = timeRange.state.value;
     let secondaryRequests = [];
     let secondaryProcessors = /* @__PURE__ */ new Map();
-    for (const provider of (_b = this.getClosestExtraQueryProviders()) != null ? _b : []) {
+    for (const provider of (_a = this.getClosestExtraQueryProviders()) != null ? _a : []) {
       for (const { req, processor } of provider.getExtraQueries(request)) {
         const requestId = getNextRequestId$1();
         secondaryRequests.push(__spreadProps$m(__spreadValues$y({}, req), { requestId }));
@@ -6973,6 +6982,108 @@ function containsSearchFilter(query) {
   return str.indexOf(SEARCH_FILTER_VARIABLE) > -1;
 }
 
+class SceneScopesBridge extends SceneObjectBase {
+  constructor() {
+    super(...arguments);
+    this._urlSync = new SceneObjectUrlSyncConfig(this, { keys: ["scopes"] });
+    this._renderBeforeActivation = true;
+    this._contextSubject = new rxjs.BehaviorSubject(void 0);
+    this._pendingScopes = null;
+  }
+  getUrlState() {
+    var _a, _b, _c;
+    return {
+      scopes: (_c = this._pendingScopes) != null ? _c : ((_b = (_a = this.context) == null ? void 0 : _a.state.value) != null ? _b : []).map((scope) => scope.metadata.name)
+    };
+  }
+  updateFromUrl(values) {
+    var _a, _b;
+    let scopes = (_a = values["scopes"]) != null ? _a : [];
+    scopes = (Array.isArray(scopes) ? scopes : [scopes]).map(String);
+    if (!this.context) {
+      this._pendingScopes = scopes;
+      return;
+    }
+    (_b = this.context) == null ? void 0 : _b.changeScopes(scopes);
+  }
+  getValue() {
+    var _a, _b;
+    return (_b = (_a = this.context) == null ? void 0 : _a.state.value) != null ? _b : [];
+  }
+  subscribeToValue(cb) {
+    return this.contextObservable.pipe(
+      rxjs.filter((context) => !!context && !context.state.loading),
+      rxjs.pairwise(),
+      rxjs.map(
+        ([prevContext, newContext]) => {
+          var _a, _b;
+          return [(_a = prevContext == null ? void 0 : prevContext.state.value) != null ? _a : [], (_b = newContext == null ? void 0 : newContext.state.value) != null ? _b : []];
+        }
+      ),
+      rxjs.filter(([prevScopes, newScopes]) => !lodash.isEqual(prevScopes, newScopes))
+    ).subscribe(([prevScopes, newScopes]) => {
+      cb(newScopes, prevScopes);
+    });
+  }
+  isLoading() {
+    var _a, _b;
+    return (_b = (_a = this.context) == null ? void 0 : _a.state.loading) != null ? _b : false;
+  }
+  subscribeToLoading(cb) {
+    return this.contextObservable.pipe(
+      rxjs.filter((context) => !!context),
+      rxjs.pairwise(),
+      rxjs.map(
+        ([prevContext, newContext]) => {
+          var _a, _b;
+          return [(_a = prevContext == null ? void 0 : prevContext.state.loading) != null ? _a : false, (_b = newContext == null ? void 0 : newContext.state.loading) != null ? _b : false];
+        }
+      ),
+      rxjs.filter(([prevLoading, newLoading]) => prevLoading !== newLoading)
+    ).subscribe(([_prevLoading, newLoading]) => {
+      cb(newLoading);
+    });
+  }
+  setEnabled(enabled) {
+    var _a;
+    (_a = this.context) == null ? void 0 : _a.setEnabled(enabled);
+  }
+  setReadOnly(readOnly) {
+    var _a;
+    (_a = this.context) == null ? void 0 : _a.setReadOnly(readOnly);
+  }
+  updateContext(newContext) {
+    var _a, _b;
+    if (this._pendingScopes && newContext) {
+      setTimeout(() => {
+        newContext == null ? void 0 : newContext.changeScopes(this._pendingScopes);
+        this._pendingScopes = null;
+      });
+    }
+    if (this.context !== newContext || ((_a = this.context) == null ? void 0 : _a.state) !== (newContext == null ? void 0 : newContext.state)) {
+      const shouldUpdate = ((_b = this.context) == null ? void 0 : _b.state.value) !== (newContext == null ? void 0 : newContext.state.value);
+      this._contextSubject.next(newContext);
+      if (shouldUpdate) {
+        this.forceRender();
+      }
+    }
+  }
+  get context() {
+    return this._contextSubject.getValue();
+  }
+  get contextObservable() {
+    return this._contextSubject.asObservable();
+  }
+}
+SceneScopesBridge.Component = SceneScopesBridgeRenderer;
+function SceneScopesBridgeRenderer({ model }) {
+  const context = runtime.useScopes();
+  React.useEffect(() => {
+    model.updateContext(context);
+  }, [context, model]);
+  return null;
+}
+
 function getVariables(sceneObject) {
   var _a;
   return (_a = getClosest(sceneObject, (s) => s.state.$variables)) != null ? _a : EmptyVariableSet;
@@ -7116,6 +7227,10 @@ function findDescendents(scene, descendentType) {
   const targetScenes = findAllObjects(scene, isDescendentType);
   return targetScenes.filter(isDescendentType);
 }
+function getScopesBridge(sceneObject) {
+  var _a;
+  return (_a = findObject(sceneObject, (s) => s instanceof SceneScopesBridge)) != null ? _a : void 0;
+}
 
 const sceneGraph = {
   getVariables,
@@ -7132,7 +7247,8 @@ const sceneGraph = {
   findAllObjects,
   getAncestor,
   getQueryController,
-  findDescendents
+  findDescendents,
+  getScopesBridge
 };
 
 class UniqueUrlKeyMapper {
@@ -12886,6 +13002,10 @@ class SplitLayout extends SceneObjectBase {
 SplitLayout.Component = SplitLayoutRenderer;
 
 class SceneApp extends SceneObjectBase {
+  constructor() {
+    super(...arguments);
+    this._renderBeforeActivation = true;
+  }
   enrichDataRequest() {
     return {
       app: this.state.name || "app"
@@ -12893,8 +13013,10 @@ class SceneApp extends SceneObjectBase {
   }
 }
 SceneApp.Component = ({ model }) => {
-  const { pages } = model.useState();
-  return /* @__PURE__ */ React__default["default"].createElement(SceneAppContext.Provider, {
+  const { pages, scopesBridge } = model.useState();
+  return /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, scopesBridge && /* @__PURE__ */ React__default["default"].createElement(scopesBridge.Component, {
+    model: scopesBridge
+  }), /* @__PURE__ */ React__default["default"].createElement(SceneAppContext.Provider, {
     value: model
   }, /* @__PURE__ */ React__default["default"].createElement(reactRouterDom.Routes, null, pages.map((page) => /* @__PURE__ */ React__default["default"].createElement(reactRouterDom.Route, {
     key: page.state.url,
@@ -12902,7 +13024,7 @@ SceneApp.Component = ({ model }) => {
     element: /* @__PURE__ */ React__default["default"].createElement(page.Component, {
       model: page
     })
-  }))));
+  })))));
 };
 const SceneAppContext = React.createContext(null);
 const sceneAppCache = /* @__PURE__ */ new Map();
@@ -13257,6 +13379,21 @@ class SceneAppPage extends SceneObjectBase {
     super(state);
     this._sceneCache = /* @__PURE__ */ new Map();
     this._drilldownCache = /* @__PURE__ */ new Map();
+    this._activationHandler = () => {
+      if (!this.state.useScopes) {
+        return;
+      }
+      this._scopesBridge = sceneGraph.getScopesBridge(this);
+      if (!this._scopesBridge) {
+        throw new Error("Use of scopes is enabled but no scopes bridge found");
+      }
+      this._scopesBridge.setEnabled(true);
+      return () => {
+        var _a;
+        (_a = this._scopesBridge) == null ? void 0 : _a.setEnabled(false);
+      };
+    };
+    this.addActivationHandler(this._activationHandler);
   }
   initializeScene(scene) {
     this.setState({ initializedScene: scene });
@@ -14215,7 +14352,6 @@ exports.EmbeddedScene = EmbeddedScene;
 exports.FieldConfigBuilder = FieldConfigBuilder;
 exports.FieldConfigBuilders = FieldConfigBuilders;
 exports.FieldConfigOverridesBuilder = FieldConfigOverridesBuilder;
-exports.FilterSource = FilterSource;
 exports.GroupByVariable = GroupByVariable;
 exports.IntervalVariable = IntervalVariable;
 exports.LazyLoader = LazyLoader;
@@ -14256,6 +14392,7 @@ exports.SceneObjectUrlSyncConfig = SceneObjectUrlSyncConfig;
 exports.SceneQueryRunner = SceneQueryRunner;
 exports.SceneReactObject = SceneReactObject;
 exports.SceneRefreshPicker = SceneRefreshPicker;
+exports.SceneScopesBridge = SceneScopesBridge;
 exports.SceneTimePicker = SceneTimePicker;
 exports.SceneTimeRange = SceneTimeRange;
 exports.SceneTimeRangeCompare = SceneTimeRangeCompare;