From 9cb08956c063efd30c12150d377a94b09ed9dc51 Mon Sep 17 00:00:00 2001
From: Mike Cao <mike@mikecao.com>
Date: Sun, 19 Jul 2020 02:23:15 -0700
Subject: [PATCH] Updated event handling.

---
 lib/db.js                 |  9 +++++----
 lib/utils.js              |  8 ++++----
 pages/api/collect.js      |  4 ++--
 pages/index.js            |  2 +-
 public/umami.js           |  2 +-
 scripts/umami/index.js    | 33 +++++----------------------------
 sql/schema.postgresql.sql |  2 +-
 7 files changed, 19 insertions(+), 41 deletions(-)

diff --git a/lib/db.js b/lib/db.js
index 8725f88c..57518b18 100644
--- a/lib/db.js
+++ b/lib/db.js
@@ -5,6 +5,7 @@ const prisma = new PrismaClient();
 export async function runQuery(query) {
   return query
     .catch(e => {
+      console.error(e);
       throw e;
     })
     .finally(async () => {
@@ -69,9 +70,9 @@ export async function savePageView(website_id, session_id, url, referrer) {
   );
 }
 
-export async function saveEvent(website_id, session_id, url, eventType, eventValue) {
+export async function saveEvent(website_id, session_id, url, event_type, event_value) {
   return runQuery(
-    prisma.pageview.create({
+    prisma.event.create({
       data: {
         website: {
           connect: {
@@ -84,8 +85,8 @@ export async function saveEvent(website_id, session_id, url, eventType, eventVal
           },
         },
         url,
-        eventType,
-        eventValue,
+        event_type,
+        event_value,
       },
     }),
   );
diff --git a/lib/utils.js b/lib/utils.js
index c2730f70..52f76160 100644
--- a/lib/utils.js
+++ b/lib/utils.js
@@ -91,8 +91,8 @@ export function parseCollectRequest(req) {
       const {
         url,
         referrer,
-        eventType,
-        eventValue,
+        event_type,
+        event_value,
         session: { website_id, session_id, time, hash: validationHash },
       } = payload;
 
@@ -109,8 +109,8 @@ export function parseCollectRequest(req) {
           session_id,
           url,
           referrer,
-          eventType,
-          eventValue,
+          event_type,
+          event_value,
         };
       }
     }
diff --git a/pages/api/collect.js b/pages/api/collect.js
index 724191f8..b1573673 100644
--- a/pages/api/collect.js
+++ b/pages/api/collect.js
@@ -8,14 +8,14 @@ export default async (req, res) => {
   const values = parseCollectRequest(req);
 
   if (values.success) {
-    const { type, website_id, session_id, url, referrer, eventType, eventValue } = values;
+    const { type, website_id, session_id, url, referrer, event_type, event_value } = values;
 
     if (type === 'pageview') {
       await savePageView(website_id, session_id, url, referrer).catch(() => {
         values.success = 0;
       });
     } else if (type === 'event') {
-      await saveEvent(website_id, session_id, url, eventType, eventValue).catch(() => {
+      await saveEvent(website_id, session_id, url, event_type, event_value).catch(() => {
         values.success = 0;
       });
     }
diff --git a/pages/index.js b/pages/index.js
index 0bd3d0ac..e8681e22 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -15,7 +15,7 @@ export default function Home() {
         <a>123</a>
       </Link>
       <br />
-      <button id="primary-button" className="otherClass umami--click" type="button">
+      <button id="primary-button" className="otherClass umami--click--primary-button" type="button">
         Button
       </button>
     </Layout>
diff --git a/public/umami.js b/public/umami.js
index b4ab7334..3d201df3 100644
--- a/public/umami.js
+++ b/public/umami.js
@@ -1 +1 @@
-!function(){"use strict";function e(e){var t=this.constructor;return this.then((function(n){return t.resolve(e()).then((function(){return n}))}),(function(n){return t.resolve(e()).then((function(){return t.reject(n)}))}))}var t=setTimeout;function n(e){return Boolean(e&&void 0!==e.length)}function r(){}function o(e){if(!(this instanceof o))throw new TypeError("Promises must be constructed via new");if("function"!=typeof e)throw new TypeError("not a function");this._state=0,this._handled=!1,this._value=void 0,this._deferreds=[],f(e,this)}function i(e,t){for(;3===e._state;)e=e._value;0!==e._state?(e._handled=!0,o._immediateFn((function(){var n=1===e._state?t.onFulfilled:t.onRejected;if(null!==n){var r;try{r=n(e._value)}catch(e){return void s(t.promise,e)}u(t.promise,r)}else(1===e._state?u:s)(t.promise,e._value)}))):e._deferreds.push(t)}function u(e,t){try{if(t===e)throw new TypeError("A promise cannot be resolved with itself.");if(t&&("object"==typeof t||"function"==typeof t)){var n=t.then;if(t instanceof o)return e._state=3,e._value=t,void c(e);if("function"==typeof n)return void f((r=n,i=t,function(){r.apply(i,arguments)}),e)}e._state=1,e._value=t,c(e)}catch(t){s(e,t)}var r,i}function s(e,t){e._state=2,e._value=t,c(e)}function c(e){2===e._state&&0===e._deferreds.length&&o._immediateFn((function(){e._handled||o._unhandledRejectionFn(e._value)}));for(var t=0,n=e._deferreds.length;t<n;t++)i(e,e._deferreds[t]);e._deferreds=null}function a(e,t,n){this.onFulfilled="function"==typeof e?e:null,this.onRejected="function"==typeof t?t:null,this.promise=n}function f(e,t){var n=!1;try{e((function(e){n||(n=!0,u(t,e))}),(function(e){n||(n=!0,s(t,e))}))}catch(e){if(n)return;n=!0,s(t,e)}}o.prototype["catch"]=function(e){return this.then(null,e)},o.prototype.then=function(e,t){var n=new this.constructor(r);return i(this,new a(e,t,n)),n},o.prototype["finally"]=e,o.all=function(e){return new o((function(t,r){if(!n(e))return r(new TypeError("Promise.all accepts an array"));var o=Array.prototype.slice.call(e);if(0===o.length)return t([]);var i=o.length;function u(e,n){try{if(n&&("object"==typeof n||"function"==typeof n)){var s=n.then;if("function"==typeof s)return void s.call(n,(function(t){u(e,t)}),r)}o[e]=n,0==--i&&t(o)}catch(e){r(e)}}for(var s=0;s<o.length;s++)u(s,o[s])}))},o.resolve=function(e){return e&&"object"==typeof e&&e.constructor===o?e:new o((function(t){t(e)}))},o.reject=function(e){return new o((function(t,n){n(e)}))},o.race=function(e){return new o((function(t,r){if(!n(e))return r(new TypeError("Promise.race accepts an array"));for(var i=0,u=e.length;i<u;i++)o.resolve(e[i]).then(t,r)}))},o._immediateFn="function"==typeof setImmediate&&function(e){setImmediate(e)}||function(e){t(e,0)},o._unhandledRejectionFn=function(e){"undefined"!=typeof console&&console&&console.warn("Possible Unhandled Promise Rejection:",e)};var l=function(){if("undefined"!=typeof self)return self;if("undefined"!=typeof window)return window;if("undefined"!=typeof global)return global;throw new Error("unable to locate global object")}();"Promise"in l?l.Promise.prototype["finally"]||(l.Promise.prototype["finally"]=e):l["Promise"]=o,self.fetch||(self.fetch=function(e,t){return t=t||{},new Promise((function(n,r){var o=new XMLHttpRequest,i=[],u=[],s={},c=function(){return{ok:2==(o.status/100|0),statusText:o.statusText,status:o.status,url:o.responseURL,text:function(){return Promise.resolve(o.responseText)},json:function(){return Promise.resolve(JSON.parse(o.responseText))},blob:function(){return Promise.resolve(new Blob([o.response]))},clone:c,headers:{keys:function(){return i},entries:function(){return u},get:function(e){return s[e.toLowerCase()]},has:function(e){return e.toLowerCase()in s}}}};for(var a in o.open(t.method||"get",e,!0),o.onload=function(){o.getAllResponseHeaders().replace(/^(.*?):[^\S\n]*([\s\S]*?)$/gm,(function(e,t,n){i.push(t=t.toLowerCase()),u.push([t,n]),s[t]=s[t]?s[t]+","+n:n})),n(c())},o.onerror=r,o.withCredentials="include"==t.credentials,t.headers)o.setRequestHeader(a,t.headers[a]);o.send(t.body||null)}))});var d=window.screen,p=d.width,h=d.height,v=window.navigator.language,y=window.location,m=y.hostname,w=y.pathname,g=y.search,_=window.localStorage,b=window.document,j=window.history,P=b.querySelector("script[data-website-id]");if(P){var S=P.getAttribute("data-website-id");if(S){var T="umami.session",R=new URL(P.src).origin,E=p+"x"+h,x=""+w+g,A=b.referrer,L=function(e,t){return fetch(e,{method:"post",cache:"no-cache",headers:{Accept:"application/json","Content-Type":"application/json"},body:JSON.stringify(t)}).then((function(e){return e.json()}))},N=function(e){return L(R+"/api/session",e).then((function(e){var t=e.success,n=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&-1===t.indexOf(r)&&(n[r]=e[r]);return n}(e,["success"]);if(t)return _.setItem(T,JSON.stringify(n)),t}))},O=function(){return JSON.parse(_.getItem(T))},F=function(e,t){return L(R+"/api/collect",{type:"pageview",payload:{url:e,referrer:t,session:O()}}).then((function(e){var t=e.success;return t||_.removeItem(T),t}))},I=function(e){return JSON.stringify(e.getAttributeNames().reduce((function(t,n){return t[n]=e.getAttribute(n),t}),{tag:e.tagName.toLowerCase()}))},C=function(e,t){var n=function(e){return{website_id:S,hostname:m,url:e,screen:E,language:v}}(e);_.getItem(T)?F(e,t).then((function(r){return!r&&N(n).then((function(n){return n&&F(e,t)}))})):N(n).then((function(n){return n&&F(e,t)}))},J=function(e,t,n){A=x,C(x=n,A)},q=function(e,t){var n=j[e];return function(e,r,o){var i=[e,r,o];return t.apply(null,i),n.apply(j,i)}};j.pushState=q("pushState",J),j.replaceState=q("replaceState",J),b.querySelectorAll("[class*='umami--']").forEach((function(e){e.className.split(" ").forEach((function(t){if(console.log("class",t),/^umami--/.test(t)){var n=t.split("--")[1];console.log("event",n),n&&e.addEventListener(n,(function(){var t,r,o;t=x,r=n,o=I(e),L(R+"/api/collect",{type:"event",payload:{url:t,eventType:r,eventValue:o,session:O()}}).then((function(e){var t=e.success;return t||_.removeItem(T),t})),console.log("exec event",n,I(e))}))}})),console.log("match",e)})),C(x,A)}}}();
+!function(){"use strict";function e(e){var t=this.constructor;return this.then((function(n){return t.resolve(e()).then((function(){return n}))}),(function(n){return t.resolve(e()).then((function(){return t.reject(n)}))}))}var t=setTimeout;function n(e){return Boolean(e&&void 0!==e.length)}function r(){}function o(e){if(!(this instanceof o))throw new TypeError("Promises must be constructed via new");if("function"!=typeof e)throw new TypeError("not a function");this._state=0,this._handled=!1,this._value=void 0,this._deferreds=[],f(e,this)}function i(e,t){for(;3===e._state;)e=e._value;0!==e._state?(e._handled=!0,o._immediateFn((function(){var n=1===e._state?t.onFulfilled:t.onRejected;if(null!==n){var r;try{r=n(e._value)}catch(e){return void s(t.promise,e)}u(t.promise,r)}else(1===e._state?u:s)(t.promise,e._value)}))):e._deferreds.push(t)}function u(e,t){try{if(t===e)throw new TypeError("A promise cannot be resolved with itself.");if(t&&("object"==typeof t||"function"==typeof t)){var n=t.then;if(t instanceof o)return e._state=3,e._value=t,void a(e);if("function"==typeof n)return void f((r=n,i=t,function(){r.apply(i,arguments)}),e)}e._state=1,e._value=t,a(e)}catch(t){s(e,t)}var r,i}function s(e,t){e._state=2,e._value=t,a(e)}function a(e){2===e._state&&0===e._deferreds.length&&o._immediateFn((function(){e._handled||o._unhandledRejectionFn(e._value)}));for(var t=0,n=e._deferreds.length;t<n;t++)i(e,e._deferreds[t]);e._deferreds=null}function c(e,t,n){this.onFulfilled="function"==typeof e?e:null,this.onRejected="function"==typeof t?t:null,this.promise=n}function f(e,t){var n=!1;try{e((function(e){n||(n=!0,u(t,e))}),(function(e){n||(n=!0,s(t,e))}))}catch(e){if(n)return;n=!0,s(t,e)}}o.prototype["catch"]=function(e){return this.then(null,e)},o.prototype.then=function(e,t){var n=new this.constructor(r);return i(this,new c(e,t,n)),n},o.prototype["finally"]=e,o.all=function(e){return new o((function(t,r){if(!n(e))return r(new TypeError("Promise.all accepts an array"));var o=Array.prototype.slice.call(e);if(0===o.length)return t([]);var i=o.length;function u(e,n){try{if(n&&("object"==typeof n||"function"==typeof n)){var s=n.then;if("function"==typeof s)return void s.call(n,(function(t){u(e,t)}),r)}o[e]=n,0==--i&&t(o)}catch(e){r(e)}}for(var s=0;s<o.length;s++)u(s,o[s])}))},o.resolve=function(e){return e&&"object"==typeof e&&e.constructor===o?e:new o((function(t){t(e)}))},o.reject=function(e){return new o((function(t,n){n(e)}))},o.race=function(e){return new o((function(t,r){if(!n(e))return r(new TypeError("Promise.race accepts an array"));for(var i=0,u=e.length;i<u;i++)o.resolve(e[i]).then(t,r)}))},o._immediateFn="function"==typeof setImmediate&&function(e){setImmediate(e)}||function(e){t(e,0)},o._unhandledRejectionFn=function(e){"undefined"!=typeof console&&console&&console.warn("Possible Unhandled Promise Rejection:",e)};var l=function(){if("undefined"!=typeof self)return self;if("undefined"!=typeof window)return window;if("undefined"!=typeof global)return global;throw new Error("unable to locate global object")}();"Promise"in l?l.Promise.prototype["finally"]||(l.Promise.prototype["finally"]=e):l["Promise"]=o,self.fetch||(self.fetch=function(e,t){return t=t||{},new Promise((function(n,r){var o=new XMLHttpRequest,i=[],u=[],s={},a=function(){return{ok:2==(o.status/100|0),statusText:o.statusText,status:o.status,url:o.responseURL,text:function(){return Promise.resolve(o.responseText)},json:function(){return Promise.resolve(JSON.parse(o.responseText))},blob:function(){return Promise.resolve(new Blob([o.response]))},clone:a,headers:{keys:function(){return i},entries:function(){return u},get:function(e){return s[e.toLowerCase()]},has:function(e){return e.toLowerCase()in s}}}};for(var c in o.open(t.method||"get",e,!0),o.onload=function(){o.getAllResponseHeaders().replace(/^(.*?):[^\S\n]*([\s\S]*?)$/gm,(function(e,t,n){i.push(t=t.toLowerCase()),u.push([t,n]),s[t]=s[t]?s[t]+","+n:n})),n(a())},o.onerror=r,o.withCredentials="include"==t.credentials,t.headers)o.setRequestHeader(c,t.headers[c]);o.send(t.body||null)}))});var p=window.screen,d=p.width,h=p.height,v=window.navigator.language,y=window.location,w=y.hostname,m=y.pathname,_=y.search,g=window.localStorage,b=window.document,j=window.history,P=b.querySelector("script[data-website-id]");if(P){var S=P.getAttribute("data-website-id");if(S){var T="umami.session",R=new URL(P.src).origin,E=d+"x"+h,x=""+m+_,F=b.referrer,L=function(e,t){return fetch(e,{method:"post",cache:"no-cache",headers:{Accept:"application/json","Content-Type":"application/json"},body:JSON.stringify(t)}).then((function(e){return e.json()}))},O=function(e){return L(R+"/api/session",e).then((function(e){var t=e.success,n=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&-1===t.indexOf(r)&&(n[r]=e[r]);return n}(e,["success"]);if(t)return g.setItem(T,JSON.stringify(n)),t}))},A=function(){return JSON.parse(g.getItem(T))},I=function(e,t){return L(R+"/api/collect",{type:"pageview",payload:{url:e,referrer:t,session:A()}}).then((function(e){var t=e.success;return t||g.removeItem(T),t}))},C=function(e,t){var n=function(e){return{website_id:S,hostname:w,url:e,screen:E,language:v}}(e);g.getItem(T)?I(e,t).then((function(r){return!r&&O(n).then((function(n){return n&&I(e,t)}))})):O(n).then((function(n){return n&&I(e,t)}))},N=function(e,t,n){F=x,C(x=n,F)},q=function(e,t){var n=j[e];return function(e,r,o){var i=[e,r,o];return t.apply(null,i),n.apply(j,i)}};j.pushState=q("pushState",N),j.replaceState=q("replaceState",N),b.querySelectorAll("[class*='umami--']").forEach((function(e){e.className.split(" ").forEach((function(t){if(/^umami--/.test(t)){var n=t.split("--"),r=n[1],o=n[2];r&&o&&e.addEventListener(r,(function(){return L(R+"/api/collect",{type:"event",payload:{url:x,event_type:r,event_value:o,session:A()}})}),!0)}}))})),C(x,F)}}}();
diff --git a/scripts/umami/index.js b/scripts/umami/index.js
index 3981b62d..941e6c04 100644
--- a/scripts/umami/index.js
+++ b/scripts/umami/index.js
@@ -60,29 +60,12 @@ if (script) {
         return success;
       });
 
-    const trackEvent = (url, eventType, eventValue) =>
+    const trackEvent = (url, event_type, event_value) =>
       post(`${hostUrl}/api/collect`, {
         type: 'event',
-        payload: { url, eventType, eventValue, session: getSession() },
-      }).then(({ success }) => {
-        if (!success) {
-          store.removeItem(sessionKey);
-        }
-        return success;
+        payload: { url, event_type, event_value, session: getSession() },
       });
 
-    const elementToString = e => {
-      return JSON.stringify(
-        e.getAttributeNames().reduce(
-          (obj, val) => {
-            obj[val] = e.getAttribute(val);
-            return obj;
-          },
-          { tag: e.tagName.toLowerCase() },
-        ),
-      );
-    };
-
     const execute = (url, referrer) => {
       const data = getSessionData(url);
 
@@ -120,19 +103,13 @@ if (script) {
 
     document.querySelectorAll("[class*='umami--']").forEach(e => {
       e.className.split(' ').forEach(c => {
-        console.log('class', c);
         if (/^umami--/.test(c)) {
-          const [, event] = c.split('--');
-          console.log('event', event);
-          if (event) {
-            e.addEventListener(event, () => {
-              trackEvent(currentUrl, event, elementToString(e));
-              console.log('exec event', event, elementToString(e));
-            });
+          const [, event, value] = c.split('--');
+          if (event && value) {
+            e.addEventListener(event, () => trackEvent(currentUrl, event, value), true);
           }
         }
       });
-      console.log('match', e);
     });
 
     /* Start */
diff --git a/sql/schema.postgresql.sql b/sql/schema.postgresql.sql
index da65c4b3..8076c1fa 100644
--- a/sql/schema.postgresql.sql
+++ b/sql/schema.postgresql.sql
@@ -34,7 +34,7 @@ create table event (
     created_at timestamp with time zone default current_timestamp,
     url varchar(500) not null,
     event_type varchar(50) not null,
-    event_value varchar(255) not null
+    event_value varchar(50) not null
 );
 
 create index on session(created_at);