@malloydata/malloy-explorer 0.0.277-dev250515002611 → 0.0.278-dev250516210719

package/dist/cjs/index.cjs

@@ -19,6 +19,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const QB = require("@malloydata/malloy-query-builder");
 const malloyTag = require("@malloydata/malloy-tag");
+const malloyFilter = require("@malloydata/malloy-filter");
 require("@malloydata/render/webcomponent");
 const ReactDOM = require("react-dom");
 function _interopNamespaceDefault(e) {
@@ -29949,6 +29950,11 @@ function getViewDefinition(parent) {
   return parent instanceof QB.ASTArrowQueryDefinition ? parent.view : parent.definition;
 }
 function getInputSchemaFromViewParent(parent) {
+  if (!parent) {
+    return {
+      fields: []
+    };
+  }
   const definition = getViewDefinition(parent);
   return definition.getInputSchema();
 }
@@ -32399,12 +32405,49 @@ const styles$g = {
     $$css: true
   }
 };
+function toFullName(path, name) {
+  return [...path || [], name].join(".");
+}
 function segmentHasLimit(segment) {
   return segment.operations.items.find((operation) => operation instanceof QB.ASTLimitViewOperation) !== void 0;
 }
 function segmentHasOrderBy(segment, name) {
   return segment.operations.items.find((operation) => operation instanceof QB.ASTOrderByViewOperation && operation.name === name) !== void 0;
 }
