[WEB-5559] improvement: chat support functionality and remove Intercom provider (#8217)

* [WEB-5559] improve: chat support functionality and remove Intercom provider

- Added ChatSupportModal component for chat support integration.
- Replaced IntercomProvider with ChatSupportModal in AppProvider.
- Introduced useChatSupport hook to manage chat support state and actions.
- Updated help commands to utilize chat support instead of Intercom.
- Removed obsolete Intercom-related components and hooks.

* refactor: lazy load ChatSupportModal in AppProvider

Author: prateekshourya29

apps/web/app/provider.tsx

@@ -25,8 +25,8 @@ const PostHogProvider = lazy(function PostHogProvider() {
   return import("@/lib/posthog-provider");
 });
 
-const IntercomProvider = lazy(function IntercomProvider() {
-  return import("@/lib/intercom-provider");
+const ChatSupportModal = lazy(function ChatSupportModal() {
+  return import("@/components/global/chat-support-modal");
 });
 
 export interface IAppProvider {
@@ -50,11 +50,10 @@ export function AppProvider(props: IAppProvider) {
           <StoreWrapper>
             <InstanceWrapper>
               <Suspense>
-                <IntercomProvider>
-                  <PostHogProvider>
-                    <SWRConfig value={WEB_SWR_CONFIG}>{children}</SWRConfig>
-                  </PostHogProvider>
-                </IntercomProvider>
+                <ChatSupportModal />
+                <PostHogProvider>
+                  <SWRConfig value={WEB_SWR_CONFIG}>{children}</SWRConfig>
+                </PostHogProvider>
               </Suspense>
             </InstanceWrapper>
           </StoreWrapper>

apps/web/core/components/global/chat-support-modal.tsx

@@ -0,0 +1,43 @@
+import { useEffect } from "react";
+import { Intercom, shutdown, show } from "@intercom/messenger-js-sdk";
+import { observer } from "mobx-react";
+// custom events
+import { CHAT_SUPPORT_EVENTS } from "@/custom-events/chat-support";
+// store hooks
+import { useInstance } from "@/hooks/store/use-instance";
+import { useUser } from "@/hooks/store/user";
+
+const ChatSupportModal = observer(function ChatSupportModal() {
+  // store hooks
+  const { data: user } = useUser();
+  const { config } = useInstance();
+  // derived values
+  const intercomAppId = config?.intercom_app_id;
+  const isEnabled = Boolean(user && config?.is_intercom_enabled && intercomAppId);
+
+  useEffect(() => {
+    if (!isEnabled || !user || !intercomAppId) return;
+
+    Intercom({
+      app_id: intercomAppId,
+      user_id: user.id,
+      name: `${user.first_name} ${user.last_name}`,
+      email: user.email,
+      hide_default_launcher: true,
+    });
+
+    const handleOpenChatSupport = () => {
+      show();
+    };
+
+    window.addEventListener(CHAT_SUPPORT_EVENTS.open, handleOpenChatSupport);
+    return () => {
+      window.removeEventListener(CHAT_SUPPORT_EVENTS.open, handleOpenChatSupport);
+      shutdown();
+    };
+  }, [user, intercomAppId, isEnabled]);
+
+  return null;
+});
+
+export default ChatSupportModal;

apps/web/core/components/power-k/config/help-commands.ts

@@ -5,15 +5,15 @@ import { DiscordIcon } from "@plane/propel/icons";
 import type { TPowerKCommandConfig } from "@/components/power-k/core/types";
 // hooks
 import { usePowerK } from "@/hooks/store/use-power-k";
-import { useTransient } from "@/hooks/store/use-transient";
+import { useChatSupport } from "@/hooks/use-chat-support";
 
 /**
  * Help commands - Help related commands
  */
 export const usePowerKHelpCommands = (): TPowerKCommandConfig[] => {
   // store
   const { toggleShortcutsListModal } = usePowerK();
-  const { toggleIntercom } = useTransient();
+  const { isEnabled: isChatSupportEnabled, openChatSupport } = useChatSupport();
 
   return [
     {
@@ -73,9 +73,9 @@ export const usePowerKHelpCommands = (): TPowerKCommandConfig[] => {
       group: "help",
       i18n_title: "power_k.help_actions.chat_with_us",
       icon: MessageSquare,
-      action: () => toggleIntercom(true),
-      isEnabled: () => true,
-      isVisible: () => true,
+      action: () => openChatSupport(),
+      isEnabled: () => isChatSupportEnabled,
+      isVisible: () => isChatSupportEnabled,
       closeOnSelect: true,
     },
   ];