From f9b966178a6f2eb3a180daf17a65e0e20ccbb220 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C5=BEe=20Fortun?= <joze.fortun@gmail.com>
Date: Wed, 14 Jun 2023 13:38:42 +0200
Subject: [PATCH] Fix gauge text labels

---
 client/web/compose/src/components/Chart/index.vue        | 8 ++++++--
 .../compose/src/components/ModuleFields/Editor/User.vue  | 2 +-
 .../web/compose/src/components/PageBlocks/ChartBase.vue  | 2 +-
 .../compose/src/components/PageBlocks/CommentBase.vue    | 9 +--------
 .../web/compose/src/components/PageBlocks/MetricBase.vue | 2 +-
 .../components/PageBlocks/MetricConfigurator/MStyle.vue  | 2 ++
 .../components/PageBlocks/MetricConfigurator/index.vue   | 7 +++++--
 client/web/compose/src/mixins/record.js                  | 2 +-
 client/web/compose/src/views/Admin/Pages/Builder.vue     | 9 ++++++++-
 lib/js/src/compose/types/chart/gauge.ts                  | 4 ++--
 lib/js/src/compose/types/page-block/metric.ts            | 3 ++-
 11 files changed, 30 insertions(+), 20 deletions(-)

diff --git a/client/web/compose/src/components/Chart/index.vue b/client/web/compose/src/components/Chart/index.vue
index 4fa189082..5712168d0 100644
--- a/client/web/compose/src/components/Chart/index.vue
+++ b/client/web/compose/src/components/Chart/index.vue
@@ -17,7 +17,7 @@
 </template>
 
 <script>
-import { mapGetters } from 'vuex'
+import { mapGetters, mapActions } from 'vuex'
 import { chartConstructor } from 'corteza-webapp-compose/src/lib/charts'
 import { compose, NoID } from '@cortezaproject/corteza-js'
 import { components } from '@cortezaproject/corteza-vue'
