From d56242af2ca321e8e75fa82b14981feb1511ab58 Mon Sep 17 00:00:00 2001
From: Abi Raja <abimanyuraja@gmail.com>
Date: Fri, 7 Jun 2024 14:11:29 -0400
Subject: [PATCH] add crisp

---
 .../src/components/hosted/AppContainer.tsx    | 10 +++---
 frontend/src/config.ts                        |  3 ++
 frontend/src/lib/crisp.ts                     | 32 +++++++++++++++++++
 3 files changed, 39 insertions(+), 6 deletions(-)
 create mode 100644 frontend/src/lib/crisp.ts

diff --git a/frontend/src/components/hosted/AppContainer.tsx b/frontend/src/components/hosted/AppContainer.tsx
index 5e2040a..6fd5f85 100644
--- a/frontend/src/components/hosted/AppContainer.tsx
+++ b/frontend/src/components/hosted/AppContainer.tsx
@@ -9,6 +9,7 @@ import AvatarDropdown from "./AvatarDropdown";
 import { UserResponse } from "./types";
 import { POSTHOG_HOST, POSTHOG_KEY, SAAS_BACKEND_URL } from "../../config";
 import LandingPage from "./LandingPage";
+import { loadCrispChat } from "../../lib/crisp";
 
 function AppContainer() {
   const { isSignedIn, isLoaded } = useUser();
@@ -59,12 +60,9 @@ function AppContainer() {
           last_name: user.last_name,
         });
 
-        // Initialize Help Scout Beacon
-        window.Beacon("init", "8bcd8d6f-f25d-4339-8f49-703b9f165cdc");
-        window.Beacon("identify", {
-          name: user.first_name + " " + user.last_name,
-          email: user.email,
-        });
+        // Initialize Crisp Chat
+        loadCrispChat();
+        window.$crisp.push(["set", "user:email", [user.email]]);
 
         setSubscriberTier(user.subscriber_tier);
       }
diff --git a/frontend/src/config.ts b/frontend/src/config.ts
index b980304..dad5ad9 100644
--- a/frontend/src/config.ts
+++ b/frontend/src/config.ts
@@ -28,3 +28,6 @@ export const IS_FREE_TRIAL_ENABLED = false;
 // PostHog
 export const POSTHOG_KEY = import.meta.env.VITE_POSTHOG_KEY || null;
 export const POSTHOG_HOST = import.meta.env.VITE_POSTHOG_HOST || null;
+
+// Crisp
+export const CRISP_WEBSITE_ID = import.meta.env.VITE_CRISP_WEBSITE_ID || null;
diff --git a/frontend/src/lib/crisp.ts b/frontend/src/lib/crisp.ts
new file mode 100644
index 0000000..b9c3447
--- /dev/null
+++ b/frontend/src/lib/crisp.ts
@@ -0,0 +1,32 @@
+import { CRISP_WEBSITE_ID } from "../config";
+
+export const loadCrispChat = (): (() => void) => {
+  if (document.getElementById("crisp-chat-script")) {
+    // The script element already exists, so don't add it again
+    return () => {};
+  }
+
+  window.$crisp = [];
+  window.CRISP_WEBSITE_ID = CRISP_WEBSITE_ID;
+  const d = document;
+  const s = d.createElement("script");
+  s.src = "https://client.crisp.chat/l.js";
+  s.async = true;
+  d.getElementsByTagName("head")[0].appendChild(s);
+
+  return () => {
+    // Cleanup function to remove the script when it's no longer needed
+    const scriptElement = document.getElementById("crisp-chat-script");
+    if (scriptElement && scriptElement.parentNode) {
+      scriptElement.parentNode.removeChild(scriptElement);
+    }
+  };
+};
+
+declare global {
+  interface Window {
+    // Crisp
+    $crisp: unknown[];
+    CRISP_WEBSITE_ID: string;
+  }
+}