@malloydata/malloy-explorer 0.0.278-dev250515234639 → 0.0.282-dev250527225235

package/dist/esm/index.js

@@ -17,7 +17,7 @@ import { jsx, Fragment, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import React__default, { useLayoutEffect, useEffect, useMemo, useState, useRef, createElement, useContext, useCallback, createContext, memo, useReducer } from "react";
 import * as QB from "@malloydata/malloy-query-builder";
-import { ASTArrowQueryDefinition, ASTSegmentViewDefinition, ASTRefinementViewDefinition, ASTOrderByViewOperation, ASTLimitViewOperation, ASTNestViewOperation, ASTAggregateViewOperation, ASTGroupByViewOperation, ASTTimeTruncationExpression, ASTWhereViewOperation, ASTHavingViewOperation, ASTArrowViewDefinition } from "@malloydata/malloy-query-builder";
+import { ASTArrowQueryDefinition, ASTArrowViewDefinition, ASTSegmentViewDefinition, ASTNestViewOperation, ASTRefinementViewDefinition, ASTOrderByViewOperation, ASTGroupByViewOperation, ASTAggregateViewOperation, ASTLimitViewOperation, ASTTimeTruncationExpression, ASTFilterWithFilterString, ASTWhereViewOperation, ASTHavingViewOperation, ASTDrillViewOperation } from "@malloydata/malloy-query-builder";
 import { Tag } from "@malloydata/malloy-tag";
 import { TemporalFilterExpression, BooleanFilterExpression, NumberFilterExpression, StringFilterExpression } from "@malloydata/malloy-filter";
 import "@malloydata/render/webcomponent";
@@ -3324,29 +3324,105 @@ function useQueryBuilder(source, query) {
     }
   }, [source, query]);
 }