+function getOutputNameToInputNameMap(segment) {
+  const nameMap = /* @__PURE__ */ new Map();
+  for (const operation of segment.operations.items) {
+    if (operation instanceof QB.ASTGroupByViewOperation || operation instanceof QB.ASTAggregateViewOperation) {
+      const reference = operation.field.getReference();
+      nameMap.set(operation.name, toFullName(reference.path, reference.name));
+    }
+  }
+  return nameMap;
+}
+function segmentHasOrderBySourceField(segment, path, name) {
+  const nameMap = getOutputNameToInputNameMap(segment);
+  const fullInputName = toFullName(path, name);
+  return !!segment.operations.items.find((operation) => {
+    if (operation instanceof QB.ASTOrderByViewOperation && nameMap.has(operation.name)) {
+      return fullInputName === nameMap.get(operation.name);
+    }
+    return false;
+  });
+}
+function areReferencesEqual(path1, name1, path2, name2) {
+  return name1 === name2 && (path1 || []).join(".") === (path2 || []).join(".");
+}
+function segmentHasFieldInOutputSpace(segment, path, name) {
+  const match = segment.operations.items.find((operation) => {
+    if (operation instanceof QB.ASTGroupByViewOperation || operation instanceof QB.ASTAggregateViewOperation) {
+      const reference = operation.field.getReference();
+      const isEqual = areReferencesEqual(path, name, reference.path, reference.name);
+      return isEqual;
+    }
+    return false;
+  });
+  return !!match;
+}
 function segmentNestNo(segment, name) {
   return segment.operations.items.reduce((acc, operation) => {
     if (operation instanceof QB.ASTNestViewOperation) {
@@ -32459,6 +32502,19 @@ function addNest(view, field) {
   }
   segment.addNest(field.name, rename);
 }
+function addOrderByFromSource(view, path, name, direction = "desc") {
+  const fullInputName = toFullName(path, name);
+  let orderByName = name;
+  const segment = view.getOrAddDefaultSegment();
+  const nameMap = getOutputNameToInputNameMap(segment);
+  for (const entry of nameMap.entries()) {
+    if (entry[1] === fullInputName) {
+      orderByName = entry[0];
+      break;
+    }
+  }
+  segment.addOrderBy(orderByName, direction);
+}
 function addOrderBy(view, field, direction = "desc") {
   const segment = view.getOrAddDefaultSegment();
   segment.addOrderBy(field.name, direction);
@@ -32472,6 +32528,9 @@ function addFilter(view, field, path, filter) {
   }
 }
 function getSegmentIfPresent(parent) {
+  if (!parent) {
+    return void 0;
+  }
   const definition = getViewDefinition(parent);
   if (definition instanceof QB.ASTSegmentViewDefinition) {
     return definition;
@@ -33272,94 +33331,6 @@ class ErrorElement extends React__namespace.Component {
     return this.props.children;
   }
 }
-function FilterOperations({
-  rootQuery,
-  filters
-}) {
-  const {
-    setQuery
-  } = React.useContext(QueryEditorContext);
-  if (filters.length === 0) {
-    return null;
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.title),
-      children: "filter by"
-    }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.tokenContainer),
-      children: filters.map((filterOperation, key2) => {
-        return /* @__PURE__ */ jsxRuntime.jsx(ErrorElement, {
-          fallback: /* @__PURE__ */ jsxRuntime.jsxs("div", {
-            children: ["Invalid filter", /* @__PURE__ */ jsxRuntime.jsx(ClearButton, {
-              onClick: () => {
-                filterOperation.delete();
-                setQuery == null ? void 0 : setQuery(rootQuery.build());
-              }
-            })]
-          }),
-          children: /* @__PURE__ */ jsxRuntime.jsx(SingleFilterOperation, {
-            filterOperation,
-            rootQuery
-          })
-        }, key2);
-      })
-    })]
-  });
-}
-function SingleFilterOperation({
-  rootQuery,
-  filterOperation
-}) {
-  const {
-    fieldReference,
-    filterString
-  } = filterOperation.filter;
-  const filter = filterOperation.filter.getFilter();
-  const fieldInfo = fieldReference.getFieldInfo();
-  const {
-    setQuery
-  } = React.useContext(QueryEditorContext);
-  if (fieldInfo.kind !== "dimension" && fieldInfo.kind !== "measure") {
-    throw new Error(`Invalid filter field kind: ${fieldInfo.kind}`);
-  }
-  const setFilter = React.useCallback((filter2) => {
-    filterOperation.filter.setFilter(filter2);
-    setQuery == null ? void 0 : setQuery(rootQuery.build());
-  }, [filterOperation.filter, rootQuery, setQuery]);
-  const {
-    op,
-    value
-  } = parsedToLabels(filter, filterString);
-  const label = `${fieldInfo.name} ${op} ${value}`;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    ..._stylex.props(hoverStyles.main),
-    children: [/* @__PURE__ */ jsxRuntime.jsx(FilterPopover, {
-      fieldInfo,
-      path: fieldReference.path ?? [],
-      filter,
-      setFilter,
-      trigger: /* @__PURE__ */ jsxRuntime.jsx(Token, {
-        icon: "filter",
-        color: "cyan",
-        label
-      }),
-      layoutProps: {
-        align: "start",
-        side: "bottom",
-        sideOffset: 1
-      }
-    }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(hoverStyles.hoverActions),
-      children: /* @__PURE__ */ jsxRuntime.jsx(ClearButton, {
-        onClick: () => {
-          filterOperation.delete();
-          setQuery == null ? void 0 : setQuery(rootQuery.build());
-        }
-      })
-    })]
-  });
-}
 const parsedToLabels = (parsed, filterString) => {
   if (parsed.parsed === null) {
     return {
@@ -33539,6 +33510,94 @@ function displayTimeFromMoment(momentObj) {
   }
   return momentObj.moment;
 }
+function FilterOperations({
+  rootQuery,
+  filters
+}) {
+  const {
+    setQuery
+  } = React.useContext(QueryEditorContext);
+  if (filters.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+    children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
+      ..._stylex.props(styles$s.title),
+      children: "filter by"
+    }), /* @__PURE__ */ jsxRuntime.jsx("div", {
+      ..._stylex.props(styles$s.tokenContainer),
+      children: filters.map((filterOperation, key2) => {
+        return /* @__PURE__ */ jsxRuntime.jsx(ErrorElement, {
+          fallback: /* @__PURE__ */ jsxRuntime.jsxs("div", {
+            children: ["Invalid filter", /* @__PURE__ */ jsxRuntime.jsx(ClearButton, {
+              onClick: () => {
+                filterOperation.delete();
+                setQuery == null ? void 0 : setQuery(rootQuery.build());
+              }
+            })]
+          }),
+          children: /* @__PURE__ */ jsxRuntime.jsx(SingleFilterOperation, {
+            filterOperation,
+            rootQuery
+          })
+        }, key2);
+      })
+    })]
+  });
+}
+function SingleFilterOperation({
+  rootQuery,
+  filterOperation
+}) {
+  const {
+    fieldReference,
+    filterString
+  } = filterOperation.filter;
+  const filter = filterOperation.filter.getFilter();
+  const fieldInfo = fieldReference.getFieldInfo();
+  const {
+    setQuery
+  } = React.useContext(QueryEditorContext);
+  if (fieldInfo.kind !== "dimension" && fieldInfo.kind !== "measure") {
+    throw new Error(`Invalid filter field kind: ${fieldInfo.kind}`);
+  }
+  const setFilter = React.useCallback((filter2) => {
+    filterOperation.filter.setFilter(filter2);
+    setQuery == null ? void 0 : setQuery(rootQuery.build());
+  }, [filterOperation.filter, rootQuery, setQuery]);
+  const {
+    op,
+    value
+  } = parsedToLabels(filter, filterString);
+  const label = `${fieldInfo.name} ${op} ${value}`;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+    ..._stylex.props(hoverStyles.main),
+    children: [/* @__PURE__ */ jsxRuntime.jsx(FilterPopover, {
+      fieldInfo,
+      path: fieldReference.path ?? [],
+      filter,
+      setFilter,
+      trigger: /* @__PURE__ */ jsxRuntime.jsx(Token, {
+        icon: "filter",
+        color: "cyan",
+        label
+      }),
+      layoutProps: {
+        align: "start",
+        side: "bottom",
+        sideOffset: 1
+      }
+    }), /* @__PURE__ */ jsxRuntime.jsx("div", {
+      ..._stylex.props(hoverStyles.hoverActions),
+      children: /* @__PURE__ */ jsxRuntime.jsx(ClearButton, {
+        onClick: () => {
+          filterOperation.delete();
+          setQuery == null ? void 0 : setQuery(rootQuery.build());
+        }
+      })
+    })]
+  });
+}
 function LimitOperation({
   rootQuery,
   limit
@@ -34644,8 +34703,128 @@ const styles$a = {
     $$css: true
   }
 };
+function FilterLiteralEditor({
+  filterType,
+  value,
+  setValue
+}) {
+  let filter = null;
+  switch (filterType) {
+    case "string_type":
+      {
+        const {
+          parsed
+        } = malloyFilter.StringFilterExpression.parse(value.filter_expression_value);
+        filter = {
+          kind: "string",
+          parsed
+        };
+      }
+      break;
+    case "number_type":
+      {
+        const {
+          parsed
+        } = malloyFilter.NumberFilterExpression.parse(value.filter_expression_value);
+        filter = {
+          kind: "number",
+          parsed
+        };
+      }
+      break;
+    case "boolean_type":
+      {
+        const {
+          parsed
+        } = malloyFilter.BooleanFilterExpression.parse(value.filter_expression_value);
+        filter = {
+          kind: "boolean",
+          parsed
+        };
+      }
+      break;
+    case "date_type":
+      {
+        const {
+          parsed
+        } = malloyFilter.TemporalFilterExpression.parse(value.filter_expression_value);
+        filter = {
+          kind: "date",
+          parsed
+        };
+      }
+      break;
+    case "timestamp_type":
+      {
+        const {
+          parsed
+        } = malloyFilter.TemporalFilterExpression.parse(value.filter_expression_value);
+        filter = {
+          kind: "timestamp",
+          parsed
+        };
+      }
+      break;
+  }
+  const {
+    op,
+    value: filterValue
+  } = parsedToLabels(filter, value.filter_expression_value);
+  const label = `${op} ${filterValue}`;
+  const fieldInfo = {
+    kind: "dimension",
+    name: "parameter",
+    type: {
+      kind: filterType
+    }
+  };
+  const setFilter = (parsed) => {
+    switch (parsed.kind) {
+      case "string":
+        setValue({
+          kind: "filter_expression_literal",
+          filter_expression_value: malloyFilter.StringFilterExpression.unparse(parsed.parsed)
+        });
+        break;
+      case "boolean":
+        setValue({
+          kind: "filter_expression_literal",
+          filter_expression_value: malloyFilter.BooleanFilterExpression.unparse(parsed.parsed)
+        });
+        break;
+      case "number":
+        setValue({
+          kind: "filter_expression_literal",
+          filter_expression_value: malloyFilter.NumberFilterExpression.unparse(parsed.parsed)
+        });
+        break;
+      case "date":
+      case "timestamp":
+        setValue({
+          kind: "filter_expression_literal",
+          filter_expression_value: malloyFilter.TemporalFilterExpression.unparse(parsed.parsed)
+        });
+        break;
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(FilterPopover, {
+    fieldInfo,
+    path: [],
+    filter,
+    setFilter,
+    trigger: /* @__PURE__ */ jsxRuntime.jsx(Token, {
+      label
+    }),
+    layoutProps: {
+      align: "start",
+      side: "bottom",
+      sideOffset: 1
+    }
+  });
+}
 function LiteralValueEditor({
   value,
+  filterType,
   setValue,
   customStyle
 }) {
@@ -34700,12 +34879,10 @@ function LiteralValueEditor({
         customStyle
       });
     case "filter_expression_literal":
-      return /* @__PURE__ */ jsxRuntime.jsx(EditableToken, {
-        value: value.filter_expression_value,
-        onChange: (value2) => setValue({
-          kind: "filter_expression_literal",
-          filter_expression_value: value2
-        }),
+      return /* @__PURE__ */ jsxRuntime.jsx(FilterLiteralEditor, {
+        value,
+        filterType,
+        setValue,
         customStyle
       });
   }
@@ -34736,6 +34913,7 @@ function Parameters({
               icon: atomicTypeToIcon(parameter.type.kind),
               label: parameter.name
             }), /* @__PURE__ */ jsxRuntime.jsx(LiteralValueEditor, {
+              filterType: parameter.type.kind === "filter_expression_type" ? parameter.type.filter_type.kind : "string_type",
               value: ((_a2 = source.tryGetParameter(parameter.name)) == null ? void 0 : _a2.parameter.value) ?? parameter.default_value,
               setValue: (value) => {
                 source.setParameter(parameter.name, value);
@@ -35794,62 +35972,83 @@ const FIELD_KIND_TO_TITLE = {
   dimension: "Dimensions"
 };
 function useOperations(view, field, path) {
-  const dimensionFields = React.useMemo(() => {
-    const {
-      fields
-    } = getInputSchemaFromViewParent(view);
-    return new Set(flattenFieldsTree(fields).filter(({
-      field: field2
-    }) => field2.kind === "dimension").map(({
-      field: field2
-    }) => field2.name));
-  }, [view]);
-  const measureFields = React.useMemo(() => {
+  const fullName = toFullName(path, field.name);
+  const flattenedFields = React.useMemo(() => {
     const {
       fields
     } = getInputSchemaFromViewParent(view);
-    return new Set(flattenFieldsTree(fields).filter(({
-      field: field2
-    }) => field2.kind === "measure").map(({
-      field: field2
-    }) => field2.name));
-  }, [view]);
-  const isGroupByAllowed = React.useMemo(() => {
-    if (!view) {
-      return false;
-    }
+    const inputPath = path.join(".");
+    return flattenFieldsTree(fields).filter((fieldItem) => {
+      return fieldItem.path.join(".") === inputPath;
+    });
+  }, [path, view]);
+  const matchingFieldItem = flattenedFields.find((fieldItem) => field.name === fieldItem.field.name);
+  const groupByDisabledReason = React.useMemo(() => {
     const segment = getSegmentIfPresent(view);
-    return dimensionFields.has(field.name) && !(segment == null ? void 0 : segment.hasField(field.name, path)) && isNotAnnotatedFilteredField(field);
-  }, [view, field, path, dimensionFields]);
-  const isAggregateAllowed = React.useMemo(() => {
-    if (!view) {
-      return false;
+    if ((matchingFieldItem == null ? void 0 : matchingFieldItem.field.kind) !== "dimension") {
+      return "Grouping is only available on a dimenion.";
+    }
+    if (segment == null ? void 0 : segment.hasField(field.name, path)) {
+      return "Cannot group by a field already in the view.";
+    }
+    if (!isNotAnnotatedFilteredField(field)) {
+      return "This field is annotated with #NO_UI.";
+    }
+    return "";
+  }, [view, matchingFieldItem == null ? void 0 : matchingFieldItem.field.kind, field, path]);
+  const aggregateDisabledReason = React.useMemo(() => {
+    if ((matchingFieldItem == null ? void 0 : matchingFieldItem.field.kind) !== "measure") {
+      return "Aggregation only supports measure fields.";
     }
     const segment = getSegmentIfPresent(view);
-    return measureFields.has(field.name) && !(segment == null ? void 0 : segment.hasField(field.name, path)) && isNotAnnotatedFilteredField(field);
-  }, [view, field, path, measureFields]);
-  const isFilterAllowed = React.useMemo(() => {
-    if (!view) {
-      return false;
+    if (segment == null ? void 0 : segment.hasField(field.name, path)) {
+      return "This field is already used in the query.";
     }
-    const fieldName = field.name;
-    const inputSchemaFields = getInputSchemaFromViewParent(view).fields;
-    return inputSchemaFields.filter((field2) => field2.kind === "dimension" || field2.kind === "measure").filter((field2) => FILTERABLE_TYPES.includes(field2.type.kind)).some((field2) => field2.name === fieldName);
-  }, [view, field]);
-  const isOrderByAllowed = React.useMemo(() => {
-    if (!view) {
-      return false;
+    if (!isNotAnnotatedFilteredField(field)) {
+      return "This field is annotated with #NO_UI.";
+    }
+    return "";
+  }, [matchingFieldItem == null ? void 0 : matchingFieldItem.field.kind, view, field, path]);
+  const filterDisabledReason = React.useMemo(() => {
+    if (!matchingFieldItem) {
+      return `Unexpected Error: Could not find a field ${fullName}.`;
+    }
+    if (!["dimension", "measure"].includes(matchingFieldItem.field.kind)) {
+      return `Filtering is only available for a dimension or measure.`;
+    }
+    if (!FILTERABLE_TYPES.includes(matchingFieldItem.field.type.kind)) {
+      return "Filtering only supports string, boolean, number, date and time fields.";
+    }
+    return "";
+  }, [fullName, matchingFieldItem]);
+  const orderByDisabledReason = React.useMemo(() => {
+    if (!matchingFieldItem) {
+      return `Unexpected Error: Could not find a field ${fullName}.`;
     }
-    const fieldName = field.name;
-    const outputSchemaFields = view.getOutputSchema().fields;
     const segment = getSegmentIfPresent(view);
-    return outputSchemaFields.filter((field2) => field2.kind === "dimension").filter((field2) => ORDERABLE_TYPES.includes(field2.type.kind)).filter((field2) => !segment || !segmentHasOrderBy(segment, field2.name)).some((field2) => field2.name === fieldName);
-  }, [view, field]);
+    if (segment && segmentHasOrderBySourceField(segment, path, field.name)) {
+      return "Query is already ordered by this field.";
+    }
+    if (!segment || !segmentHasFieldInOutputSpace(segment, path, field.name)) {
+      return "Order by is only available for fields in the output.";
+    }
+    if (!["dimension", "measure"].includes(matchingFieldItem.field.kind)) {
+      return "Order By is only available for dimension or measure fields.";
+    }
+    if (!ORDERABLE_TYPES.includes(matchingFieldItem.field.type.kind)) {
+      return "Order By only supports string, boolean, number, date and time fields.";
+    }
+    return "";
+  }, [matchingFieldItem, view, path, field.name, fullName]);
   return {
-    isGroupByAllowed,
-    isAggregateAllowed,
-    isFilterAllowed,
-    isOrderByAllowed
+    isGroupByAllowed: !groupByDisabledReason,
+    groupByDisabledReason,
+    isAggregateAllowed: !aggregateDisabledReason,
+    aggregateDisabledReason,
+    isFilterAllowed: !filterDisabledReason,
+    filterDisabledReason,
+    isOrderByAllowed: !orderByDisabledReason,
+    orderByDisabledReason
   };
 }
 const FILTERABLE_TYPES = ["string_type", "boolean_type", "number_type", "date_type", "timestamp_type"];
@@ -35866,22 +36065,22 @@ function FieldTokenWithActions({
   } = React.useContext(QueryEditorContext);
   const view = currentNestView ?? viewDef;
   const {
-    isGroupByAllowed,
-    isAggregateAllowed,
-    isFilterAllowed,
-    isOrderByAllowed
+    groupByDisabledReason,
+    aggregateDisabledReason,
+    filterDisabledReason,
+    orderByDisabledReason
   } = useOperations(view, field, path);
   const [isFilterPopoverOpen, setIsFilterPopoverOpen] = React.useState();
   const [isTooltipOpen, setIsTooltipOpen] = React.useState(false);
   const handleAddOperationAction = (operation, filter) => {
     if (field.kind === "dimension" || field.kind === "measure") {
-      if (operation === "groupBy" && isGroupByAllowed) {
+      if (operation === "groupBy" && !groupByDisabledReason) {
         addGroupBy(view, field, path);
-      } else if (operation === "aggregate" && isAggregateAllowed) {
+      } else if (operation === "aggregate" && !aggregateDisabledReason) {
         addAggregate(view, field, path);
-      } else if (operation === "orderBy" && isOrderByAllowed) {
-        addOrderBy(view, field);
-      } else if (operation === "filter" && isFilterAllowed && filter) {
+      } else if (operation === "orderBy" && !orderByDisabledReason) {
+        addOrderByFromSource(view, path, field.name);
+      } else if (operation === "filter" && !filterDisabledReason && filter) {
         addFilter(view, field, path, filter);
       }
       setQuery == null ? void 0 : setQuery(rootQuery == null ? void 0 : rootQuery.build());
@@ -35906,7 +36105,7 @@ function FieldTokenWithActions({
         icon: "insert",
         disabled: !(rootQuery == null ? void 0 : rootQuery.isEmpty()),
         onClick: handleSetView,
-        tooltip: "Add view",
+        tooltip: !(rootQuery == null ? void 0 : rootQuery.isEmpty()) ? "Can only add a view to an empty query." : "Add view",
         onTooltipOpenChange: setIsTooltipOpen
       }), /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
         icon: "nest",
@@ -35917,8 +36116,8 @@ function FieldTokenWithActions({
     }) : field.kind === "measure" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [/* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
         icon: "aggregate",
-        tooltip: "Add as aggregate",
-        disabled: !isAggregateAllowed,
+        tooltip: aggregateDisabledReason || "Add as aggregate",
+        disabled: !!aggregateDisabledReason,
         onClick: () => handleAddOperationAction("aggregate"),
         onTooltipOpenChange: setIsTooltipOpen
       }), /* @__PURE__ */ jsxRuntime.jsx(FilterPopover, {
@@ -35927,23 +36126,23 @@ function FieldTokenWithActions({
         setFilter: (filter) => handleAddOperationAction("filter", filter),
         trigger: /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
           icon: "filter",
-          tooltip: "Add as filter",
-          disabled: !isFilterAllowed,
+          tooltip: filterDisabledReason || "Add as filter",
+          disabled: !!filterDisabledReason,
           onTooltipOpenChange: setIsTooltipOpen
         }),
         onOpenChange: setIsFilterPopoverOpen
       }), /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
         icon: "orderBy",
-        tooltip: "Add as order by",
-        disabled: !isOrderByAllowed,
+        tooltip: orderByDisabledReason || "Add as order by",
+        disabled: !!orderByDisabledReason,
         onClick: () => handleAddOperationAction("orderBy"),
         onTooltipOpenChange: setIsTooltipOpen
       })]
     }) : field.kind === "dimension" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [/* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
         icon: "groupBy",
-        tooltip: "Add as group by",
-        disabled: !isGroupByAllowed,
+        tooltip: groupByDisabledReason || "Add as group by",
+        disabled: !!groupByDisabledReason,
         onClick: () => handleAddOperationAction("groupBy"),
         onTooltipOpenChange: setIsTooltipOpen
       }), /* @__PURE__ */ jsxRuntime.jsx(FilterPopover, {
@@ -35952,20 +36151,20 @@ function FieldTokenWithActions({
         setFilter: (filter) => handleAddOperationAction("filter", filter),
         trigger: /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
           icon: "filter",
-          tooltip: "Add as filter",
-          disabled: !isFilterAllowed,
+          tooltip: filterDisabledReason || "Add as filter",
+          disabled: !!filterDisabledReason,
           onTooltipOpenChange: setIsTooltipOpen
         }),
         onOpenChange: setIsFilterPopoverOpen
       }), /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
         icon: "orderBy",
-        tooltip: "Add as order by",
-        disabled: !isOrderByAllowed,
+        tooltip: orderByDisabledReason || "Add as order by",
+        disabled: !!orderByDisabledReason,
         onClick: () => handleAddOperationAction("orderBy"),
         onTooltipOpenChange: setIsTooltipOpen
       })]
     }) : null,
-    onClick: field.kind === "dimension" && isGroupByAllowed ? () => handleAddOperationAction("groupBy") : field.kind === "measure" && isAggregateAllowed ? () => handleAddOperationAction("aggregate") : field.kind === "view" ? () => handleAddView() : void 0,
+    onClick: field.kind === "dimension" && !groupByDisabledReason ? () => handleAddOperationAction("groupBy") : field.kind === "measure" && !aggregateDisabledReason ? () => handleAddOperationAction("aggregate") : field.kind === "view" ? () => handleAddView() : void 0,
     hoverActionsVisible: isFilterPopoverOpen || isTooltipOpen,
     tooltip: /* @__PURE__ */ jsxRuntime.jsx(FieldHoverCard, {
       field,