Develop (#75)

Datawheel · Sep 27, 2024 · 998ca60 · 998ca60
2 parents d8155fe + 2b4d48d
commit 998ca60
Show file tree

Hide file tree

Showing 5 changed files with 85 additions and 70 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -18,7 +18,7 @@
     "static": "vite build --mode staging"
   },
   "dependencies": {
-    "@datawheel/olap-client": "^2.0.0",
+    "@datawheel/olap-client": "^2.1.6",
     "@datawheel/use-translation": "^0.2.0",
     "@reduxjs/toolkit": "^1.9.3",
     "@tabler/icons-react": "^2.7.0",
@@ -76,4 +76,4 @@
     "vite-plugin-dts": "^3.9.1",
     "wrangler": "^3.59.0"
   }
-}
+}
diff --git a/src/components/DrawerMenu.tsx b/src/components/DrawerMenu.tsx
@@ -13,7 +13,8 @@ import {
   Flex,
   Checkbox,
   ThemeIcon,
-  useMantineTheme
+  useMantineTheme,
+  Divider
 } from "@mantine/core";
 import {useSelector} from "react-redux";
 import {
@@ -47,7 +48,11 @@ import {
   IconStack3,
   IconSettings,
   IconArrowsLeftRight,
-  IconPlus
+  IconPlus,
+  IconWorld,
+  IconClock,
+  IconTag,
+  IconBox
 } from "@tabler/icons-react";
 import type {PlainLevel} from "@datawheel/olap-client";
 import {getCaption} from "../utils/string";
@@ -157,12 +162,23 @@ function DimensionItem({dimension, locale, activeItems, activeCount}) {
       activeCount={activeCount}
     />
   ));