@@ -80,6 +80,10 @@ export default {
   },
 
   methods: {
+    ...mapActions({
+      resolveUsers: 'user/resolveUsers',
+    }),
+
     async updateChart () {
       this.renderer = undefined
 
@@ -121,7 +125,7 @@ export default {
           if (field && ['User', 'Record'].includes(field.kind)) {
             if (field.kind === 'User') {
               // Fetch and map users to labels
-              await this.$store.dispatch('user/fetchUsers', data.labels)
+              await this.resolveUsers(data.labels)
               data.labels = data.labels.map(label => {
                 return field.formatter(this.getUserByID(label)) || label
               })
diff --git a/client/web/compose/src/components/ModuleFields/Editor/User.vue b/client/web/compose/src/components/ModuleFields/Editor/User.vue
index 7aa5e7d24..45f488c25 100644
--- a/client/web/compose/src/components/ModuleFields/Editor/User.vue
+++ b/client/web/compose/src/components/ModuleFields/Editor/User.vue
@@ -267,7 +267,7 @@ export default {
 
   methods: {
     ...mapActions({
-      resolveUsers: 'user/fetchUsers',
+      resolveUsers: 'user/resolveUsers',
       addUserToResolved: 'user/push',
     }),
 
diff --git a/client/web/compose/src/components/PageBlocks/ChartBase.vue b/client/web/compose/src/components/PageBlocks/ChartBase.vue
index b0979e8f5..29fee82ac 100644
--- a/client/web/compose/src/components/PageBlocks/ChartBase.vue
+++ b/client/web/compose/src/components/PageBlocks/ChartBase.vue
@@ -125,7 +125,7 @@ export default {
         const { pageID = NoID } = this.page
         const { recordID = NoID } = this.record || {}
         // Construct its uniqueID to identify it
-        const recordListUniqueID = [pageID, recordID, drillDown.blockID].map(v => v || NoID).join('-')
+        const recordListUniqueID = [pageID, recordID, drillDown.blockID, false].map(v => v || NoID).join('-')
 
         this.$root.$emit(`drill-down-recordList:${recordListUniqueID}`, prefilter)
       } else {
diff --git a/client/web/compose/src/components/PageBlocks/CommentBase.vue b/client/web/compose/src/components/PageBlocks/CommentBase.vue
index 392ec8180..2e399eb10 100644
--- a/client/web/compose/src/components/PageBlocks/CommentBase.vue
+++ b/client/web/compose/src/components/PageBlocks/CommentBase.vue
@@ -225,13 +225,6 @@ export default {
       return user.name || user.handle || user.email || ''
     },
 
-    fetchUsers () {
-      const userListID = this.records.map(r => {
-        return r.ownedBy
-      }).filter((x, i, r) => r.indexOf(x) === i)
-      this.$store.dispatch('user/fetchUsers', userListID)
-    },
-
     refresh () {
       if (!this.options.moduleID) {
       // Make sure block is properly configured
@@ -242,7 +235,7 @@ export default {
         this.fetchRecords(this.roModule, this.expandFilter())
           .then(rr => {
             this.records = rr
-            this.fetchUsers()
+            this.fetchUsers([{ name: 'ownedBy', kind: 'User', isSystem: true, isMulti: false }], this.records)
           })
           .catch(e => {
             console.error(e)
diff --git a/client/web/compose/src/components/PageBlocks/MetricBase.vue b/client/web/compose/src/components/PageBlocks/MetricBase.vue
index a66ff9111..f2b2f2ca4 100644
--- a/client/web/compose/src/components/PageBlocks/MetricBase.vue
+++ b/client/web/compose/src/components/PageBlocks/MetricBase.vue
@@ -177,7 +177,7 @@ export default {
         const { pageID = NoID } = this.page
         const { recordID = NoID } = this.record || {}
         // Construct its uniqueID to identify it
-        const recordListUniqueID = [pageID, recordID, drillDown.blockID].map(v => v || NoID).join('-')
+        const recordListUniqueID = [pageID, recordID, drillDown.blockID, false].map(v => v || NoID).join('-')
         this.$root.$emit(`drill-down-recordList:${recordListUniqueID}`, filter)
       } else {
         // Open in modal
diff --git a/client/web/compose/src/components/PageBlocks/MetricConfigurator/MStyle.vue b/client/web/compose/src/components/PageBlocks/MetricConfigurator/MStyle.vue
index 0b7297990..d9e236021 100644
--- a/client/web/compose/src/components/PageBlocks/MetricConfigurator/MStyle.vue
+++ b/client/web/compose/src/components/PageBlocks/MetricConfigurator/MStyle.vue
@@ -36,6 +36,8 @@
           v-model="options.fontSize"
           type="number"
           placeholder="16"
+          min="0.1"
+          step="0.1"
           class="mb-1"
         />
       </b-form-group>
diff --git a/client/web/compose/src/components/PageBlocks/MetricConfigurator/index.vue b/client/web/compose/src/components/PageBlocks/MetricConfigurator/index.vue
index c69b62fbb..91545fd3a 100644
--- a/client/web/compose/src/components/PageBlocks/MetricConfigurator/index.vue
+++ b/client/web/compose/src/components/PageBlocks/MetricConfigurator/index.vue
@@ -299,10 +299,13 @@
             style="top: 0;"
           >
             <b-button
-              variant="outline-primary"
+              :title="$t('metric.edit.refreshData')"
+              variant="outline-light"
+              size="lg"
+              class="d-flex align-items-center text-primary ml-auto border-0 px-2 mt-2 mr-2"
               @click.prevent="$root.$emit('metric.update')"
             >
-              {{ $t('metric.edit.refreshData') }}
+              <font-awesome-icon :icon="['fa', 'sync']" />
             </b-button>
 
             <div
diff --git a/client/web/compose/src/mixins/record.js b/client/web/compose/src/mixins/record.js
index aacb048a2..941c86170 100644
--- a/client/web/compose/src/mixins/record.js
+++ b/client/web/compose/src/mixins/record.js
@@ -80,7 +80,7 @@ export default {
       this.page.blocks.forEach((b, index) => {
         if (b.kind === 'RecordList' && b.options.editable) {
           const p = new Promise((resolve) => {
-            const recordListUniqueID = [this.page.pageID, (this.record || {}).recordID || NoID, b.blockID].map(v => v || NoID).join('-')
+            const recordListUniqueID = [this.page.pageID, (this.record || {}).recordID, b.blockID, false].map(v => v || NoID).join('-')
             this.$root.$emit(`record-line:collect:${recordListUniqueID}`, resolve)
           })
 
diff --git a/client/web/compose/src/views/Admin/Pages/Builder.vue b/client/web/compose/src/views/Admin/Pages/Builder.vue
index 18284eefb..e1e964768 100644
--- a/client/web/compose/src/views/Admin/Pages/Builder.vue
+++ b/client/web/compose/src/views/Admin/Pages/Builder.vue
@@ -268,6 +268,10 @@
       </editor-toolbar>
     </portal>
 
+    <record-modal
+      :namespace="namespace"
+    />
+
     <magnification-modal
       :namespace="namespace"
     />
@@ -284,6 +288,7 @@ import PageBlock from 'corteza-webapp-compose/src/components/PageBlocks'
 import EditorToolbar from 'corteza-webapp-compose/src/components/Admin/EditorToolbar'
 import { compose, NoID } from '@cortezaproject/corteza-js'
 import Configurator from 'corteza-webapp-compose/src/components/PageBlocks/Configurator'
+import RecordModal from 'corteza-webapp-compose/src/components/Public/Record/Modal'
 import MagnificationModal from 'corteza-webapp-compose/src/components/Public/Page/Block/Modal'
 import { fetchID } from 'corteza-webapp-compose/src/lib/block'
 
@@ -299,6 +304,7 @@ export default {
     PageBlock,
     EditorToolbar,
     PageTranslator,
+    RecordModal,
     MagnificationModal,
   },
 
@@ -731,7 +737,8 @@ export default {
       this.usedBlocks.forEach((b, index) => {
         if (b.kind === 'RecordList' && b.options.editable) {
           const p = new Promise((resolve) => {
-            const recordListUniqueID = [this.page.pageID, (this.record || {}).recordID || NoID, b.blockID].map(v => v || NoID).join('-')
+            const recordListUniqueID = [this.page.pageID, (this.record || {}).recordID, b.blockID, false].map(v => v || NoID).join('-')
+            console.log(`page-block:validate:${recordListUniqueID}`)
             this.$root.$emit(`page-block:validate:${recordListUniqueID}`, resolve)
           })
 
diff --git a/lib/js/src/compose/types/chart/gauge.ts b/lib/js/src/compose/types/chart/gauge.ts
index b4bd53bbe..be5db91f2 100644
--- a/lib/js/src/compose/types/chart/gauge.ts
+++ b/lib/js/src/compose/types/chart/gauge.ts
@@ -15,8 +15,8 @@ export default class GaugeChart extends BaseChart {
     // Assure required fields
     for (const v of (this.config.reports || []) as Array<Report>) {
       for (const d of (v.dimensions || []) as Array<Dimension>) {
-        // Since gauge produces one value we want one dataset, deletedBy is the same for all existing records
-        d.field = 'deletedBy'
+        // Since gauge produces one value we want one dataset, deletedAt is the same for all existing records
+        d.field = 'deletedAt'
 
         if (!d.meta) {
           d.meta = {}
diff --git a/lib/js/src/compose/types/page-block/metric.ts b/lib/js/src/compose/types/page-block/metric.ts
index d40572fbb..6d16bc073 100644
--- a/lib/js/src/compose/types/page-block/metric.ts
+++ b/lib/js/src/compose/types/page-block/metric.ts
@@ -120,7 +120,8 @@ export class PageBlockMetric extends PageBlock {
       moduleID,
       filter,
       metrics,
-      dimensions: dimensionFunctions.convert({ modifier: 'YEAR', field: 'createdAt' }),
+      // Since metric produces one value we want one dataset, deletedAt is the same for all existing records
+      dimensions: 'deletedAt',
     }
   }
 }