From 357f3f7f239179393adbd69865bfa3b1bd29de63 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C5=BEe=20Fortun?= <joze.fortun@gmail.com>
Date: Mon, 4 Sep 2023 12:21:00 +0200
Subject: [PATCH] Update compose chart time label implementation

---
 .../src/components/Chart/Report/GenericChart.vue    |  8 ++++++++
 .../src/components/Chart/Report/ReportEdit.vue      |  1 -
 lib/js/src/compose/types/chart/base.ts              | 13 +++++++++++--
 lib/js/src/compose/types/chart/chart.ts             |  2 +-
 lib/js/src/compose/types/chart/util.ts              |  7 +------
 locale/en/corteza-webapp-compose/chart.yaml         |  1 +
 6 files changed, 22 insertions(+), 10 deletions(-)

diff --git a/client/web/compose/src/components/Chart/Report/GenericChart.vue b/client/web/compose/src/components/Chart/Report/GenericChart.vue
index 6baab0d72..9a347782b 100644
--- a/client/web/compose/src/components/Chart/Report/GenericChart.vue
+++ b/client/web/compose/src/components/Chart/Report/GenericChart.vue
@@ -3,6 +3,14 @@
     :report.sync="editReport"
     :modules="modules"
   >
+    <template #dimension-options-options="{ dimension }">
+      <b-form-checkbox
+        v-model="dimension.timeLabels"
+      >
+        {{ $t('edit.dimension.timeLabels') }}
+      </b-form-checkbox>
+    </template>
+
     <template #dimension-options="{ dimension }">
       <b-row>
         <b-col
diff --git a/client/web/compose/src/components/Chart/Report/ReportEdit.vue b/client/web/compose/src/components/Chart/Report/ReportEdit.vue
index 4f06f9c9b..a787fdc10 100644
--- a/client/web/compose/src/components/Chart/Report/ReportEdit.vue
+++ b/client/web/compose/src/components/Chart/Report/ReportEdit.vue
@@ -154,7 +154,6 @@
           <template v-if="!unSkippable">
             <b-row>
               <b-col
-                v-if="!d.skipMissing"
                 cols="12"
                 md="6"
               >
diff --git a/lib/js/src/compose/types/chart/base.ts b/lib/js/src/compose/types/chart/base.ts
index fd951b70a..c423b565f 100644
--- a/lib/js/src/compose/types/chart/base.ts
+++ b/lib/js/src/compose/types/chart/base.ts
@@ -117,7 +117,15 @@ export class BaseChart {
     this.config = (conf ? _.merge(this.defConfig(), conf) : false) || this.config || this.defConfig()
     this.config.reports?.forEach(report => {
       const { dimensions = [], metrics = [] } = report || {}
-      report.dimensions = dimensions.map(d => _.merge(this.defDimension(), d))
+      report.dimensions = dimensions.map(d => {
+        //Legacy support
+        if (d.modifier === 'auto') {
+          d.timeLabels = true
+          d.modifier = '(no grouping / buckets)'
+        }
+
+        return _.merge(this.defDimension(), d)
+      })
       report.metrics = metrics.map(m => _.merge(this.defMetrics(), m))
     })
   }
@@ -131,7 +139,8 @@ export class BaseChart {
     if (!this.config.reports || !this.config.reports.length) {
       throw new Error('notification.chart.invalidConfig.missingReports')
     }
-    this.config.reports.map(({ moduleID, dimensions, metrics }) => {
+
+    this.config.reports.forEach(({ moduleID, dimensions, metrics }) => {
       if (!moduleID) {
         throw new Error('notification.chart.invalidConfig.missingModuleID')
       }
diff --git a/lib/js/src/compose/types/chart/chart.ts b/lib/js/src/compose/types/chart/chart.ts
index e0c834f64..fd0670855 100644
--- a/lib/js/src/compose/types/chart/chart.ts
+++ b/lib/js/src/compose/types/chart/chart.ts
@@ -81,7 +81,7 @@ export default class Chart extends BaseChart {
 
         const xAxis = {
           nameLocation: 'center',
-          type: dimension.modifier === 'auto' ? 'time' : 'category',
+          type: dimension.timeLabels ? 'time' : 'category',
           axisLabel: {
             interval: 0,
             overflow: 'break',
diff --git a/lib/js/src/compose/types/chart/util.ts b/lib/js/src/compose/types/chart/util.ts
index b5751c56e..b6e17ce8e 100644
--- a/lib/js/src/compose/types/chart/util.ts
+++ b/lib/js/src/compose/types/chart/util.ts
@@ -31,6 +31,7 @@ export interface Dimension {
   modifier?: string;
   default?: string;
   skipMissing?: boolean;
+  timeLabels?: boolean;
   autoSkip?: boolean;
   rotateLabel?: number;
 }
@@ -171,12 +172,6 @@ dimensionFunctions.push(...[
     convert: (f: string) => f,
   },
 
-  {
-    text: 'auto',
-    value: 'auto',
-    convert: (f: string) => f,
-  },
-
   {
     text: 'date',
     value: 'DATE',
diff --git a/locale/en/corteza-webapp-compose/chart.yaml b/locale/en/corteza-webapp-compose/chart.yaml
index 011898bbd..c6dc1dcc8 100644
--- a/locale/en/corteza-webapp-compose/chart.yaml
+++ b/locale/en/corteza-webapp-compose/chart.yaml
@@ -35,6 +35,7 @@ edit:
     gaugeSteps: Steps
     label: Dimensions
     skipMissingValues: Skip missing values
+    timeLabels: Time labels
     options:
       label: Options
     optionsPicker: