feat: Indicate that filters are being loaded

visualize-admin · Feb 23, 2024 · 903ea2a · 903ea2a
1 parent a0e4da9
commit 903ea2a
Showing 1 changed file with 8 additions and 2 deletions.
diff --git a/app/components/chart-filters-list.tsx b/app/components/chart-filters-list.tsx
@@ -44,7 +44,8 @@ export const ChartFiltersList = (props: ChartFiltersListProps) => {
     measures,
     componentIris: extractChartConfigComponentIris(chartConfig),
   });
-  const [{ data }] = useDataCubesComponentsQuery({
+  // TODO: Refactor to somehow access current filter labels instead of fetching them again
+  const [{ data, fetching }] = useDataCubesComponentsQuery({
     variables: {
       sourceType: dataSource.type,
       sourceUrl: dataSource.url,
@@ -143,7 +144,12 @@ export const ChartFiltersList = (props: ChartFiltersListProps) => {
     timeSlider.type,
   ]);
 
-  return allFilters.length ? (
+  return fetching ? (
+    <Typography component="div" variant="caption" color="grey.600">
+      <Trans id="controls.section.data.filters">Filters</Trans>:{" "}
+      <Trans id="hint.loading.data">Loading data...</Trans>
+    </Typography>
+  ) : allFilters.length ? (
     <Typography
       component="div"
       variant="caption"