Merge pull request #694 from Sifchain/staging

hotfix/2.7.7 - add matomo analytics loader

app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "app",
-  "version": "2.7.6",
+  "version": "2.7.7",
   "private": true,
   "scripts": {
     "bump": "bump patch --tag --commit 'testnet release '",

app/src/analytics/loader.ts

@@ -0,0 +1,54 @@
+const createMatomoScript = ({ siteId = "", baseUrl = "", urlSuffix = "" }) => `
+var _paq = window._paq = window._paq || [];
+/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+_paq.push(['trackPageView']);
+_paq.push(['enableLinkTracking']);
+(function() {
+  var u="${baseUrl.replace(/\/$/, "")}";
+  _paq.push(['setTrackerUrl', u+'/${urlSuffix.replace(/^\//, "")}']);
+  _paq.push(['setSiteId', '${siteId}']);
+  var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+  g.async=true; g.src=u+'/matomo.js'; s.parentNode.insertBefore(g,s);
+})();
+`;
+
+type MinimumProviderConfig = {
+  url: string;
+  analytics: {
+    siteId: string;
+    baseUrl: string;
+    urlSuffix: string;
+    enabled?: boolean;
+  };
+};
+
+const ANALYTICS_SCRIPT_ID = "matomo-script";
+
+export default async function loadAnalytics() {
+  try {
+    const providers: MinimumProviderConfig[] = await fetch(
+      `https://registry.sifchain.network/api/providers`,
+    ).then((x) => x.json());
+
+    const { origin } = window.location;
+
+    const providerConfig = providers.find((x) => x?.url === origin);
+
+    if (
+      providerConfig &&
+      (providerConfig.analytics.enabled ?? true) &&
+      !document.getElementById(ANALYTICS_SCRIPT_ID)
+    ) {
+      const scriptSrc = createMatomoScript(providerConfig.analytics);
+      const script = document.createElement("script");
+      script.id = ANALYTICS_SCRIPT_ID;
+      script.innerHTML = scriptSrc;
+      document.head.appendChild(script);
+      return true;
+    }
+    return false;
+  } catch (error) {
+    console.warn("failed to load analytics:", error);
+    return false;
+  }
+}

app/src/main.ts

@@ -1,5 +1,6 @@
 import { createApp } from "vue";
 import { VueQueryPlugin, VueQueryPluginOptions } from "vue-query";
+import loadAnalytics from "./analytics/loader";
 import App from "./App";
 import router from "./router";
 import "./scss/index.css";
@@ -38,3 +39,11 @@ app.use(VueQueryPlugin, {
 
 app.use(vuexStore);
 app.use(router).mount("#app");
+
+loadAnalytics().then((loaded) => {
+  if (loaded) {
+    console.log("Analytics loaded");
+  } else {
+    console.log("Analytics not enabled for the current domain");
+  }
+});

package.json

@@ -1,6 +1,6 @@
 {
   "name": "sifchain-ui",
-  "version": "2.7.6",
+  "version": "2.7.7",
   "private": true,
   "license": "UNLICENSED",
   "packageManager": "[email protected]",