@cubejs-client/playground 1.1.12 → 1.1.17

package/lib/QueryBuilderV2/hooks/query-builder.js

@@ -1,12 +1,37 @@
 import { useEffect, useMemo, useRef, useState } from 'react';
-import { ResultSet, validateQuery, } from '@cubejs-client/core';
-import { extractMembersFromFilters, getUsedCubesAndMembers, getQueryHash, movePivotItem, prepareQuery, useIsFirstRender, } from '../utils';
+import { ResultSet, } from '@cubejs-client/core';
+import { extractMembersFromFilters, getUsedCubesAndMembers, getQueryHash, movePivotItem, prepareQuery, useIsFirstRender, validateQuery, } from '../utils';
 import { useEvent } from './event';
 const SIMPLE_MEMBERS = ['dimensions', 'measures', 'segments'];
+const removeFiltersByMember = (filters, memberName) => {
+    if (!Array.isArray(filters) || !filters.length) {
+        return [];
+    }
+    return filters
+        .map((filter) => {
+        // If it's a logical filter, process its subfilters
+        if ('and' in filter || 'or' in filter) {
+            const key = 'and' in filter ? 'and' : 'or';
+            const sanitizedSubFilters = removeFiltersByMember('and' in filter ? filter.and : filter.or, memberName);
+            // If all subfilters are removed, return null
+            if (sanitizedSubFilters.length === 0) {
+                return null;
+            }
+            // Return the logical filter with sanitized subfilters
+            return { [key]: sanitizedSubFilters };
+        }
+        // If it's a unary or binary filter, check its member
+        if ('member' in filter && filter.member === memberName) {
+            return null; // Remove the filter
+        }
+        return filter; // Keep the filter
+    })
+        .filter(Boolean); // Remove null values
+};
 export function useQueryBuilder(props) {
     const mutexRef = useRef({});
     const firstRun = useIsFirstRender();
-    let { cubeApi, schemaVersion, defaultChartType, defaultQuery, defaultPivotConfig, tracking, queryValidator, onQueryChange, } = props;
+    let { cubeApi, schemaVersion, defaultChartType, defaultQuery, defaultPivotConfig, tracking, queryValidator, displayPrivateItems = true, memberViewType = 'name', onQueryChange, } = props;
     function queryValidation(query) {
         let validatedQuery = validateQuery(query);
         prepareQuery(validatedQuery);
@@ -68,7 +93,33 @@ export function useQueryBuilder(props) {
     const progressCallback = (progressResult) => {
         setProgress(progressResult);
     };
-    const { usedCubes, usedMembers } = getUsedCubesAndMembers(query);
+    const { usedCubes, usedMembers, usedMembersInFilters, usedMembersInGrouping, usedGranularities } = useMemo(() => getUsedCubesAndMembers(query, dateRangesStore), [query, dateRangesStore.join()]);
+    const [missingCubes, missingMembers] = useMemo(() => {
+        return [
+            usedCubes.filter((cube) => !cubes.some((c) => c.name === cube)),
+            [
+                ...(query.dimensions
+                    ?.filter((dimension) => !members.dimensions[dimension])
+                    .map((name) => ({ name, category: 'dimensions' })) || []),
+                ...(query.measures
+                    ?.filter((measure) => !members.measures[measure])
+                    .map((name) => ({ name, category: 'measures' })) || []),
+                ...(query.segments
+                    ?.filter((segment) => !members.segments[segment])
+                    .map((name) => ({ name, category: 'segments' })) || []),
+                ...(query.timeDimensions
+                    ?.filter((timeDimension) => !members.dimensions[timeDimension.dimension])
+                    .map(({ dimension, granularity }) => ({
+                    name: dimension,
+                    category: 'timeDimensions',
+                    granularity,
+                })) || []),
+                ...(usedMembersInFilters
+                    .filter((dimension) => !members.dimensions[dimension] && !members.measures[dimension])
+                    .map((name) => ({ name, category: 'dimensions' })) || []),
+            ],
+        ];
+    }, [usedCubes, usedMembers, meta]);
     // place joined cubes first
     cubes.sort((c1, c2) => {
         const c1joined = isCubeUsed(c1.name);
@@ -124,7 +175,13 @@ export function useQueryBuilder(props) {
         loadingRef.current++;
         setIsLoading(false);
         setQuery({});
+        setExecutedQuery(null);
+        setResultSet(null);
         setDateRangesStore([]);
+        setError(null);
+        selectCubeName(null);
+        setError(null);
+        setVerificationError(null);
     }
     function loadMeta() {
         const currentRequest = ++metaLoadingRef.current;
@@ -132,12 +189,15 @@ export function useQueryBuilder(props) {
             return;
         }
         setIsMetaLoading(true);
-        cubeApi
+        return cubeApi
             .meta()
             .then((newMeta) => {
             if (currentRequest !== metaLoadingRef.current) {
                 return;
             }
+            const visibilityFilter = (item) => {
+                return !displayPrivateItems ? item.public : true;
+            };
             setIsMetaLoading(false);
             setMeta(newMeta);
             const memberData = {
@@ -145,21 +205,34 @@ export function useQueryBuilder(props) {
                 measures: {},
                 segments: {},
             };
-            newMeta.meta.cubes.forEach((cube) => {
-                cube.dimensions.forEach((dimension) => {
+            newMeta.meta.cubes.filter(visibilityFilter).forEach((cube) => {
+                cube.dimensions.filter(visibilityFilter).forEach((dimension) => {
                     memberData.dimensions[dimension.name] = dimension;
                 });
-                cube.measures.forEach((measure) => {
+                cube.measures.filter(visibilityFilter).forEach((measure) => {
                     memberData.measures[measure.name] = measure;
                 });
-                cube.segments.forEach((segment) => {
+                cube.segments.filter(visibilityFilter).forEach((segment) => {
                     memberData.segments[segment.name] = segment;
                 });
             });
             setMembers(memberData);
-            setCubes(newMeta.meta.cubes.sort((a, b) => a.name.localeCompare(b.name)));
+            setCubes(newMeta.meta.cubes
+                .filter(visibilityFilter)
+                .map((cube) => {
+                return {
+                    ...cube,
+                    measures: cube.measures.filter(visibilityFilter),
+                    dimensions: cube.dimensions.filter(visibilityFilter),
+                    segments: cube.segments.filter(visibilityFilter),
+                };
+            })
+                .sort((a, b) => a.name.localeCompare(b.name)));
         })
             .catch((error) => {
+            if (currentRequest !== metaLoadingRef.current) {
+                return;
+            }
             setIsMetaLoading(false);
             setMetaError(error.response?.plainError?.trim() || String(error));
             setRichMetaError(error);
@@ -167,7 +240,6 @@ export function useQueryBuilder(props) {
         });
     }
     function dryRun() {
-        setVerificationError(null);
         const currentRequest = ++verificationRef.current;
         if (!meta || !cubeApi || !usedCubes.length) {
             return;
@@ -179,6 +251,7 @@ export function useQueryBuilder(props) {
             if (currentRequest !== verificationRef.current) {
                 return;
             }
+            setVerificationError(null);
             setIsVerifying(false);
             setDryRunResponse(dryRunResponse);
             setPivotConfig(ResultSet.getNormalizedPivotConfig(dryRunResponse.pivotQuery, pivotConfig));
@@ -224,13 +297,6 @@ export function useQueryBuilder(props) {
                         ...queryPart,
                     });
                 }
-                Object.keys(query).forEach((key) => {
-                    if (query[key] == null ||
-                        (Array.isArray(query[key]) && query[key]?.length === 0) ||
-                        (typeof query[key] === 'object' && Object.keys(query[key]).length === 0)) {
-                        delete query[key];
-                    }
-                });
                 return originalHash !== getQueryHash(query) ? query : originalQuery;
             }
             catch (e) {
@@ -253,10 +319,37 @@ export function useQueryBuilder(props) {
         if (!member || !('format' in member)) {
             return null;
         }
-        // @TODO update typings to support format
-        // @ts-ignore
         return member.format;
     }
+    // Find all dimensions inside hierarchies that can be added alongside the given dimension.
+    const getConnectedDimensionNames = useEvent((name) => {
+        const names = [name];
+        const cubeName = name.split('.')[0];
+        const cube = getCubeByName(cubeName);
+        if (cube) {
+            // Find all hierarchies that include the given dimension
+            const hierarchiesToFill = (cube.hierarchies ?? []).filter((hierarchy) => {
+                return hierarchy.levels.includes(name);
+            });
+            // If there is only one hierarchy that can be filled, we can add all levels that are above the given dimension
+            if (hierarchiesToFill.length === 1) {
+                const levels = hierarchiesToFill[0].levels;
+                // If no dimension in the hierarchy selected, then we can proceed
+                if (!levels.some((dimensionName) => query.dimensions?.includes(dimensionName))) {
+                    levels
+                        .slice(0, levels.indexOf(name))
+                        .reverse()
+                        .forEach((otherName) => {
+                        if (names.includes(otherName)) {
+                            return names;
+                        }
+                        names.push(otherName);
+                    });
+                }
+            }
+        }
+        return names;
+    });
     // Updaters with simple common logic for dimensions, measures and segments
     const simpleUpdaters = SIMPLE_MEMBERS.reduce((acc, type) => {
         acc[type] = {
@@ -266,11 +359,17 @@ export function useQueryBuilder(props) {
                     console.log(`Unable to add ${type.slice(0, -1)}. Member is not found`, name);
                     return false;
                 }
+                let names;
+                if (type === 'dimensions') {
+                    names = getConnectedDimensionNames(name);
+                }
                 updateQuery((query) => {
                     const list = query[type] || [];
-                    if (!list?.includes(name)) {
-                        list.push(name);
-                    }
+                    names.forEach((name) => {
+                        if (!list?.includes(name)) {
+                            list.push(name);
+                        }
+                    });
                     return { [type]: list };
                 });
                 return true;
@@ -296,7 +395,12 @@ export function useQueryBuilder(props) {
                             console.log(`Unable to toggle ${type.slice(0, -1)}. Member is not found`, name);
                             return;
                         }
-                        list.push(name);
+                        if (type === 'dimensions') {
+                            list.push(...getConnectedDimensionNames(name));
+                        }
+                        else {
+                            list.push(name);
+                        }
                     }
                     else {
                         list.splice(index, 1);
@@ -305,6 +409,13 @@ export function useQueryBuilder(props) {
                 });
                 return true;
             },
+            clear() {
+                updateQuery(() => {
+                    return {
+                        [type]: [],
+                    };
+                });
+            },
             get list() {
                 return query[type] || [];
             },
@@ -408,6 +519,13 @@ export function useQueryBuilder(props) {
                 return { timeDimensions: reordered };
             });
         },
+        clear() {
+            updateQuery((query) => {
+                return {
+                    timeDimensions: query.timeDimensions?.filter((d) => !d.granularity),
+                };
+            });
+        },
     };
     const dateRanges = {
         set(name, dateRange) {
@@ -466,6 +584,14 @@ export function useQueryBuilder(props) {
         get list() {
             return dateRangesStore;
         },
+        clear() {
+            updateQuery((query) => {
+                return {
+                    timeDimensions: query.timeDimensions?.filter((d) => !d.dateRange),
+                };
+            });
+            setDateRangesStore([]);
+        },
     };
     const order = {
         set(name, order) {
@@ -536,6 +662,13 @@ export function useQueryBuilder(props) {
             const orderMap = (query.order || {});
             return Object.keys(orderMap);
         },
+        clear() {
+            updateQuery(() => {
+                return {
+                    order: undefined,
+                };
+            });
+        },
     };
     const filters = {
         add(filter) {
@@ -569,11 +702,8 @@ export function useQueryBuilder(props) {
         },
         removeByMember(name) {
             updateQuery((query) => {
-                return {
-                    filters: (query?.filters || []).filter((filter) => {
-                        return !('member' in filter) || filter.member !== name;
-                    }),
-                };
+                const filters = query.filters || [];
+                return { filters: removeFiltersByMember(filters, name) };
             });
             return true;
         },
@@ -590,6 +720,13 @@ export function useQueryBuilder(props) {
         get list() {
             return query?.filters || [];
         },
+        clear() {
+            updateQuery(() => {
+                return {
+                    filters: [],
+                };
+            });
+        },
     };
     // UI state management
     useEffect(() => {
@@ -616,7 +753,7 @@ export function useQueryBuilder(props) {
         if (executedQuery) {
             setIsDataModelChanged(true);
         }
-    }, [schemaVersion]);
+    }, [schemaVersion, cubeApi]);
     // After time dimensions updated...
     useEffect(() => {
         let updateDateRanges = false;
@@ -643,7 +780,7 @@ export function useQueryBuilder(props) {
     }, [JSON.stringify(query.timeDimensions), JSON.stringify(dateRangesStore)]);
     // Each time schema is changed we need to reload meta
     useEffect(() => {
-        loadMeta();
+        void loadMeta();
     }, [schemaVersion, cubeApi]);
     const isQueryEmpty = !query.measures?.length &&
         !query.dimensions?.length &&
@@ -653,7 +790,10 @@ export function useQueryBuilder(props) {
     // @ts-ignore
     const connectionId = usedCubes[0]
         ? // @ts-ignore
-            getCubeByName(usedCubes[0])?.connectedComponent
+            (() => {
+                const cubeName = usedCubes.find((cubeName) => getCubeByName(cubeName)?.connectedComponent);
+                return cubeName ? getCubeByName(cubeName)?.connectedComponent : undefined;
+            })()
         : undefined;
     // @ts-ignore
     const joinableCubes = !usedCubes.length
@@ -661,6 +801,18 @@ export function useQueryBuilder(props) {
         : cubes.filter((cube) => 
         // @ts-ignore
         connectionId != null ? cube.connectedComponent === connectionId : cube.name === usedCubes[0]);
+    const joinableCubeNames = joinableCubes.map((cube) => cube.name);
+    const joinableMembers = useMemo(() => !usedCubes.length
+        ? {
+            dimensions: members.dimensions,
+            measures: members.measures,
+            segments: members.segments,
+        }
+        : {
+            dimensions: Object.fromEntries(Object.entries(members.dimensions).filter(([name]) => joinableCubeNames.includes(name.split('.')[0]))),
+            measures: Object.fromEntries(Object.entries(members.measures).filter(([name]) => joinableCubeNames.includes(name.split('.')[0]))),
+            segments: Object.fromEntries(Object.entries(members.segments).filter(([name]) => joinableCubeNames.includes(name.split('.')[0]))),
+        }, [joinableCubeNames.join(',')]);
     const updatePivotConfig = {
         moveItem: ({ sourceIndex, destinationIndex, sourceAxis, destinationAxis, }) => {
             setPivotConfig(ResultSet.getNormalizedPivotConfig({ ...query, queryType: 'regularQuery' }, {
@@ -701,40 +853,49 @@ export function useQueryBuilder(props) {
                 dimensions: [],
                 segments: [],
                 filters: [],
+                folders: {},
+                hierarchies: {},
                 dateRanges: [],
                 grouping: [],
                 timeDimensions: [],
                 instance: cube,
+                isUsed: false,
             };
             const cubePrefix = `${cubeName}.`;
             measures?.forEach((measure) => {
                 if (measure.includes(cubePrefix)) {
                     stats.measures.push(measure);
+                    stats.isUsed = true;
                 }
             });
             dimensions?.forEach((dimension) => {
                 if (dimension.includes(cubePrefix)) {
                     stats.dimensions.push(dimension);
+                    stats.isUsed = true;
                 }
             });
             segments?.forEach((segment) => {
                 if (segment.includes(cubePrefix)) {
                     stats.segments.push(segment);
+                    stats.isUsed = true;
                 }
             });
             filters.forEach((member) => {
                 if (member.includes(cubePrefix)) {
                     stats.filters.push(member);
+                    stats.isUsed = true;
                 }
             });
             dateRanges.forEach((member) => {
                 if (member.includes(cubePrefix)) {
                     stats.dateRanges.push(member);
+                    stats.isUsed = true;
                 }
             });
             grouping.forEach((member) => {
                 if (member.includes(cubePrefix)) {
                     stats.grouping.push(member);
+                    stats.isUsed = true;
                 }
             });
             stats.timeDimensions = [...stats.dateRanges];
@@ -743,6 +904,54 @@ export function useQueryBuilder(props) {
                     stats.timeDimensions.push(member);
                 }
             });
+            cube?.hierarchies?.forEach((hierarchy) => {
+                const hierarchyName = hierarchy.name;
+                stats.hierarchies[hierarchyName] = [];
+                const dimensions = stats.hierarchies[hierarchyName];
+                hierarchy.levels.forEach((dimensionName) => {
+                    if (stats.dimensions.includes(dimensionName)) {
+                        dimensions.push(dimensionName);
+                    }
+                });
+            });
+            cube?.folders?.forEach((folder) => {
+                const folderName = folder.name;
+                stats.folders[folderName] = {
+                    dimensions: [],
+                    measures: [],
+                    segments: [],
+                    grouping: [],
+                };
+                const folderStats = stats.folders[folderName];
+                folder.members.forEach((memberName) => {
+                    if (stats.dimensions.includes(memberName)) {
+                        if (!folderStats.dimensions.includes(memberName)) {
+                            folderStats.dimensions.push(memberName);
+                        }
+                    }
+                    else if (stats.measures.includes(memberName)) {
+                        if (!folderStats.measures.includes(memberName)) {
+                            folderStats.measures.push(memberName);
+                        }
+                    }
+                    else if (stats.segments.includes(memberName)) {
+                        if (!folderStats.segments.includes(memberName)) {
+                            folderStats.segments.push(memberName);
+                        }
+                    }
+                    else if (stats.hierarchies[memberName]) {
+                        // add all selected dimensions from the hierarchy
+                        stats.hierarchies[memberName].forEach((levelMemberName) => {
+                            if (!folderStats.dimensions.includes(levelMemberName)) {
+                                folderStats.dimensions.push(levelMemberName);
+                            }
+                        });
+                    }
+                    if (grouping.includes(memberName)) {
+                        folderStats.grouping.push(memberName);
+                    }
+                });
+            });
             allStats[cubeName] = stats;
             return allStats;
         }, {});
@@ -757,8 +966,11 @@ export function useQueryBuilder(props) {
         });
     }, [usedCubes, usedMembers]);
     return {
+        // options
+        memberViewType,
         // query
         query: JSON.parse(JSON.stringify(query)),
+        queryHash,
         executedQuery,
         runQuery,
         stopQuery,
@@ -792,16 +1004,24 @@ export function useQueryBuilder(props) {
         cubes,
         members,
         joinableCubes,
+        joinableMembers,
+        usedCubes,
+        usedMembers,
+        usedGranularities,
+        usedMembersInGrouping,
+        usedMembersInFilters,
+        missingCubes,
+        missingMembers,
         // updaters
         ...simpleUpdaters,
         grouping,
         dateRanges,
         order,
         filters,
+        // state
         chartType,
+        hasPrivateMembers,
         setChartType,
-        usedCubes,
-        usedMembers,
         isCubeJoined: isCubeUsed,
         isMemberJoined: isMemberUsed,
         isCubeUsed,
@@ -810,12 +1030,14 @@ export function useQueryBuilder(props) {
         isDataModelChanged,
         isResultOutdated: !!(executedQuery &&
             (queryHash !== getQueryHash(executedQuery) || isApiTokenChanged || isDataModelChanged)),
-        queryHash,
+        // api
         cubeApi,
-        hasPrivateMembers,
+        mutexObj: mutexRef.current,
         // ui
         selectedCube,
         selectCube: useEvent((name) => selectCubeName(name)),
+        // @ts-ignore
+        totalRows: resultSet?.totalRows(),
     };
 }
 //# sourceMappingURL=query-builder.js.map