events refactor

src/components/CsvImport/index.vue

@@ -112,6 +112,7 @@ import SqlTable from '@/components/SqlTable'
 import Logs from '@/components/Logs'
 import time from '@/lib/utils/time'
 import fIo from '@/lib/utils/fileIo'
+import { send } from '@/lib/utils/events'
 
 export default {
   name: 'CsvImport',
@@ -335,6 +336,7 @@ export default {
       this.$store.commit('setCurrentTabId', tabId)
       this.importCsvCompleted = false
       this.$emit('finish')
+      send('inquiry.create', undefined, { auto: true })
     }
   }
 }

src/components/DbUploader.vue

@@ -128,11 +128,9 @@ export default {
       if (fIo.isDatabase(file)) {
         this.loadDb(file)
       } else {
-        send({
+        send('database.import', file.size, {
-          category: 'database',
+          from: 'csv',
-          action: 'import',
+          new_db: true
-          value: file.size,
-          label: 'from=csv new_db=true'
         })
 
         this.file = file

src/lib/database/index.js

@@ -79,13 +79,9 @@ class Database {
     this.dbName = file ? fu.getFileName(file) : 'database'
     this.refreshSchema()
 
-    send({
+    send('database.import', file ? file.size : 0, {
-      category: 'database',
+      from: file ? 'sqlite' : 'none',
-      action: 'import',
+      new_db: true
-      value: file ? file.size : 0,
-      label: file
-        ? 'from=sqlite new_db=true'
-        : 'from=none new_db=true'
     })
   }
 
@@ -125,12 +121,7 @@ class Database {
       throw new Error(data.error)
     }
     fu.exportToFile(data, fileName)
-    send({
+    send('database.export', data.byteLength, { to: 'sqlite' })
-      category: 'database',
-      action: 'export',
-      value: data.byteLength,
-      label: 'to=sqlite'
-    })
   }
 
   async validateTableName (name) {

src/lib/storedInquiries/index.js

@@ -106,11 +106,7 @@ export default {
       .then(str => {
         const inquires = this.deserialiseInquiries(str)
 
-        send({
+        send('inquiry.import', inquires.length)
-          category: 'inquiry',
-          action: 'import',
-          value: inquires.length
-        })
 
         return inquires
       })
@@ -119,11 +115,7 @@ export default {
     const jsonStr = this.serialiseInquiries(inquiryList)
     fu.exportToFile(jsonStr, fileName)
 
-    send({
+    send('inquiry.export', inquiryList.length)
-      category: 'inquiry',
-      action: 'export',
-      value: inquiryList.length
-    })
   },
 
   async readPredefinedInquiries () {

src/lib/utils/events.js

@@ -1,8 +1,12 @@
-export function send (payload) {
+export function send (name, value, labels) {
-  console.log(payload)
+  console.log(name, value, labels)
 
   const event = new CustomEvent('sqliteviz-app-event', {
-    detail: payload
+    detail: {
+      name,
+      value,
+      labels
+    }
   })
   window.dispatchEvent(event)
 }

src/registerServiceWorker.js

@@ -44,9 +44,6 @@ if ('serviceWorker' in navigator) {
   })
 
   window.addEventListener('appinstalled', () => {
-    send({
+    send('pwa.install')
-      category: 'pwa',
-      action: 'install'
-    })
   })
 }

src/views/Main/MainMenu.vue

@@ -112,11 +112,7 @@ export default {
         }
       })
 
-      send({
+      send('inquiry.create', undefined, { auto: false })
-        category: 'inquiry',
-        action: 'create',
-        label: 'auto=false'
-      })
     },
     cancelSave () {
       this.$modal.hide('save')
@@ -170,10 +166,7 @@ export default {
 
       // Signal about saving
       this.$root.$emit('inquirySaved')
-      send({
+      send('inquiry.save')
-        category: 'inquiry',
-        action: 'save'
-      })
     },
     _keyListener (e) {
       if (this.$route.path === '/workspace') {

src/views/Main/Workspace/Schema/index.vue

@@ -88,11 +88,9 @@ export default {
       await csvImport.previewCsv()
       csvImport.open()
 
-      send({
+      send('database.import', this.file.size, {
-        category: 'database',
+        from: 'csv',
-        action: 'import',
+        new_db: false
-        value: this.file.size,
-        label: 'from=csv new_db=false'
       })
     }
   }

src/views/Main/Workspace/Tabs/Tab/DataView/Chart/index.vue

@@ -70,10 +70,9 @@ export default {
         this.state.data.map(trace => `${trace.type}-${trace.mode}`)
       ),
       (value) => {
-        send({
+        send('viz_plotly.render', undefined, {
-          category: 'viz_plotly',
+          type: value,
-          action: 'render',
+          pivot: !!this.forPivot
-          label: `type=${value} pivot=${this.forPivot ? 'true' : 'false'}`
         })
       },
       { deep: true }

src/views/Main/Workspace/Tabs/Tab/DataView/Pivot/index.vue

@@ -88,12 +88,16 @@ export default {
     'pivotOptions.rendererName': {
       immediate: true,
       handler () {
-        this.$emit('update:importToPngEnabled', this.pivotOptions.rendererName !== 'TSV Export')
+        this.$emit(
-        this.$emit('update:importToSvgEnabled', this.viewStandartChart || this.viewCustomChart)
+          'update:importToPngEnabled',
-        send({
+          this.pivotOptions.rendererName !== 'TSV Export'
-          category: 'viz_pivot',
+        )
-          action: 'render',
+        this.$emit(
-          label: `type=${this.pivotOptions.rendererName}`
+          'update:importToSvgEnabled',
+          this.viewStandartChart || this.viewCustomChart
+        )
+        send('viz_pivot.render', undefined, {
+          type: this.pivotOptions.rendererName
         })
       }
     },

src/views/Main/Workspace/Tabs/Tab/DataView/index.vue

@@ -201,13 +201,19 @@ export default {
       this.exportSignal('html')
     },
     exportSignal (to) {
-      send({
+      const eventLabels = { type: to }
-        category: this.plotlyInPivot || this.mode === 'chart'
+
-          ? 'viz_plotly' : 'viz_pivot',
+      if (this.mode === 'chart' || this.plotlyInPivot) {
-        action: 'export',
+        eventLabels.pivot = this.plotlyInPivot
-        label: `type=${to}${this.plotlyInPivot
+      }
-        ? ' pivot=true' : this.mode === 'chart' ? ' pivot=false' : ''}`
+
-      })
+      send(
+        this.mode === 'chart' || this.plotlyInPivot
+          ? 'viz_plotly.export'
+          : 'viz_pivot.export',
+        undefined,
+        eventLabels
+      )
     }
   }
 }

src/views/Main/Workspace/Tabs/Tab/RunResult.vue

@@ -119,12 +119,10 @@ export default {
 
     exportToCsv () {
       if (this.result && this.result.values) {
-        send({
+        send('resultset.export',
-          category: 'resultset',
+          this.result.values[this.result.columns[0]].length,
-          action: 'export',
+          { to: 'csv' }
-          value: this.result.values[this.result.columns[0]].length,
+        )
-          label: 'to=csv'
-        })
       }
 
       fIo.exportToFile(csv.serialize(this.result), 'result_set.csv', 'text/csv')
@@ -132,12 +130,10 @@ export default {
 
     async prepareCopy () {
       if (this.result && this.result.values) {
-        send({
+        send('resultset.export',
-          category: 'resultset',
+          this.result.values[this.result.columns[0]].length,
-          action: 'export',
+          { to: 'clipboard' }
-          value: this.result.values[this.result.columns[0]].length,
+        )
-          label: 'to=clipboard'
-        })
       }
 
       if ('ClipboardItem' in window) {

src/views/Main/Workspace/Tabs/Tab/index.vue

@@ -109,6 +109,8 @@ export default {
       const fromPosition = this.layout[from]
       this.layout[from] = this.layout[to]
       this.layout[to] = fromPosition
+
+      send('inquiry.panel', undefined, { panel: to })
     },
     onDataViewUpdate () {
       this.$store.commit('updateTab', { index: this.tabIndex, isSaved: false })
@@ -124,31 +126,19 @@ export default {
         this.time = time.getPeriod(start, new Date())
 
         if (this.result && this.result.values) {
-          send({
+          send('resultset.create',
-            category: 'resultset',
+            this.result.values[this.result.columns[0]].length
-            action: 'create',
+          )
-            value: this.result.values[this.result.columns[0]].length
-          })
         }
 
-        send({
+        send('query.run', parseFloat(this.time), { status: 'success' })
-          category: 'query',
-          action: 'run',
-          value: this.time,
-          label: 'status=success'
-        })
       } catch (err) {
         this.error = {
           type: 'error',
           message: err
         }
 
-        send({
+        send('query.run', 0, { status: 'error' })
-          category: 'query',
-          action: 'run',
-          value: 0,
-          label: 'status=error'
-        })
       }
       state.db.refreshSchema()
       this.isGettingResults = false

src/views/Main/Workspace/index.vue

@@ -51,11 +51,7 @@ export default {
       const tabId = await this.$store.dispatch('addTab', { query: stmt })
       this.$store.commit('setCurrentTabId', tabId)
 
-      send({
+      send('inquiry.create', undefined, { auto: true })
-        category: 'inquiry',
-        action: 'create',
-        label: 'auto=true'
-      })
     }
   }
 }