@datawheel/data-explorer 0.2.3 → 0.2.4

package/dist/main.js

@@ -1,4 +1,4 @@
-import { keyframes, createStyles, Select, rem, Flex, Title, Text, Group, Button, Box, Anchor, Input, Stack, SimpleGrid, ScrollArea, Table, MultiSelect, Center, Alert, Loader, Modal, NumberInput, Menu, ActionIcon, useMantineTheme, MantineProvider, Paper, useComponentDefaultProps, Switch, ThemeIcon, Tooltip, Tabs, CloseButton, Drawer, Checkbox, UnstyledButton, TextInput, Accordion, Popover, Divider } from '@mantine/core';
+import { keyframes, createStyles, Select, rem, Flex, Title, Text, Group, Button, Box, Anchor, Input, Stack, SimpleGrid, ScrollArea, LoadingOverlay, Table, MultiSelect, Center, Alert, Loader, Modal, NumberInput, Menu, ActionIcon, useMantineTheme, MantineProvider, Paper, useComponentDefaultProps, Switch, ThemeIcon, Tooltip, Tabs, CloseButton, Drawer, Checkbox, UnstyledButton, TextInput, Accordion, Popover, Divider } from '@mantine/core';
 import { useClipboard, useClickOutside, useFullscreen, useMediaQuery, useDebouncedValue, useDisclosure } from '@mantine/hooks';
 import { Prism } from '@mantine/prism';
 import { IconWorld, IconExternalLink, IconClipboard, IconAlertCircle, IconAlertTriangle, IconSettings, IconMathGreater, IconMathLower, IconArrowsLeftRight, IconCopy, IconDownload, IconDotsVertical, IconArrowsMinimize, IconArrowsMaximize, IconInfoCircleFilled, IconTrash, IconSearch, IconPhotoDown, IconVectorTriangle, IconStack3, IconFilterOff, IconFilter, IconArrowsSort, IconSortDescendingNumbers, IconSortDescendingLetters, IconSortAscendingNumbers, IconSortAscendingLetters, IconLanguage } from '@tabler/icons-react';
