feat: integrate contextual help drawer feature flag and enhance customer support button functionality

Author: djabarovgeorge

apps/dashboard/src/components/header-navigation/customer-support-button.tsx

@@ -5,10 +5,13 @@ import { IS_SELF_HOSTED } from '../../config';
 import { openInNewTab } from '../../utils/url';
 import { HeaderButton } from './header-button';
 import { SupportDrawer } from './support-drawer';
+import { useFeatureFlag } from '@/hooks/use-feature-flag';
+import { FeatureFlagsKeysEnum } from '@novu/shared';
 
 export const CustomerSupportButton = () => {
-  usePlainChat();
   useBootIntercom();
+  const { showPlainLiveChat } = usePlainChat();
+  const isContextualHelpEnabled = useFeatureFlag(FeatureFlagsKeysEnum.IS_CONTEXTUAL_HELP_DRAWER_ENABLED);
 
   if (IS_SELF_HOSTED) {
     return (
@@ -24,13 +27,19 @@ export const CustomerSupportButton = () => {
     );
   }
 
-  return (
+  return isContextualHelpEnabled ? (
     <SupportDrawer>
       <button tabIndex={-1} className="flex items-center justify-center">
         <HeaderButton label="Help">
           <RiQuestionFill className="text-foreground-600 size-4" />
         </HeaderButton>
       </button>
     </SupportDrawer>
+  ) : (
+    <button tabIndex={-1} className="flex items-center justify-center" onClick={() => showPlainLiveChat()}>
+      <HeaderButton label="Help">
+        <RiQuestionFill className="text-foreground-600 size-4" />
+      </HeaderButton>
+    </button>
   );
 };

packages/shared/src/types/feature-flags.ts

@@ -72,6 +72,7 @@ export enum FeatureFlagsKeysEnum {
   IS_PUSH_UNREAD_COUNT_ENABLED = 'IS_PUSH_UNREAD_COUNT_ENABLED',
   IS_EXPIRED_TOKENS_REMOVAL_ENABLED = 'IS_EXPIRED_TOKENS_REMOVAL_ENABLED',
   IS_ANALYTICS_WORKFLOW_FILTER_ENABLED = 'IS_ANALYTICS_WORKFLOW_FILTER_ENABLED',
+  IS_CONTEXTUAL_HELP_DRAWER_ENABLED = 'IS_CONTEXTUAL_HELP_DRAWER_ENABLED',
 
   // Numeric flags
   MAX_WORKFLOW_LIMIT_NUMBER = 'MAX_WORKFLOW_LIMIT_NUMBER',