@grafana/scenes 6.30.1 → 6.31.0--canary.1192.17130344208.0

package/dist/index.js

@@ -3383,6 +3383,39 @@ const getStyles$h = (theme) => ({
   })
 });
 
+const isValidReactElementWithData = (child) => {
+  var _a, _b;
+  return React__default.default.isValidElement(child) && Boolean((_b = (_a = child.props) == null ? void 0 : _a.data) == null ? void 0 : _b.value);
+};
+const findKeyApplicability = (keysApplicability, value) => {
+  return keysApplicability == null ? void 0 : keysApplicability.find((applicability) => applicability.key === value);
+};
+const renderChildWithApplicability = (child, applicability) => {
+  if (!applicability) {
+    return child;
+  }
+  if (!applicability.applicable) {
+    return /* @__PURE__ */ React__default.default.createElement("s", { key: applicability.key }, child);
+  }
+  return child;
+};
+const GroupByValueContainer = ({
+  keysApplicability,
+  children
+}) => {
+  const theme = ui.useTheme2();
+  const styles = ui.getSelectStyles(theme);
+  const renderChild = (child) => {
+    if (!isValidReactElementWithData(child)) {
+      return child;
+    }
+    const value = child.props.data.value;
+    const applicability = findKeyApplicability(keysApplicability, value);
+    return renderChildWithApplicability(child, applicability);
+  };
+  return /* @__PURE__ */ React__default.default.createElement("div", { className: styles.multiValueContainer }, React__default.default.Children.map(children, renderChild));
+};
+
 class GroupByVariable extends MultiValueVariable {
   constructor(initialState) {
     super({
@@ -3402,6 +3435,7 @@ class GroupByVariable extends MultiValueVariable {
     this.isLazy = true;
     this._urlSync = new GroupByVariableUrlSyncHandler(this);
     this._activationHandler = () => {
+      this._verifyApplicability();
       if (this.state.defaultValue) {
         if (this.checkIfRestorable(this.state.value)) {
           this.setState({ restorable: true });
@@ -3519,6 +3553,40 @@ class GroupByVariable extends MultiValueVariable {
       })
     );
   }
+  getApplicableKeys() {
+    const { value, keysApplicability } = this.state;
+    const valueArray = lodash.isArray(value) ? value : value ? [value] : [];
+    if (!keysApplicability || keysApplicability.length === 0) {
+      return valueArray;
+    }
+    const applicableValues = valueArray.filter((val) => {
+      const applicability = keysApplicability.find((item) => item.key === val);
+      return !applicability || applicability.applicable !== false;
+    });
+    return applicableValues;
+  }
+  async _verifyApplicability() {
+    const ds = await getDataSource(this.state.datasource, {
+      __sceneObject: wrapInSafeSerializableSceneObject(this)
+    });
+    if (!ds.getFiltersApplicability) {
+      return;
+    }
+    const queries = getQueriesForVariables(this);
+    const timeRange = sceneGraph.getTimeRange(this).state.value;
+    const value = this.state.value;
+    const response = await ds.getFiltersApplicability({
+      groupByKeys: Array.isArray(value) ? value.map((v) => String(v)) : value ? [String(value)] : [],
+      queries,
+      timeRange,
+      scopes: sceneGraph.getScopes(this),
+      ...getEnrichedFiltersRequest(this)
+    });
+    if (!lodash.isEqual(response, this.state.keysApplicability)) {
+      this.setState({ keysApplicability: response });
+      this.publishEvent(new SceneVariableValueChangedEvent(this), true);
+    }
+  }
   // This method is related to the defaultValue property. We check if the current value
   // is different from the default value. If it is, the groupBy will show a button
   // allowing the user to restore the default values.
@@ -3557,7 +3625,8 @@ function GroupByVariableRenderer({ model }) {
     options,
     includeAll,
     allowCustomValue = true,
-    defaultValue
+    defaultValue,
+    keysApplicability
   } = model.useState();
   const values = React.useMemo(() => {
     const arrayValue = lodash.isArray(value) ? value : [value];
@@ -3629,7 +3698,8 @@ function GroupByVariableRenderer({ model }) {
         Option: OptionWithCheckbox,
         ...hasDefaultValue ? {
           IndicatorsContainer: () => /* @__PURE__ */ React__default.default.createElement(DefaultGroupByCustomIndicatorContainer, { model })
-        } : {}
+        } : {},
+        MultiValueContainer: ({ innerProps, children }) => /* @__PURE__ */ React__default.default.createElement(GroupByValueContainer, { innerProps, keysApplicability }, children)
       },
       onInputChange,
       onBlur: () => {
@@ -3646,6 +3716,8 @@ function GroupByVariableRenderer({ model }) {
       onChange: (newValue, action) => {
         if (action.action === "clear" && noValueOnClear) {
           model.changeValueTo([], void 0, true);
+        } else {
+          model._verifyApplicability();
         }
         setUncommittedValue(newValue);
       },
@@ -6685,7 +6757,7 @@ class SceneQueryRunner extends SceneObjectBase {
       ].filter((f) => isFilterComplete(f) && isFilterApplicable(f));
     }
     if (this._groupByVar) {
-      request.groupByKeys = this._groupByVar.state.value;
+      request.groupByKeys = this._groupByVar.getApplicableKeys();
     }
     request.targets = request.targets.map((query) => {
       var _a2;