@@ -913,8 +913,8 @@ var queriesSlice = createSlice({
       delete query.params.drilldowns[action.payload];
     },
     /**
-      * Remove a single DrilldownItem from the current QueryItem.
-    */
+     * Remove a single DrilldownItem from the current QueryItem.
+     */
     removeMeasure(state, action) {
       const query = taintCurrentQuery(state);
       delete query.params.measures[action.payload];
@@ -1002,14 +1002,14 @@ var queriesSlice = createSlice({
      */
     updateCut(state, { payload }) {
       const query = taintCurrentQuery(state);
-      query.params.cuts[payload.fullName] = payload;
+      query.params.cuts[payload.key] = payload;
     },
     /**
      * Replaces a single DrilldownItem in the current QueryItem.
      */
     updateDrilldown(state, { payload }) {
       const query = taintCurrentQuery(state);
-      query.params.drilldowns[payload.fullName] = payload;
+      query.params.drilldowns[payload.key] = payload;
     },
     /**
      * Replaces a single FilterItem in the current QueryItem.
@@ -1083,10 +1083,7 @@ var selectCurrentQueryParams = createSelector(
   selectCurrentQueryItem,
   (query) => query.params
 );
-var selectCubeName = createSelector(
-  selectCurrentQueryParams,
-  (params) => params.cube
-);
+var selectCubeName = createSelector(selectCurrentQueryParams, (params) => params.cube);
 var selectLocale = createSelector(
   [selectCurrentQueryParams, selectServerState],
   (params, server) => {
@@ -1098,10 +1095,7 @@ var selectLocale = createSelector(
     };
   }
 );
-var selectCutMap = createSelector(
-  selectCurrentQueryParams,
-  (params) => params.cuts
-);
+var selectCutMap = createSelector(selectCurrentQueryParams, (params) => params.cuts);
 createSelector(selectCutMap, getKeys);
 var selectCutItems = createSelector(selectCutMap, getValues);
 var selectDrilldownMap = createSelector(
@@ -1110,34 +1104,25 @@ var selectDrilldownMap = createSelector(
 );
 createSelector(selectDrilldownMap, getKeys);
 var selectDrilldownItems = createSelector(selectDrilldownMap, getValues);
-var selectFilterMap = createSelector(
-  selectCurrentQueryParams,
-  (params) => params.filters
-);
+var selectFilterMap = createSelector(selectCurrentQueryParams, (params) => params.filters);
 createSelector(selectFilterMap, getKeys);
 var selectFilterItems = createSelector(selectFilterMap, getValues);
-var selectMeasureMap = createSelector(
-  selectCurrentQueryParams,
-  (params) => params.measures
-);
+var selectMeasureMap = createSelector(selectCurrentQueryParams, (params) => params.measures);
 createSelector(selectMeasureMap, getKeys);
 var selectMeasureItems = createSelector(selectMeasureMap, getValues);
-createSelector(
-  selectCurrentQueryParams,
-  (params) => params.booleans
-);
+createSelector(selectCurrentQueryParams, (params) => params.booleans);
 var selectIsPreviewMode = createSelector(
   selectCurrentQueryParams,
   (params) => params.isPreview
 );
-var selectPaginationParams = createSelector(
-  selectCurrentQueryParams,
-  (params) => ({ limit: params.pagiLimit || 0, offset: params.pagiOffset || 0 })
-);
-createSelector(
-  selectCurrentQueryParams,
-  (params) => ({ sortKey: params.sortKey || "", sortDir: params.sortDir })
-);
+var selectPaginationParams = createSelector(selectCurrentQueryParams, (params) => ({
+  limit: params.pagiLimit || 0,
+  offset: params.pagiOffset || 0
+}));
+createSelector(selectCurrentQueryParams, (params) => ({
+  sortKey: params.sortKey || "",
+  sortDir: params.sortDir
+}));
 createSelector(
   selectCurrentQueryParams,
   (params) => isValidQueryVerbose(params)
@@ -1574,6 +1559,7 @@ function calcMaxMemberCount(query, params, dispatch) {
           memberCount: members.length,
           members
         };
+        dispatch(actions.updateDrilldown(buildDrilldown({ ...ddd, key: stringifyName(ddd) })));
         createCutHandler(params.cuts, ddd, dispatch);
       }
       return members.length;
@@ -1590,7 +1576,7 @@ function hydrateDrilldownProperties(cube, drilldownItem) {
     if (level.matches(drilldownItem)) {
       return buildDrilldown({
         ...drilldownItem,
-        key: stringifyName(drilldownItem),
+        // key: stringifyName(drilldownItem),
         fullName: level.fullName,
         uniqueName: level.uniqueName,
         dimType: level.dimension.dimensionType,
@@ -3172,7 +3158,7 @@ function useTableData({ columns, filters, cuts, pagination }) {
     const handler = debounce(() => {
       const term = [columnsStr, filterKey, cutKey, page];
       setDebouncedTerm(term);
-    }, 700);
+    }, 800);
     handler();
     return () => handler.cancel();
   }, [columnsStr, filterKey, cutKey, page, enabled]);
@@ -3284,7 +3270,9 @@ function useTable({
   }, [measuresMap, measuresOlap, filtersMap, filterItems]);
   const { isLoading, isFetching, isError, data, isPlaceholderData } = useTableData({
     columns: finalUniqueKeys,
-    filters: filterItems.filter(isActiveItem),
+    filters: filterItems.filter(
+      (f) => isActiveItem(f) && isActiveItem(measures.find((m) => m.name === f.measure) || { active: false })
+    ),
     cuts: itemsCuts.filter(isActiveCut),
     pagination
   });
@@ -3495,9 +3483,9 @@ function useTable({
     ...constTableProps,
     ...mantineTableProps
   });
-  return { table, isError, isLoading, data: tableData };
+  return { table, isError, isLoading, data: tableData, columns };
 }
-function TableView({ table, result, isError, isLoading, data }) {
+function TableView({ table, result, isError, isLoading = false, data, columns }) {
   const isData = Boolean(table.getRowModel().rows.length);
   return /* @__PURE__ */ React10__default.createElement(Box, { sx: { height: "100%" } }, /* @__PURE__ */ React10__default.createElement(Flex, { direction: "column", justify: "space-between", sx: { height: "100%", flex: "1 1 auto" } }, /* @__PURE__ */ React10__default.createElement(MRT_ProgressBar, { isTopToolbar: false, table }), /* @__PURE__ */ React10__default.createElement(
     ScrollArea,
@@ -3509,6 +3497,7 @@ function TableView({ table, result, isError, isLoading, data }) {
         overflow: "scroll"
       }
     },
+    /* @__PURE__ */ React10__default.createElement(LoadingOverlay, { visible: columns.length === 0 && isLoading }),
     /* @__PURE__ */ React10__default.createElement(
       Table,
       {
@@ -3871,7 +3860,7 @@ function SuccessResult(props) {
   const { previewLimit, actions: actions2 } = useSettings();
   const queryItem = useSelector$1(selectCurrentQueryItem);
   const isPreviewMode = useSelector$1(selectIsPreviewMode);
-  const { table, isError, isLoading, data } = useTable({ cube, result });
+  const { table, isError, isLoading, data, columns } = useTable({ cube, result });
   const fullscreen = useFullscreen();
   const [CurrentComponent, panelKey, panelMeta] = useMemo(() => {
     const currentPanel = queryItem.panel || `${panels[0].key}-`;
@@ -3904,7 +3893,8 @@ function SuccessResult(props) {
       table,
       isError,
       isLoading,
-      data
+      data,
+      columns
     }
   )))))));
 }
@@ -4186,7 +4176,7 @@ function LocaleSelector() {
 var [useSideBar, Provider] = createContext2("SideBar");
 function SideBarProvider(props) {
   const [input, setInput] = useState("");
-  const [expanded, setExpanded] = useState(false);
+  const [expanded, setExpanded] = useState(true);
   const [results, setResults] = useState([]);
   const [map, setMap] = useState();
   const [graph, setGraph] = useState(new graph_default());
@@ -6627,7 +6617,6 @@ function createVizbuilderView(settings) {
   return VizbuilderView;
   function VizbuilderView(props) {
     const { cube, panelKey, params, result } = props;
-    console.log(result);
     const { actions: actions2, formatters } = useSettings();
     const [panelName, currentChart] = useMemo(() => `${panelKey || ""}-`.split("-"), [panelKey]);
     const resetCurrentPanel = useCallback(() => {
@@ -6638,7 +6627,7 @@ function createVizbuilderView(settings) {
         [
           {
             cube,
-            dataset: result.data.data,
+            dataset: result.data,
             params: {
               locale: params.locale || defaultLocale,
               booleans: params.booleans,
@@ -6671,7 +6660,7 @@ function createVizbuilderView(settings) {
         ],
         chartGenOptions
       ),
-      [cube, result.data.data, params]
+      [cube, result.data, params]
     );
     const content = useMemo(() => {
       const isSingleChart = charts.length === 1;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@datawheel/data-explorer",
-  "version": "0.2.3",
+  "version": "0.2.4",
   "exports": {
     ".": {
       "import": "./dist/main.js"