diff --git a/frontend/app/App.tsx b/frontend/app/App.tsx index f6e010669726..0b18bd3fba10 100644 --- a/frontend/app/App.tsx +++ b/frontend/app/App.tsx @@ -19,6 +19,7 @@ import { ChatsProvider } from "@/lib/context/ChatsProvider"; import { MenuProvider } from "@/lib/context/MenuProvider/Menu-provider"; import { SearchModalProvider } from "@/lib/context/SearchModalProvider/search-modal-provider"; import { useSupabase } from "@/lib/context/SupabaseProvider"; +import { IntercomProvider } from "@/lib/helpers/intercom/IntercomProvider"; import { UpdateMetadata } from "@/lib/helpers/updateMetadata"; import { usePageTracking } from "@/services/analytics/june/usePageTracking"; import "../lib/config/LocaleConfig/i18n"; @@ -55,19 +56,21 @@ const App = ({ children }: PropsWithChildren): JSX.Element => { return ( -
- - - -
- -
- {children} + +
+ + + +
+ +
+ {children} +
+
- -
- -
+ +
+ ); }; diff --git a/frontend/lib/helpers/intercom/IntercomProvider.ts b/frontend/lib/helpers/intercom/IntercomProvider.ts new file mode 100644 index 000000000000..fd5bfd9e507f --- /dev/null +++ b/frontend/lib/helpers/intercom/IntercomProvider.ts @@ -0,0 +1,35 @@ +import { usePathname } from "next/navigation"; +import { useEffect } from "react"; + +import { useUserData } from "@/lib/hooks/useUserData"; + +import { + boot as bootIntercom, + load as loadIntercom, + update as updateIntercom, +} from "./intercom"; + +export const IntercomProvider = ({ + children, +}: { + children: React.ReactNode; +}): React.ReactNode => { + const pathname = usePathname(); + const { userData } = useUserData(); + + if ( + typeof window !== "undefined" && + process.env.NEXT_PUBLIC_INTERCOM_APP_ID + ) { + loadIntercom(); + bootIntercom(userData?.email ?? ""); + } + + useEffect(() => { + if (process.env.NEXT_PUBLIC_INTERCOM_APP_ID) { + updateIntercom(); + } + }, [pathname]); + + return children; +}; diff --git a/frontend/lib/helpers/intercom/intercom.ts b/frontend/lib/helpers/intercom/intercom.ts new file mode 100644 index 000000000000..deec123b7c46 --- /dev/null +++ b/frontend/lib/helpers/intercom/intercom.ts @@ -0,0 +1,17 @@ +/* eslint-disable */ +export const APP_ID = process.env.NEXT_PUBLIC_INTERCOM_APP_ID; + +// prettier-ignore +export const load = (): void => { + (function(){const w=window;const ic=(w as any).Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',(w as any).intercomSettings);}else{const d=document;const i=function(){i.c(arguments);};i.q=[] as any[];i.c=function(args: any){i.q.push(args);};(w as any).Intercom=i;const l=function(){const s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/' + APP_ID;const x=d.getElementsByTagName('script')[0];x.parentNode?.insertBefore(s, x);};if(document.readyState==='complete'){l();}else if((w as any).attachEvent){(window as any).attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})(); +} + +// Initializes Intercom +export const boot = (email: string): void => { + (window as any).Intercom && + (window as any).Intercom("boot", { app_id: APP_ID, email }); +}; + +export const update = (): void => { + window && (window as any).Intercom && (window as any).Intercom("update"); +}; diff --git a/frontend/next.config.js b/frontend/next.config.js index 69d407b23e00..c402d02ba8a7 100644 --- a/frontend/next.config.js +++ b/frontend/next.config.js @@ -50,6 +50,8 @@ const ContentSecurityPolicy = { "https://api.june.so", "https://us.posthog.com", "https://preview.quivr.app", + "*.intercom.io", + "*.intercomcdn.com", "https://*.vercel.app", process.env.NEXT_PUBLIC_FRONTEND_URL, ], @@ -58,6 +60,8 @@ const ContentSecurityPolicy = { process.env.NEXT_PUBLIC_SUPABASE_URL, process.env.NEXT_PUBLIC_BACKEND_URL, process.env.NEXT_PUBLIC_CMS_URL, + "*.intercom.io", + "*.intercomcdn.com", "https://api.june.so", "https://api.openai.com", "https://cdn.growthbook.io", @@ -67,6 +71,8 @@ const ContentSecurityPolicy = { "img-src": [ "'self'", "https://www.gravatar.com", + "*.intercom.io", + "*.intercomcdn.com", "https://quivr-cms.s3.eu-west-3.amazonaws.com", "data:", "*", @@ -83,6 +89,8 @@ const ContentSecurityPolicy = { "'unsafe-inline'", "'unsafe-eval'", "https://va.vercel-scripts.com/", + "*.intercom.io", + "*.intercomcdn.com", process.env.NEXT_PUBLIC_FRONTEND_URL, "https://preview.quivr.app", "https://*.vercel.app",