chore(tawk): set user (#813)

Coding-Coach · Jul 1, 2021 · c27fcd2 · c27fcd2
1 parent 3a333a5
commit c27fcd2
Show file tree

Hide file tree

Showing 4 changed files with 53 additions and 18 deletions.
diff --git a/public/index.html b/public/index.html
@@ -116,21 +116,6 @@
       ga('send', 'pageview');
     </script>
     <!-- End Google Analytics -->
-    <!--Start of Tawk.to Script-->
-    <script type="text/javascript">
-      var Tawk_API = Tawk_API || {},
-        Tawk_LoadStart = new Date();
-      (function() {
-        var s1 = document.createElement('script'),
-          s0 = document.getElementsByTagName('script')[0];
-        s1.async = true;
-        s1.src = 'https://embed.tawk.to/60a117b2185beb22b30dae86/1f5qk953t';
-        s1.charset = 'UTF-8';
-        s1.setAttribute('crossorigin', '*');
-        s0.parentNode.insertBefore(s1, s0);
-      })();
-    </script>
-    <!--End of Tawk.to Script-->
   </head>
 
   <body>

diff --git a/src/api/index.ts b/src/api/index.ts
@@ -5,6 +5,7 @@ import messages from '../messages';
 import shuffle from 'lodash/shuffle';
 import * as Sentry from '@sentry/browser';
 import { Application, Mentor, User } from '../types/models';
+import { setVisitor } from '../utils/tawk';
 
 type RequestMethod = 'POST' | 'GET' | 'PUT' | 'DELETE';
 type ErrorResponse = {
@@ -106,14 +107,22 @@ async function fetchCurrentItem() {
   currentUser = await makeApiCall<User>(`${paths.USERS}/current`).then(
     response => {
       if (response?.success) {
+        const { _id, email, name, roles } = response.data;
+
         Sentry.configureScope(scope => {
           scope.setUser({
-            id: response.data._id,
-            email: response.data.email,
-            username: response.data.name,
+            email,
+            id: _id,
+            username: name,
           });
         });
 
+        setVisitor({
+          name,
+          email,
+          roles,
+        });
+
         return response.data;
       }
     }

diff --git a/src/external-types.d.ts b/src/external-types.d.ts
@@ -0,0 +1,7 @@
+import { TawkAPI } from './utils/tawk';
+
+export declare global {
+  interface Window {
+    Tawk_API: TawkAPI;
+  }
+}
diff --git a/src/utils/tawk.ts b/src/utils/tawk.ts
@@ -0,0 +1,34 @@
+import { UserRole } from '../types/models';
+
+type Visitor = {
+  name: string;
+  email: string;
+  roles: UserRole[];
+};
+
+export type TawkAPI = {
+  visitor: Visitor;
+  onLoad(): void;
+  addTags(tags: UserRole[], callback?: () => void): void;
+};
+
+function init() {
+  (function() {
+    const s1 = document.createElement('script');
+    s1.async = true;
+    s1.src = 'https://embed.tawk.to/60a117b2185beb22b30dae86/1f5qk953t';
+    s1.setAttribute('crossorigin', '*');
+    document.head.prepend(s1);
+  })();
+
+  window.Tawk_API = window.Tawk_API || {};
+  window.Tawk_API.onLoad = function() {
+    window.Tawk_API.addTags(['Mentor', 'User']);
+  };
+}
+
+export function setVisitor(visitor: Visitor): void {
+  window.Tawk_API.visitor = visitor;
+}
+
+init();