Merge pull request #994 from visualize-admin/abbrev

app/charts/shared/chart-data-filters.tsx

@@ -30,7 +30,6 @@ import {
   HierarchyValue,
   TemporalDimension,
   TimeUnit,
-  useDimensionHierarchyQuery,
   useDimensionValuesQuery,
 } from "@/graphql/query-hooks";
 import { Icon } from "@/icons";
@@ -154,21 +153,7 @@ const DataFilter = ({
     },
   });
 
-  const dimension = data?.dataCubeByIri?.dimensionByIri;
-
-  const [hierarchyResp] = useDimensionHierarchyQuery({
-    variables: {
-      cubeIri: dataSetIri,
-      dimensionIri: dimension?.iri!,
-      sourceType: dataSource.type,
-      sourceUrl: dataSource.url,
-      locale: locale,
-    },
-    pause: !dimension,
-  });
-
-  const hierarchy =
-    hierarchyResp.data?.dataCubeByIri?.dimensionByIri?.hierarchy;
+  const hierarchy = data?.dataCubeByIri?.dimensionByIri?.hierarchy;
 
   const setDataFilter = (
     e: SelectChangeEvent<unknown> | { target: { value: string } }

app/charts/shared/legend-color.tsx

@@ -20,8 +20,7 @@ import {
 import { Observation } from "@/domain/data";
 import {
   DimensionMetadataFragment,
-  useDataCubeMetadataWithComponentValuesQuery,
-  useDimensionHierarchyQuery,
+  useDimensionValuesQuery,
 } from "@/graphql/query-hooks";
 import SvgIcChevronRight from "@/icons/components/IcChevronRight";
 import { useLocale } from "@/src";
@@ -108,20 +107,19 @@ const useDimension = ({
   locale: string;
   dimensionIri?: string;
 }) => {
-  const [{ data: cubeMetadata }] = useDataCubeMetadataWithComponentValuesQuery({
+  const [{ data: cubeMetadata }] = useDimensionValuesQuery({
     variables: {
-      iri: dataset,
+      dataCubeIri: dataset,
+      dimensionIri: dimensionIri!,
       sourceType: dataSource.type,
       sourceUrl: dataSource.url,
       locale: locale,
     },
     pause: !dimensionIri,
   });
   return useMemo(() => {
-    return cubeMetadata?.dataCubeByIri?.dimensions.find(
-      (d) => d.iri === dimensionIri
-    );
-  }, [cubeMetadata?.dataCubeByIri?.dimensions, dimensionIri]);
+    return cubeMetadata?.dataCubeByIri?.dimensionByIri;
+  }, [cubeMetadata?.dataCubeByIri?.dimensionByIri]);
 };
 
 const emptyObj = {};
@@ -168,9 +166,9 @@ const useLegendGroups = ({
     dimensionIri: segmentField?.componentIri,
   });
 
-  const [hierarchyResp] = useDimensionHierarchyQuery({
+  const [hierarchyResp] = useDimensionValuesQuery({
     variables: {
-      cubeIri: dataset,
+      dataCubeIri: dataset,
       dimensionIri: segmentDimension?.iri!,
       sourceType: dataSource.type,
       sourceUrl: dataSource.url,

app/configurator/components/chart-configurator.tsx

@@ -18,6 +18,7 @@ import {
 import { makeStyles } from "@mui/styles";
 import isEmpty from "lodash/isEmpty";
 import isEqual from "lodash/isEqual";
+import omitBy from "lodash/omitBy";
 import sortBy from "lodash/sortBy";
 import { useEffect, useRef, useState, useMemo } from "react";
 import {
@@ -283,27 +284,30 @@ const useFilterReorder = ({
     return getFiltersByMappingStatus(state.chartConfig);
   }, [state.chartConfig]);
 
-  const variables = useMemo(
-    () => ({
+  const variables = useMemo(() => {
+    const hasUnmappedFilters = Object.keys(unmappedFilters).length > 0;
+    const vars = {
       iri: state.dataSet,
       sourceType: state.dataSource.type,
       sourceUrl: state.dataSource.url,
       locale,
-      filters: unmappedFilters,
+      filters: hasUnmappedFilters ? unmappedFilters : undefined,
       // This is important for urql not to think that filters
       // are the same  while the order of the keys has changed.
       // If this is not present, we'll have outdated dimension
       // values after we change the filter order
-      filterKeys: Object.keys(unmappedFilters).join(", "),
-    }),
-    [
-      state.dataSet,
-      state.dataSource.type,
-      state.dataSource.url,
-      locale,
-      unmappedFilters,
-    ]
-  );
+      filterKeys: hasUnmappedFilters
+        ? Object.keys(unmappedFilters).join(", ")
+        : undefined,
+    };
+    return omitBy(vars, (x) => x === undefined) as typeof vars;
+  }, [
+    state.dataSet,
+    state.dataSource.type,
+    state.dataSource.url,
+    locale,
+    unmappedFilters,
+  ]);
 
   const [{ data, fetching: dataFetching }, executeQuery] =
     useDataCubeMetadataWithComponentValuesQuery({

app/gql-flamegraph/devtool.tsx

@@ -169,6 +169,12 @@ const CopyLink = ({ toCopy, ...props }: { toCopy: string } & LinkProps) => {
   );
 };
 
+const getOperationQueryName = (operation: Operation) => {
+  return operation.query.definitions.find(
+    (d): d is OperationDefinitionNode => d.kind === "OperationDefinition"
+  )?.name?.value;
+};
+
 /**
  * Collapsible according showing for each request that has been made
  * a accordion with name
@@ -208,13 +214,7 @@ const AccordionOperation = ({
           }}
         >
           <Typography variant="body2" sx={{ mb: 0 }}>
-            {operation.key}{" "}
-            {
-              operation.query.definitions.find(
-                (d): d is OperationDefinitionNode =>
-                  d.kind === "OperationDefinition"
-              )?.name?.value
-            }
+            {operation.key} {getOperationQueryName(operation)}
             <Box component="span" sx={{ ml: 2 }}>
               {result ? "✅" : "🔄"}
             </Box>

app/graphql/queries/data-cubes.graphql

@@ -216,6 +216,7 @@ query DimensionValues(
       sourceUrl: $sourceUrl
     ) {
       ...dimensionMetadata
+      ...hierarchyMetadata
     }
   }
 }