Merge pull request #621 from ResearchHub/sift

Sift Intergration
ResearchHub · Sep 15, 2020 · 0b0b2f7 · 0b0b2f7
2 parents 7845221 + 79b4347
commit 0b0b2f7
Show file tree

Hide file tree

Showing 2 changed files with 61 additions and 0 deletions.
diff --git a/config/constants.js b/config/constants.js
@@ -52,3 +52,5 @@ export const MAINNET_CHAIN_ID = "1";
 export const RINKEBY_CHAIN_ID = "4";
 
 export const RECAPTCHA_CLIENT_KEY = "6LdxeboZAAAAAEgn_Oa0VnohS724vZhI3_ezLbVD";
+
+export const SIFT_BEACON_KEY = "891d8fb796";
diff --git a/pages/Base.js b/pages/Base.js
@@ -20,6 +20,7 @@ import { BannerActions } from "~/redux/banner";
 
 import PermissionActions from "../redux/permission";
 import Footer from "./footer";
+import { SIFT_BEACON_KEY } from "~/config/constants";
 
 class Base extends React.Component {
   componentDidMount = async () => {
@@ -44,13 +45,71 @@ class Base extends React.Component {
     if (auth.isLoggedIn) {
       getWithdrawals();
       getNotifications();
+      this.connectSift();
     }
     getUserBannerPreference();
     determineBanner();
     fetchPermissionsPending();
     await fetchPermissions();
   };
 
+  componentDidUpdate(prevProps) {
+    if (!prevProps.auth.isLoggedIn && this.props.auth.isLoggedIn) {
+      this.connectSift();
+    } else if (prevProps.auth.isLoggedIn && !this.props.auth.isLoggedIn) {
+      this.disconnectSift();
+    }
+  }
+
+  componentWillUnmount() {
+    window.removeEventListener("load", this.loadSift);
+  }
+
+  connectSift = () => {
+    let _user_id = this.props.auth.user.id;
+    let _session_id = this.uniqueId();
+    let _sift = (window._sift = window._sift || []);
+    _sift.push(["_setAccount", SIFT_BEACON_KEY]);
+    _sift.push(["_setUserId", _user_id]);
+    _sift.push(["_setSessionId", _session_id]);
+    _sift.push(["_trackPageview"]);
+
+    if (window.attachEvent) {
+      window.attachEvent("onload", this.loadSift);
+    } else {
+      window.addEventListener("load", this.loadSift, false);
+    }
+
+    this.loadSift();
+  };
+
+  disconnectSift = () => {
+    let sift = document.getElementById("sift");
+    sift.parentNode.removeChild(sift);
+  };
+
+  loadSift = () => {
+    if (this.props.auth.isLoggedIn) {
+      if (!document.getElementById("sift")) {
+        // only attach script if it isn't there
+        let script = document.createElement("script");
+        script.setAttribute("id", "sift");
+        script.src = "https://cdn.sift.com/s.js";
+        document.body.appendChild(script);
+      }
+    } else {
+      this.disconnectSift();
+    }
+  };
+
+  uniqueId = () => {
+    return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function(c) {
+      var r = (Math.random() * 16) | 0,
+        v = c == "x" ? r : (r & 0x3) | 0x8;
+      return v.toString(16);
+    });
+  };
+
   render() {
     const { Component, pageProps } = this.props;
     const options = {