Merge pull request #78 from openzim/vue_matomo

Add back matomo - was forgotten - and make it activable on-demand, disabled in dev

dev/zimit_ui_dev/config.json

@@ -47,5 +47,9 @@
   ],
   "zimit_size_limit": 2147483648,
   "zimit_time_limit": 5400,
-  "zimit_refresh_after": 60
+  "zimit_refresh_after": 60,
+  "matomo_enabled": false,
+  "matomo_host": "",
+  "matomo_site_id": 0,
+  "matomo_tracker_file_name": "matomo"
 }

ui/package.json

@@ -17,6 +17,7 @@
     "pinia": "^2.2.2",
     "vue": "^3.5.6",
     "vue-i18n": "10.0.1",
+    "vue-matomo": "^4.2.0",
     "vue-router": "^4.4.5",
     "vuetify": "^3.7.1"
   },

ui/public/config.json

@@ -47,5 +47,9 @@
   ],
   "zimit_size_limit": 2147483648,
   "zimit_time_limit": 5400,
-  "zimit_refresh_after": 60
+  "zimit_refresh_after": 60,
+  "matomo_enabled": false,
+  "matomo_host": "",
+  "matomo_site_id": 0,
+  "matomo_tracker_file_name": "matomo"
 }

ui/src/config.ts

@@ -18,6 +18,10 @@ export type Config = {
   zimit_size_limit: number
   zimit_time_limit: number
   zimit_refresh_after: number
+  matomo_enabled: boolean
+  matomo_host: string
+  matomo_site_id: number
+  matomo_tracker_file_name: string
 }
 
 async function loadConfig() {

ui/src/main.ts

@@ -47,13 +47,26 @@ import loadI18n, { i18nPlugin } from './i18n'
 // config
 import loadConfig, { configPlugin } from './config'
 
+// Matomo stats
+import VueMatomo from 'vue-matomo'
+
 // load translation asynchronously and only then mount the app
 Promise.all([loadI18n(), loadConfig()]).then(([i18n, config]) => {
   app.use(vuetify)
   app.use(router)
   app.use(pinia)
   app.use(i18n)
 
+  // activate matomo stats
+  if (config.matomo_enabled) {
+    app.use(VueMatomo, {
+      host: config.matomo_host,
+      siteId: config.matomo_site_id,
+      trackerFileName: config.matomo_tracker_file_name,
+      router: router
+    })
+  }
+
   // provide config app-wide
   app.provide(constants.config, config)
 

ui/src/types/vue-matomo.d.ts

@@ -0,0 +1,18 @@
+/* Declare what we use in vue-matomo (this is far from complete but sufficient for our
+ usage, so that TypeScript compiler can check what needs to be) */
+declare module 'vue-matomo' {
+  import { PluginFunction } from 'vue'
+
+  interface VueMatomoOptions {
+    host: string
+    siteId: number
+    trackerFileName?: string
+    router: Router
+  }
+
+  const VueMatomo: {
+    install: PluginFunction<VueMatomoOptions>
+  }
+
+  export default VueMatomo
+}

ui/yarn.lock

@@ -2648,6 +2648,11 @@ [email protected]:
     "@intlify/shared" "10.0.1"
     "@vue/devtools-api" "^6.5.0"
 
+vue-matomo@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/vue-matomo/-/vue-matomo-4.2.0.tgz#d65e369e4ead1d95ef790bef3627512cac3d25e9"
+  integrity sha512-m5hCw7LH3wPDcERaF4sp/ojR9sEx7Rl8TpOyH/4jjQxMF2DuY/q5pO+i9o5Dx+BXLSa9+IQ0qhAbWYRyESQXmA==
+
 vue-router@^4.4.5:
   version "4.4.5"
   resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-4.4.5.tgz#bdf535e4cf32414ebdea6b4b403593efdb541388"