intercom script

AngelProtocolFinance · Dec 21, 2023 · b628e38 · b628e38
1 parent cb9c7bf
commit b628e38
Show file tree

Hide file tree

Showing 6 changed files with 46 additions and 22 deletions.
diff --git a/package.json b/package.json
@@ -80,7 +80,6 @@
  "react-redux": "^8.0.5",
  "react-router-dom": "^6.2.0",
  "react-scripts": "5.0.1",
- "react-use-intercom": "^5.3.0",
  "type-fest": "^3.9.0",
  "yup": "1.3.0"
  },

diff --git a/public/index.html b/public/index.html
@@ -30,6 +30,7 @@
  <body class="grid min-h-screen">
  <noscript>You need to enable JavaScript to run this app.</noscript>
  <div id="root" class="grid min-h-screen"></div>
+ <script src="%PUBLIC_URL%/scripts/intercom.js"></script>
  <!-- Twitter conversion tracking base code -->
  <script>
  !(function (e, t, n, s, u, a) {

diff --git a/public/scripts/intercom.js b/public/scripts/intercom.js
@@ -0,0 +1,39 @@
+//Set your APP_ID
+var APP_ID = "fh3v40sb";
+
+window.intercomSettings = {
+ app_id: APP_ID,
+};
+(function () {
+ var w = window;
+ var ic = w.Intercom;
+ if (typeof ic === "function") {
+ ic("reattach_activator");
+ ic("update", w.intercomSettings);
+ } else {
+ var d = document;
+ var i = function () {
+ i.c(arguments);
+ };
+ i.q = [];
+ i.c = function (args) {
+ i.q.push(args);
+ };
+ w.Intercom = i;
+ var l = function () {
+ var s = d.createElement("script");
+ s.type = "text/javascript";
+ s.async = true;
+ s.src = "https://widget.intercom.io/widget/" + APP_ID;
+ var x = d.getElementsByTagName("script")[0];
+ x.parentNode.insertBefore(s, x);
+ };
+ if (document.readyState === "complete") {
+ l();
+ } else if (w.attachEvent) {
+ w.attachEvent("onload", l);
+ } else {
+ w.addEventListener("load", l, false);
+ }
+ }
+})();
diff --git a/src/App/Footer/Footer.tsx b/src/App/Footer/Footer.tsx
@@ -1,5 +1,4 @@
 import { memo } from "react";
-import { useIntercom } from "react-use-intercom";
 import { LinkGroup, SocialMediaLink } from "../types";
 import { APP_NAME } from "constants/env";
 import Links from "./Links";
@@ -9,15 +8,15 @@ import Socials from "./Socials";
 type Props = { linkGroups: LinkGroup[]; socials: SocialMediaLink[] };
 
 function Footer({ linkGroups, socials }: Props) {
- const { shutdown, boot } = useIntercom();
-
  function ref(node: HTMLElement | null) {
  if (!node) return;
  const observer = new IntersectionObserver(
  ([e]) => {
- //more than 50% of footer is visible
- if (e.isIntersecting) return shutdown();
- boot(); //re-boots uses cached resources
+ const intercom = document.querySelector(
+ ".intercom-lightweight-app-launcher"
+ );
+ console.log(intercom);
+ intercom?.classList.toggle("hidden", e.isIntersecting);
  },
  { threshold: [0.5] }
  );

diff --git a/src/index.tsx b/src/index.tsx
@@ -4,7 +4,6 @@ import { StrictMode, Suspense, lazy } from "react";
 import { createRoot } from "react-dom/client";
 import { Provider } from "react-redux";
 import { BrowserRouter } from "react-router-dom";
-import { IntercomProvider } from "react-use-intercom";
 import Loader from "components/Loader";
 import { store } from "store/store";
 import ErrorBoundary from "errors/ErrorBoundary";
@@ -35,9 +34,7 @@ root.render(
  <BrowserRouter>
  <Suspense fallback={<LoaderComponent />}>
  <Authenticator.Provider>
- <IntercomProvider appId="fh3v40sb" autoBoot>
- <App />
- </IntercomProvider>
+ <App />
  </Authenticator.Provider>
  </Suspense>
  </BrowserRouter>

diff --git a/yarn.lock b/yarn.lock
@@ -7109,7 +7109,6 @@ __metadata:
  react-router-dom: ^6.2.0
  react-scripts: 5.0.1
  react-test-renderer: ^18.2.0
- react-use-intercom: ^5.3.0
  source-map-explorer: ^2.5.2
  tailwindcss: 3.3.0
  tsc-files: ^1.1.3
@@ -16829,16 +16828,6 @@ __metadata:
  languageName: node
  linkType: hard
 
-"react-use-intercom@npm:^5.3.0":
- version: 5.3.0
- resolution: "react-use-intercom@npm:5.3.0"
- peerDependencies:
- react: ">=16.8.0"
- react-dom: ">=16.8.0"
- checksum: b08e1aa92b93ebeea01aa89f799eaed51d27887026a5983458800e13a7cf20fc267b59b3d12e78eb04335428f3000ceb779c92b4cbd4348cd70811c733d12d8c
- languageName: node
- linkType: hard
-
 "react@npm:^18.2.0":
  version: 18.2.0
  resolution: "react@npm:18.2.0"