+const MalloyQueryFocusContext = /* @__PURE__ */ React.createContext({
+  focusMainView: () => {
+  },
+  isMainViewFocused: true,
+  focusNestView: () => {
+  },
+  isNestViewFocused: () => false,
+  focusedNestView: null
+});
+function MalloyQueryFocusProvider({
+  rootQuery,
+  focusedNestViewPath,
+  onFocusedNestViewPathChange,
+  children
+}) {
+  const focusedNestView = React.useMemo(() => {
+    if (focusedNestViewPath.length === 0) {
+      return null;
+    }
+    if (rootQuery) {
+      const queryDef = rootQuery.definition;
+      if (queryDef instanceof ASTArrowQueryDefinition) {
+        return findNestView(queryDef.view, [...focusedNestViewPath].reverse());
+      }
+    }
+    return null;
+  }, [rootQuery, focusedNestViewPath]);
+  const focusMainView = React.useCallback(() => {
+    onFocusedNestViewPathChange([]);
+  }, [onFocusedNestViewPathChange]);
+  const focusNestView = React.useCallback((path) => {
+    onFocusedNestViewPathChange([...path]);
+  }, [onFocusedNestViewPathChange]);
+  const isNestViewFocused = React.useCallback((path) => {
+    return JSON.stringify(path) === JSON.stringify(focusedNestViewPath);
+  }, [focusedNestViewPath]);
+  const isMainViewFocused = focusedNestViewPath.length === 0;
+  return /* @__PURE__ */ jsx(MalloyQueryFocusContext.Provider, {
+    value: {
+      focusMainView,
+      isMainViewFocused,
+      focusNestView,
+      isNestViewFocused,
+      focusedNestView
+    },
+    children
+  });
+}
+function useQueryFocus() {
+  return React.useContext(MalloyQueryFocusContext);
+}
+const findNestView = (currentView, remainingPath) => {
+  if (remainingPath.length === 0) {
+    return null;
+  }
+  if (currentView instanceof ASTArrowViewDefinition) {
+    return findNestView(currentView.view, remainingPath);
+  }
+  if (currentView instanceof ASTSegmentViewDefinition) {
+    const currentNestName = remainingPath.pop();
+    const currentNestOperation = currentView.operations.items.find((operation) => operation instanceof ASTNestViewOperation && operation.name === currentNestName);
+    if (currentNestOperation === void 0) {
+      remainingPath.push(currentNestName);
+      return null;
+    } else if (remainingPath.length === 0) {
+      return currentNestOperation.view;
+    } else {
+      return findNestView(currentNestOperation.view.definition, remainingPath);
+    }
+  }
+  if (currentView instanceof ASTRefinementViewDefinition) {
+    return findNestView(currentView.refinement, remainingPath);
+  }
+  return null;
+};
 function MalloyExplorerProvider({
   source,
   query,
-  setQuery,
+  onQueryChange,
+  focusedNestViewPath,
+  onFocusedNestViewPathChange,
   children,
   topValues
 }) {
   const rootQuery = useQueryBuilder(source, query);
-  const [currentNestView, setCurrentNestView] = React.useState(null);
-  const [currentNestQueryPanel, setCurrentNestQueryPanel] = React.useState(null);
   return /* @__PURE__ */ jsx(TooltipProvider, {
-    children: /* @__PURE__ */ jsx(QueryEditorContext.Provider, {
-      value: {
-        source,
-        rootQuery,
-        setQuery,
-        topValues,
-        currentNestQueryPanel,
-        onCurrentNestQueryPanelChange: setCurrentNestQueryPanel,
-        currentNestView,
-        onCurrentNestViewChange: setCurrentNestView
-      },
-      children
+    children: /* @__PURE__ */ jsx(MalloyQueryFocusProvider, {
+      rootQuery,
+      focusedNestViewPath,
+      onFocusedNestViewPathChange,
+      children: /* @__PURE__ */ jsx(QueryEditorContext.Provider, {
+        value: {
+          source,
+          rootQuery,
+          setQuery: onQueryChange,
+          topValues
+        },
+        children
+      })
     })
   });
 }
@@ -25863,13 +25939,14 @@ function QueryActionBar({
   const {
     rootQuery,
     setQuery,
-    source,
-    onCurrentNestQueryPanelChange,
-    onCurrentNestViewChange
+    source
   } = useContext(QueryEditorContext);
   const {
     onCollapse
   } = useContext(ResizableCollapsiblePanelContext);
+  const {
+    focusMainView
+  } = useQueryFocus();
   const isQueryEmpty = !rootQuery || rootQuery.isEmpty();
   const isRunEnabled = rootQuery == null ? void 0 : rootQuery.isRunnable();
   const onRunQuery = () => {
@@ -25877,10 +25954,6 @@ function QueryActionBar({
       runQuery(source, rootQuery.build());
     }
   };
-  const focusMainQueryPanel = () => {
-    onCurrentNestViewChange == null ? void 0 : onCurrentNestViewChange(null);
-    onCurrentNestQueryPanelChange == null ? void 0 : onCurrentNestQueryPanelChange(null);
-  };
   return /* @__PURE__ */ jsxs("div", {
     ...{
       className: "mly78zum5 mly1qughib mly6s0dn4 mlye8ttls"
@@ -25901,7 +25974,7 @@ function QueryActionBar({
       },
       children: [/* @__PURE__ */ jsx(Button, {
         onClick: () => {
-          focusMainQueryPanel();
+          focusMainView();
           setQuery == null ? void 0 : setQuery(void 0);
         },
         isDisabled: !rootQuery || (rootQuery == null ? void 0 : rootQuery.isEmpty()),
@@ -29932,6 +30005,11 @@ function getViewDefinition(parent) {
   return parent instanceof ASTArrowQueryDefinition ? parent.view : parent.definition;
 }
 function getInputSchemaFromViewParent(parent) {
+  if (!parent) {
+    return {
+      fields: []
+    };
+  }
   const definition = getViewDefinition(parent);
   return definition.getInputSchema();
 }
@@ -32382,12 +32460,54 @@ const styles$g = {
     $$css: true
   }
 };
+function toFullName(path, name) {
+  return [...path || [], name].join(".");
+}
 function segmentHasLimit(segment) {
   return segment.operations.items.find((operation) => operation instanceof ASTLimitViewOperation) !== void 0;
 }
 function segmentHasOrderBy(segment, name) {
   return segment.operations.items.find((operation) => operation instanceof ASTOrderByViewOperation && operation.name === name) !== void 0;
 }
+function getOutputNameToInputNameMap(segment) {
+  const nameMap = /* @__PURE__ */ new Map();
+  for (const operation of segment.operations.items) {
+    if (operation instanceof ASTGroupByViewOperation || operation instanceof ASTAggregateViewOperation) {
+      const reference = operation.field.getReference();
+      if (reference) {
+        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 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 ASTGroupByViewOperation || operation instanceof ASTAggregateViewOperation) {
+      const reference = operation.field.getReference();
+      if (reference) {
+        return areReferencesEqual(path, name, reference.path, reference.name);
+      } else {
+        return false;
+      }
+    }
+    return false;
+  });
+  return !!match;
+}
 function segmentNestNo(segment, name) {
   return segment.operations.items.reduce((acc, operation) => {
     if (operation instanceof ASTNestViewOperation) {
@@ -32442,6 +32562,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);
@@ -32455,6 +32588,9 @@ function addFilter(view, field, path, filter) {
   }
 }
 function getSegmentIfPresent(parent) {
+  if (!parent) {
+    return void 0;
+  }
   const definition = getViewDefinition(parent);
   if (definition instanceof ASTSegmentViewDefinition) {
     return definition;
@@ -33083,11 +33219,12 @@ function SortableOperation({
   operation,
   color
 }) {
+  var _a2;
   const {
     setQuery
   } = useContext(QueryEditorContext);
   const fieldInfo = operation.getFieldInfo();
-  const path = operation.field.getReference().path ?? NULL_PATH;
+  const path = ((_a2 = operation.field.getReference()) == null ? void 0 : _a2.path) ?? NULL_PATH;
   const {
     attributes,
     listeners,
@@ -33288,28 +33425,62 @@ const parsedToLabels = (parsed, filterString) => {
             value = stringClause.escaped_values.join(", ");
             break;
           case "=":
-            op = "is";
-            value = stringClause.values.join(", ");
+            {
+              const {
+                not,
+                values
+              } = stringClause;
+              op = not ? "is not" : "is";
+              value = values.join(", ");
+            }
             break;
           case "contains":
-            op = "contains";
-            value = stringClause.values.join(", ");
+            {
+              const {
+                not,
+                values
+              } = stringClause;
+              op = not ? "does not contain" : "contains";
+              value = values.join(", ");
+            }
             break;
           case "starts":
-            op = "starts with";
-            value = stringClause.values.join(", ");
+            {
+              const {
+                not,
+                values
+              } = stringClause;
+              op = not ? "does not start with" : "starts with";
+              value = values.join(", ");
+            }
             break;
           case "ends":
-            op = "is like";
-            value = stringClause.values.join(", ");
+            {
+              const {
+                not,
+                values
+              } = stringClause;
+              op = not ? "does not end with" : "ends with";
+              value = values.join(", ");
+            }
             break;
           case "empty":
-            op = "is empty";
-            value = "";
+            {
+              const {
+                not
+              } = stringClause;
+              op = not ? "is not empty" : "is empty";
+              value = "";
+            }
             break;
           case "null":
-            op = stringClause.not ? "is not" : "is";
-            value = "null";
+            {
+              const {
+                not
+              } = stringClause;
+              op = not ? "is not" : "is";
+              value = "null";
+            }
             break;
         }
       }
@@ -33473,22 +33644,27 @@ function SingleFilterOperation({
   rootQuery,
   filterOperation
 }) {
+  const {
+    setQuery
+  } = useContext(QueryEditorContext);
+  const setFilter = useCallback((filter2) => {
+    if (filterOperation.filter instanceof ASTFilterWithFilterString) {
+      filterOperation.filter.setFilter(filter2);
+    }
+    setQuery == null ? void 0 : setQuery(rootQuery.build());
+  }, [filterOperation.filter, rootQuery, setQuery]);
+  if (!(filterOperation.filter instanceof ASTFilterWithFilterString)) {
+    return null;
+  }
   const {
     fieldReference,
     filterString
   } = filterOperation.filter;
   const filter = filterOperation.filter.getFilter();
   const fieldInfo = fieldReference.getFieldInfo();
-  const {
-    setQuery
-  } = useContext(QueryEditorContext);
   if (fieldInfo.kind !== "dimension" && fieldInfo.kind !== "measure") {
     throw new Error(`Invalid filter field kind: ${fieldInfo.kind}`);
   }
-  const setFilter = useCallback((filter2) => {
-    filterOperation.filter.setFilter(filter2);
-    setQuery == null ? void 0 : setQuery(rootQuery.build());
-  }, [filterOperation.filter, rootQuery, setQuery]);
   const {
     op,
     value
@@ -34099,6 +34275,35 @@ const styles$d = {
     $$css: true
   }
 };
+const NestViewPathContext = /* @__PURE__ */ React__default.createContext([]);
+function FocusableView({
+  children,
+  nest
+}) {
+  const {
+    focusNestView,
+    focusMainView
+  } = useQueryFocus();
+  const parentNestViewPath = useContext(NestViewPathContext);
+  return /* @__PURE__ */ jsx("div", {
+    onPointerDown: (e) => {
+      e.stopPropagation();
+      if (nest) {
+        focusNestView([...parentNestViewPath, nest.name]);
+      } else {
+        focusMainView();
+      }
+    },
+    children: nest ? /* @__PURE__ */ jsx(NestViewPathContext.Provider, {
+      value: [...parentNestViewPath, nest.name],
+      children: /* @__PURE__ */ jsx("div", {
+        children
+      })
+    }) : /* @__PURE__ */ jsx("div", {
+      children
+    })
+  });
+}
 function NestOperations({
   rootQuery,
   view,
@@ -34122,31 +34327,14 @@ function NestOperation({
   nest
 }) {
   const {
-    setQuery,
-    currentNestQueryPanel,
-    onCurrentNestQueryPanelChange,
-    onCurrentNestViewChange
+    setQuery
   } = useContext(QueryEditorContext);
   const [renameOpen, setRenameOpen] = useState(false);
-  const panelRef = React.useRef(null);
-  const isCurrentNestQueryPanelFocused = currentNestQueryPanel !== null && panelRef.current == currentNestQueryPanel;
-  React.useEffect(() => {
-    if (isCurrentNestQueryPanelFocused) {
-      onCurrentNestViewChange == null ? void 0 : onCurrentNestViewChange(nest.view);
-    }
-  }, [nest, isCurrentNestQueryPanelFocused, onCurrentNestViewChange]);
-  const focusCurrentNestQueryPanel = () => {
-    onCurrentNestQueryPanelChange == null ? void 0 : onCurrentNestQueryPanelChange(panelRef.current);
-    onCurrentNestViewChange == null ? void 0 : onCurrentNestViewChange(nest.view);
-  };
-  const focusParentQueryPanel = () => {
-    const currentPanel = panelRef.current;
-    const parent = findParentNestQueryPanel(currentPanel);
-    onCurrentNestQueryPanelChange == null ? void 0 : onCurrentNestQueryPanelChange(parent);
-    if (parent === null) {
-      onCurrentNestViewChange == null ? void 0 : onCurrentNestViewChange(null);
-    }
-  };
+  const parentNestViewPath = useContext(NestViewPathContext);
+  const {
+    focusNestView,
+    isNestViewFocused
+  } = useQueryFocus();
   const getControls = (nest2) => /* @__PURE__ */ jsxs(Fragment, {
     children: [/* @__PURE__ */ jsxs(DropdownMenu, {
       trigger: /* @__PURE__ */ jsx(Button, {
@@ -34159,7 +34347,7 @@ function NestOperation({
         icon: "clear",
         label: "Delete Query",
         onClick: () => {
-          focusParentQueryPanel();
+          focusNestView([...parentNestViewPath]);
           nest2.delete();
           setQuery == null ? void 0 : setQuery(rootQuery.build());
         }
@@ -34174,21 +34362,19 @@ function NestOperation({
       view: nest2.view
     })]
   });
-  return /* @__PURE__ */ jsx("div", {
-    ...{
-      className: "mlyj3b58b mly1yf7rl7 mly1xmf6yo mlyh8yej3"
-    },
+  return /* @__PURE__ */ jsx(FocusableView, {
+    nest,
     children: /* @__PURE__ */ jsxs("div", {
-      ref: panelRef,
-      onPointerDownCapture: focusCurrentNestQueryPanel,
-      "data-nest-panel": true,
+      ...{
+        className: "mlyj3b58b mly1yf7rl7 mly1xmf6yo mlyh8yej3"
+      },
       children: [/* @__PURE__ */ jsx(CollapsiblePanel, {
         title: nest.name,
         icon: viewToVisualizationIcon(nest.view),
         defaultOpen: true,
         controls: getControls(nest),
         collapsedControls: getControls(nest),
-        isFocused: isCurrentNestQueryPanelFocused,
+        isFocused: isNestViewFocused([...parentNestViewPath, nest.name]),
         children: /* @__PURE__ */ jsx(View, {
           rootQuery,
           view: nest.view
@@ -34200,14 +34386,8 @@ function NestOperation({
         open: renameOpen,
         setOpen: setRenameOpen
       })]
-    })
-  }, nest.name);
-}
-function findParentNestQueryPanel(element2) {
-  if (!element2 || !element2.parentElement) return null;
-  const parentElement = element2.parentElement;
-  if (parentElement.dataset.nestPanel !== void 0) return parentElement;
-  return findParentNestQueryPanel(parentElement);
+    }, nest.name)
+  });
 }
 function Operations({
   rootQuery,
@@ -34237,7 +34417,8 @@ function Operations({
       orderBys.push(operation);
     } else if (operation instanceof ASTNestViewOperation) {
       nests.push(operation);
-    } else {
+    } else if (operation instanceof ASTDrillViewOperation) ;
+    else {
       limit = operation;
     }
   });
@@ -34376,19 +34557,13 @@ function Query({
   setQuery
 }) {
   const {
-    currentNestQueryPanel,
-    onCurrentNestQueryPanelChange,
-    onCurrentNestViewChange
-  } = React.useContext(QueryEditorContext);
-  const focusMainQueryPanel = () => {
-    onCurrentNestQueryPanelChange == null ? void 0 : onCurrentNestQueryPanelChange(null);
-    onCurrentNestViewChange == null ? void 0 : onCurrentNestViewChange(null);
-  };
-  return /* @__PURE__ */ jsx("div", {
-    onPointerDownCapture: focusMainQueryPanel,
+    focusMainView,
+    isMainViewFocused
+  } = useQueryFocus();
+  return /* @__PURE__ */ jsx(FocusableView, {
     children: /* @__PURE__ */ jsxs(CollapsiblePanel, {
       title: "Main query",
-      isFocused: !currentNestQueryPanel,
+      isFocused: isMainViewFocused,
       controls: /* @__PURE__ */ jsxs(Fragment, {
         children: [/* @__PURE__ */ jsx(DropdownMenu, {
           trigger: /* @__PURE__ */ jsx(Button, {
@@ -34402,7 +34577,7 @@ function Query({
               icon: "clear",
               label: "Clear query",
               onClick: () => {
-                focusMainQueryPanel();
+                focusMainView();
                 setQuery == null ? void 0 : setQuery(void 0);
               },
               disabled: rootQuery.isEmpty()
@@ -35896,62 +36071,83 @@ const FIELD_KIND_TO_TITLE = {
   dimension: "Dimensions"
 };
 function useOperations(view, field, path) {
-  const dimensionFields = useMemo(() => {
+  const fullName = toFullName(path, field.name);
+  const flattenedFields = useMemo(() => {
     const {
       fields
     } = getInputSchemaFromViewParent(view);
-    return new Set(flattenFieldsTree(fields).filter(({
-      field: field2
-    }) => field2.kind === "dimension").map(({
-      field: field2
-    }) => field2.name));
-  }, [view]);
-  const measureFields = useMemo(() => {
-    const {
-      fields
-    } = getInputSchemaFromViewParent(view);
-    return new Set(flattenFieldsTree(fields).filter(({
-      field: field2
-    }) => field2.kind === "measure").map(({
-      field: field2
-    }) => field2.name));
-  }, [view]);
-  const isGroupByAllowed = 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 = 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 = 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 = 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 = 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 = 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 = 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 = 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"];
@@ -35963,27 +36159,29 @@ function FieldTokenWithActions({
 }) {
   const {
     rootQuery,
-    setQuery,
-    currentNestView
+    setQuery
   } = React__default.useContext(QueryEditorContext);
-  const view = currentNestView ?? viewDef;
   const {
-    isGroupByAllowed,
-    isAggregateAllowed,
-    isFilterAllowed,
-    isOrderByAllowed
+    focusedNestView
+  } = useQueryFocus();
+  const view = focusedNestView ?? viewDef;
+  const {
+    groupByDisabledReason,
+    aggregateDisabledReason,
+    filterDisabledReason,
+    orderByDisabledReason
   } = useOperations(view, field, path);
   const [isFilterPopoverOpen, setIsFilterPopoverOpen] = useState();
   const [isTooltipOpen, setIsTooltipOpen] = 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());
@@ -36008,7 +36206,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__ */ jsx(ActionButton, {
         icon: "nest",
@@ -36019,8 +36217,8 @@ function FieldTokenWithActions({
     }) : field.kind === "measure" ? /* @__PURE__ */ jsxs(Fragment, {
       children: [/* @__PURE__ */ jsx(ActionButton, {
         icon: "aggregate",
-        tooltip: "Add as aggregate",
-        disabled: !isAggregateAllowed,
+        tooltip: aggregateDisabledReason || "Add as aggregate",
+        disabled: !!aggregateDisabledReason,
         onClick: () => handleAddOperationAction("aggregate"),
         onTooltipOpenChange: setIsTooltipOpen
       }), /* @__PURE__ */ jsx(FilterPopover, {
@@ -36029,23 +36227,23 @@ function FieldTokenWithActions({
         setFilter: (filter) => handleAddOperationAction("filter", filter),
         trigger: /* @__PURE__ */ jsx(ActionButton, {
           icon: "filter",
-          tooltip: "Add as filter",
-          disabled: !isFilterAllowed,
+          tooltip: filterDisabledReason || "Add as filter",
+          disabled: !!filterDisabledReason,
           onTooltipOpenChange: setIsTooltipOpen
         }),
         onOpenChange: setIsFilterPopoverOpen
       }), /* @__PURE__ */ 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__ */ jsxs(Fragment, {
       children: [/* @__PURE__ */ 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__ */ jsx(FilterPopover, {
@@ -36054,20 +36252,26 @@ function FieldTokenWithActions({
         setFilter: (filter) => handleAddOperationAction("filter", filter),
         trigger: /* @__PURE__ */ jsx(ActionButton, {
           icon: "filter",
-          tooltip: "Add as filter",
-          disabled: !isFilterAllowed,
+          tooltip: filterDisabledReason || "Add as filter",
+          disabled: !!filterDisabledReason,
           onTooltipOpenChange: setIsTooltipOpen
         }),
         onOpenChange: setIsFilterPopoverOpen
       }), /* @__PURE__ */ 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" ? () => {
+      if (rootQuery == null ? void 0 : rootQuery.isEmpty()) {
+        handleSetView();
+      } else {
+        handleAddView();
+      }
+    } : void 0,
     hoverActionsVisible: isFilterPopoverOpen || isTooltipOpen,
     tooltip: /* @__PURE__ */ jsx(FieldHoverCard, {
       field,