-
-  if (!isChildSubMenu) {
-    return options[0];
-  }
-
-  return options;
+  // if (!isChildSubMenu) {
+  //   return options[0];
+  // }
+  return (
+    <div key={dimension.id}>
+      <Divider
+        my="xs"
+        label={
+          <Group>
+            {getIconForDimensionType(dimension.dimensionType)}
+            <Text italic>{getCaption(dimension, locale)}</Text>
+          </Group>
+        }
+      />
+      {options}
+    </div>
+  );
 }
 
 function HierarchyItem({dimension, hierarchy, isSubMenu, locale, activeItems, activeCount}) {
@@ -182,7 +198,7 @@ function HierarchyItem({dimension, hierarchy, isSubMenu, locale, activeItems, ac
 
   const isChildSubMenu = hierarchy.levels.length !== 1;
 
-  const options = hierarchy.levels.map(lvl => (
+  const options = hierarchy.levels.map((lvl, index) => (
     <LevelItem
       dimension={dimension}
       hierarchy={hierarchy}
@@ -192,6 +208,7 @@ function HierarchyItem({dimension, hierarchy, isSubMenu, locale, activeItems, ac
       locale={locale}
       activeItems={activeItems}
       activeCount={activeCount}
+      depth={index}
     />
   ));
 
@@ -202,7 +219,16 @@ function HierarchyItem({dimension, hierarchy, isSubMenu, locale, activeItems, ac
   return options;
 }
 
-function LevelItem({dimension, hierarchy, isSubMenu, level, locale, activeItems, activeCount}) {
+function LevelItem({
+  dimension,
+  hierarchy,
+  isSubMenu,
+  level,
+  locale,
+  activeItems,
+  activeCount,
+  depth = 0
+}) {
   const [activeFilter, setActiveFilter] = useState(false);
   const {translate: t} = useTranslation();
   const actions = useActions();
@@ -287,12 +313,16 @@ function LevelItem({dimension, hierarchy, isSubMenu, level, locale, activeItems,
   const isDisabled = isOtherHierarchySelected && !checked;
 
   if (!currentDrilldown) return;
+
+  const paddingLeft = `${20 * depth + 10}px`;
+
   return (
     currentDrilldown && (
       <>
         <Group mt="sm" position="apart" key={level.uri} noWrap>
           <Checkbox
-            sx={{cursor: "pointer"}}
+            // pl="sm"
+            sx={{cursor: "pointer", paddingLeft}}
             onChange={() => {
               if (cut) {
                 const active = checked ? false : cut.members.length ? true : false;
@@ -617,4 +647,18 @@ function FilterItem({
   );
 }
 
+// Function to get the appropriate icon for each dimension type
+const getIconForDimensionType = dimensionType => {
+  console.log(dimensionType, "dt");
+  switch (dimensionType) {
+    case "geo":
+      return <IconWorld size={20} />;
+    case "time":
+      return <IconClock size={20} />;
+    // Add more cases for other dimension types
+    default:
+      return <IconBox size={20} />; // Default icon
+  }
+};
+
 export default AddColumnsDrawer;
diff --git a/src/components/ExplorerResults.tsx b/src/components/ExplorerResults.tsx
@@ -48,10 +48,8 @@ export function ExplorerResults(props: {
   const cube = useSelector(selectOlapCube);
   const serverStatus = useSelector(selectServerState);
   const {params, result} = useSelector(selectCurrentQueryItem);
-
   const {online: isServerOnline, url: serverUrl} = serverStatus;
-  const {data, error} = result;
-
+  const {error} = result;
   const {translate: t} = useTranslation();
 
   const {classes, cx} = useStyles();

diff --git a/src/hooks/translation.ts b/src/hooks/translation.ts
@@ -1,5 +1,5 @@
-import { translationFactory } from "@datawheel/use-translation";
-import { translationDict as vizbuilderTranslationDict } from "@datawheel/vizbuilder";
+import {translationFactory} from "@datawheel/use-translation";
+import {translationDict as vizbuilderTranslationDict} from "@datawheel/vizbuilder";
 
 export const defaultTranslation = {
   action_copy: "Copy",
@@ -17,38 +17,38 @@ export const defaultTranslation = {
     GTE: "Equal or greater than",
     LT: "Lower than",
     LTE: "Equal or lower than",
-    NEQ: "Not equal to",
+    NEQ: "Not equal to"
   },
   debug_view: {
     tab_label: "Debugger",
     httpheaders: "Response headers",
     jssource_prefix: "Javascript source for ",
     jssource_suffix: "",
     url_aggregate: "Aggregate API URL",
-    url_logiclayer: "LogicLayer API URL",
+    url_logiclayer: "LogicLayer API URL"
   },
   direction: {
     ASC: "Ascending",
-    DESC: "Descending",
+    DESC: "Descending"
   },
   formats: {
     csv: "CSV",
     json: "JSON",
     jsonarrays: "JSON Arrays",
     jsonrecords: "JSON Records",
-    xlsx: "XLSX",
+    xlsx: "XLSX"
   },
   loading: {
     title: "Loading...",
     message_heavyquery:
       "The current query might contain a maximum of {{rows}} rows.\nPlease wait...",
-    message_default: "Please wait...",
+    message_default: "Please wait..."
   },
   params: {
     action_clear: "Clear query",
     action_clear_description: "Clear all parameters from your current query",
     action_execute: "Execute query",
-    add_columns: "Add columns",
+    add_columns: "Add Column",
     column_title: "Parameters",
     current_endpoint: "Current endpoint: {{label}}",
     dimmenu_abbrjoint: ": ",
@@ -57,8 +57,7 @@ export const defaultTranslation = {
     dimmenu_level: "{{abbr}}",
     filter_mode: "Filter Mode",
     filter_by: "Filter by {{name}}",
-    error_no_cut_selected_detail:
-      "You can add data filters based on selected drilldowns.",
+    error_no_cut_selected_detail: "You can add data filters based on selected drilldowns.",
     error_no_cut_selected_title: "No cuts added",
     error_no_dimension_selected_detail: "You must add at least one drilldown.",
     error_no_dimension_selected_title: "No drilldowns selected",
@@ -113,14 +112,13 @@ export const defaultTranslation = {
     tooltip_area_drilldowns: "",
     tooltip_area_filters: "",
     tooltip_area_measures: "",
-    tooltip_area_options: "",
+    tooltip_area_options: ""
   },
   pivot_view: {
     tab_label: "Pivot Data",
     error_missingparams:
       "The current query doesn't have enough parameters. Two different drilldowns and a measure are needed.",
-    error_onedimension:
-      "The rows and columns in a pivotted table need 2 different drilldowns.",
+    error_onedimension: "The rows and columns in a pivotted table need 2 different drilldowns.",
     error_internal:
       "An internal error ocurred in the pivotting tool. We will fix it as soon as possible.",
     error_internal_detail:
@@ -141,12 +139,12 @@ export const defaultTranslation = {
     warning_propertypivot:
       "Unlike Drilldown Members, Drilldown Properties are not guaranteed to be unique. In this view, data points are aggregated based on the property labels, so please ensure you're not missing information.",
     warning_sumdimensions:
-      "There's more than 2 drilldowns in this query. Remaining values will be summed.",
+      "There's more than 2 drilldowns in this query. Remaining values will be summed."
   },
   placeholders: {
     incomplete: "[Incomplete parameters]",
     unselected: "[Unselected]",
-    none: "[None]",
+    none: "[None]"
   },
   previewMode: {
     btn_get_all: "Show all rows",
@@ -156,20 +154,18 @@ export const defaultTranslation = {
     description_preview:
       "You are currently viewing a preview response of the first {{limit}} rows.",
     title_full: "All records",
-    title_preview: "Preview records",
+    title_preview: "Preview records"
   },
   queries: {
     action_create: "New query",
     action_parse: "Query from URL",
     error_not_query: "Please construct a valid query",
     error_no_drilldowns: "You must add at least one drilldown.",
     error_no_measures: "You must add at least one measure.",
-    error_one_hierarchy_per_dimension:
-      "You must only select drilldowns of a single hierarchy.",
-    error_one_cut_per_dimension:
-      "You must only apply cuts over levels of a single hierarchy.",
+    error_one_hierarchy_per_dimension: "You must only select drilldowns of a single hierarchy.",
+    error_one_cut_per_dimension: "You must only apply cuts over levels of a single hierarchy.",
     column_title: "Queries",
-    unset_parameters: "No parameters set",
+    unset_parameters: "No parameters set"
   },
   results: {
     error_execquery_detail: "There was a problem with the last query:",
@@ -180,7 +176,7 @@ export const defaultTranslation = {
     error_emptyresult_detail:
       "The query didn't return elements. Try again with different parameters.",
     count_rows: "{{n}} row",
-    count_rows_plural: "{{n}} rows",
+    count_rows_plural: "{{n}} rows"
   },
   selectlevel_placeholder: "Level...",
   selectmeasure_placeholder: "Measure...",
@@ -189,7 +185,7 @@ export const defaultTranslation = {
     tab_label: "Data Table",
     numeral_format: "Numeral format",
     sort_asc: "Sort Asc",
-    sort_desc: "Sort Desc",
+    sort_desc: "Sort Desc"
   },
   transfer_input: {
     count_hidden: "{{n}} item hidden",
@@ -200,12 +196,14 @@ export const defaultTranslation = {
     select_filtered: "Select filtered",
     unselect_filtered: "Unselect filtered",
     selected_items: "Selected items",
-    unselected_items: "Unselected items",
+    unselected_items: "Unselected items"
   },
-  vizbuilder: vizbuilderTranslationDict,
+  vizbuilder: vizbuilderTranslationDict
 };
 
 export type TranslationDict = typeof defaultTranslation;
 
-export const { useTranslation, TranslationConsumer, TranslationProvider } =
-  translationFactory({ defaultLocale: "en", defaultTranslation });
+export const {useTranslation, TranslationConsumer, TranslationProvider} = translationFactory({
+  defaultLocale: "en",
+  defaultTranslation
+});